[data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate{transition-delay:.75s}[data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos]{transition-duration:.8s}[data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate{transition-delay:.8s}[data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos]{transition-duration:.85s}[data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate{transition-delay:.85s}[data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos]{transition-duration:.9s}[data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate{transition-delay:.9s}[data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos]{transition-duration:.95s}[data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate{transition-delay:.95s}[data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos]{transition-duration:1s}[data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate{transition-delay:1s}[data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos]{transition-duration:1.05s}[data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate{transition-delay:1.05s}[data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos]{transition-duration:1.1s}[data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate{transition-delay:1.1s}[data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos]{transition-duration:1.15s}[data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate{transition-delay:1.15s}[data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos]{transition-duration:1.2s}[data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate{transition-delay:1.2s}[data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos]{transition-duration:1.25s}[data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate{transition-delay:1.25s}[data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos]{transition-duration:1.3s}[data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate{transition-delay:1.3s}[data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos]{transition-duration:1.35s}[data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate{transition-delay:1.35s}[data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos]{transition-duration:1.4s}[data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate{transition-delay:1.4s}[data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos]{transition-duration:1.45s}[data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate{transition-delay:1.45s}[data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos]{transition-duration:1.5s}[data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate{transition-delay:1.5s}[data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos]{transition-duration:1.55s}[data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate{transition-delay:1.55s}[data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos]{transition-duration:1.6s}[data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate{transition-delay:1.6s}[data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos]{transition-duration:1.65s}[data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate{transition-delay:1.65s}[data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos]{transition-duration:1.7s}[data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate{transition-delay:1.7s}[data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos]{transition-duration:1.75s}[data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate{transition-delay:1.75s}[data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos]{transition-duration:1.8s}[data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate{transition-delay:1.8s}[data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos]{transition-duration:1.85s}[data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate{transition-delay:1.85s}[data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos]{transition-duration:1.9s}[data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate{transition-delay:1.9s}[data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos]{transition-duration:1.95s}[data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate{transition-delay:1.95s}[data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos]{transition-duration:2s}[data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate{transition-delay:2s}[data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos]{transition-duration:2.05s}[data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate{transition-delay:2.05s}[data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos]{transition-duration:2.1s}[data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate{transition-delay:2.1s}[data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos]{transition-duration:2.15s}[data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate{transition-delay:2.15s}[data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos]{transition-duration:2.2s}[data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate{transition-delay:2.2s}[data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos]{transition-duration:2.25s}[data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate{transition-delay:2.25s}[data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos]{transition-duration:2.3s}[data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate{transition-delay:2.3s}[data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos]{transition-duration:2.35s}[data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate{transition-delay:2.35s}[data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos]{transition-duration:2.4s}[data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate{transition-delay:2.4s}[data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos]{transition-duration:2.45s}[data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate{transition-delay:2.45s}[data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos]{transition-duration:2.5s}[data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate{transition-delay:2.5s}[data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos]{transition-duration:2.55s}[data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate{transition-delay:2.55s}[data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos]{transition-duration:2.6s}[data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate{transition-delay:2.6s}[data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos]{transition-duration:2.65s}[data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate{transition-delay:2.65s}[data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos]{transition-duration:2.7s}[data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate{transition-delay:2.7s}[data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos]{transition-duration:2.75s}[data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate{transition-delay:2.75s}[data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos]{transition-duration:2.8s}[data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate{transition-delay:2.8s}[data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos]{transition-duration:2.85s}[data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate{transition-delay:2.85s}[data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos]{transition-duration:2.9s}[data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate{transition-delay:2.9s}[data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos]{transition-duration:2.95s}[data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate{transition-delay:2.95s}[data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos]{transition-duration:3s}[data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos]{transition-delay:0s}[data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate{transition-delay:3s}[data-aos]{pointer-events:none}[data-aos].aos-animate{pointer-events:auto}[data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos]{transition-timing-function:cubic-bezier(.25,.25,.75,.75)}[data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{transition-timing-function:ease}[data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos]{transition-timing-function:ease-in}[data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos]{transition-timing-function:ease-out}[data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos]{transition-timing-function:ease-in-out}[data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos]{transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos]{transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos]{transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos]{transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}@media screen{html:not(.no-js) [data-aos^=fade][data-aos^=fade]{opacity:0;transition-property:opacity,transform}html:not(.no-js) [data-aos^=fade][data-aos^=fade].aos-animate{opacity:1;transform:none}html:not(.no-js) [data-aos=fade-up]{transform:translate3d(0,100px,0)}html:not(.no-js) [data-aos=fade-down]{transform:translate3d(0,-100px,0)}html:not(.no-js) [data-aos=fade-right]{transform:translate3d(-100px,0,0)}html:not(.no-js) [data-aos=fade-left]{transform:translate3d(100px,0,0)}html:not(.no-js) [data-aos=fade-up-right]{transform:translate3d(-100px,100px,0)}html:not(.no-js) [data-aos=fade-up-left]{transform:translate3d(100px,100px,0)}html:not(.no-js) [data-aos=fade-down-right]{transform:translate3d(-100px,-100px,0)}html:not(.no-js) [data-aos=fade-down-left]{transform:translate3d(100px,-100px,0)}html:not(.no-js) [data-aos^=zoom][data-aos^=zoom]{opacity:0;transition-property:opacity,transform}html:not(.no-js) [data-aos^=zoom][data-aos^=zoom].aos-animate{opacity:1;transform:translateZ(0) scale(1)}html:not(.no-js) [data-aos=zoom-in]{transform:scale(.6)}html:not(.no-js) [data-aos=zoom-in-up]{transform:translate3d(0,100px,0) scale(.6)}html:not(.no-js) [data-aos=zoom-in-down]{transform:translate3d(0,-100px,0) scale(.6)}html:not(.no-js) [data-aos=zoom-in-right]{transform:translate3d(-100px,0,0) scale(.6)}html:not(.no-js) [data-aos=zoom-in-left]{transform:translate3d(100px,0,0) scale(.6)}html:not(.no-js) [data-aos=zoom-out]{transform:scale(1.2)}html:not(.no-js) [data-aos=zoom-out-up]{transform:translate3d(0,100px,0) scale(1.2)}html:not(.no-js) [data-aos=zoom-out-down]{transform:translate3d(0,-100px,0) scale(1.2)}html:not(.no-js) [data-aos=zoom-out-right]{transform:translate3d(-100px,0,0) scale(1.2)}html:not(.no-js) [data-aos=zoom-out-left]{transform:translate3d(100px,0,0) scale(1.2)}html:not(.no-js) [data-aos^=slide][data-aos^=slide]{transition-property:transform;visibility:hidden}html:not(.no-js) [data-aos^=slide][data-aos^=slide].aos-animate{visibility:visible;transform:translateZ(0)}html:not(.no-js) [data-aos=slide-up]{transform:translate3d(0,100%,0)}html:not(.no-js) [data-aos=slide-down]{transform:translate3d(0,-100%,0)}html:not(.no-js) [data-aos=slide-right]{transform:translate3d(-100%,0,0)}html:not(.no-js) [data-aos=slide-left]{transform:translate3d(100%,0,0)}html:not(.no-js) [data-aos^=flip][data-aos^=flip]{backface-visibility:hidden;transition-property:transform}html:not(.no-js) [data-aos=flip-left]{transform:perspective(2500px) rotateY(-100deg)}html:not(.no-js) [data-aos=flip-left].aos-animate{transform:perspective(2500px) rotateY(0)}html:not(.no-js) [data-aos=flip-right]{transform:perspective(2500px) rotateY(100deg)}html:not(.no-js) [data-aos=flip-right].aos-animate{transform:perspective(2500px) rotateY(0)}html:not(.no-js) [data-aos=flip-up]{transform:perspective(2500px) rotateX(-100deg)}html:not(.no-js) [data-aos=flip-up].aos-animate{transform:perspective(2500px) rotateX(0)}html:not(.no-js) [data-aos=flip-down]{transform:perspective(2500px) rotateX(100deg)}html:not(.no-js) [data-aos=flip-down].aos-animate{transform:perspective(2500px) rotateX(0)}} .select2-container { box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: white; border: 1px solid #aaa; border-radius: 4px; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 6px; -moz-user-select: none; user-select: none; -webkit-user-select: none; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--open .select2-dropdown--below { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; height: 1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; white-space: nowrap !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; padding: 1px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #ddd; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #5897fb; color: white; } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 28px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } :host,:root{--vs-colors--lightest:rgba(60,60,60,0.26);--vs-colors--light:rgba(60,60,60,0.5);--vs-colors--dark:#333;--vs-colors--darkest:rgba(0,0,0,0.15);--vs-search-input-color:inherit;--vs-search-input-bg:#fff;--vs-search-input-placeholder-color:inherit;--vs-font-size:1rem;--vs-line-height:1.4;--vs-state-disabled-bg:#f8f8f8;--vs-state-disabled-color:var(--vs-colors--light);--vs-state-disabled-controls-color:var(--vs-colors--light);--vs-state-disabled-cursor:not-allowed;--vs-border-color:var(--vs-colors--lightest);--vs-border-width:1px;--vs-border-style:solid;--vs-border-radius:4px;--vs-actions-padding:4px 6px 0 3px;--vs-controls-color:var(--vs-colors--light);--vs-controls-size:1;--vs-controls--deselect-text-shadow:0 1px 0 #fff;--vs-selected-bg:#f0f0f0;--vs-selected-color:var(--vs-colors--dark);--vs-selected-border-color:var(--vs-border-color);--vs-selected-border-style:var(--vs-border-style);--vs-selected-border-width:var(--vs-border-width);--vs-dropdown-bg:#fff;--vs-dropdown-color:inherit;--vs-dropdown-z-index:1000;--vs-dropdown-min-width:160px;--vs-dropdown-max-height:350px;--vs-dropdown-box-shadow:0px 3px 6px 0px var(--vs-colors--darkest);--vs-dropdown-option-bg:#000;--vs-dropdown-option-color:var(--vs-dropdown-color);--vs-dropdown-option-padding:3px 20px;--vs-dropdown-option--active-bg:#5897fb;--vs-dropdown-option--active-color:#fff;--vs-dropdown-option--deselect-bg:#fb5858;--vs-dropdown-option--deselect-color:#fff;--vs-transition-timing-function:cubic-bezier(1,-0.115,0.975,0.855);--vs-transition-duration:150ms}.v-select{font-family:inherit;position:relative}.v-select,.v-select *{box-sizing:border-box}:root{--vs-transition-timing-function:cubic-bezier(1,0.5,0.8,1);--vs-transition-duration:0.15s}@keyframes vSelectSpinner{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.vs__fade-enter-active,.vs__fade-leave-active{pointer-events:none;transition:opacity var(--vs-transition-duration) var(--vs-transition-timing-function)}.vs__fade-enter,.vs__fade-leave-to{opacity:0}:root{--vs-disabled-bg:var(--vs-state-disabled-bg);--vs-disabled-color:var(--vs-state-disabled-color);--vs-disabled-cursor:var(--vs-state-disabled-cursor)}.vs--disabled .vs__clear,.vs--disabled .vs__dropdown-toggle,.vs--disabled .vs__open-indicator,.vs--disabled .vs__search,.vs--disabled .vs__selected{background-color:var(--vs-disabled-bg);cursor:var(--vs-disabled-cursor)}.v-select[dir=rtl] .vs__actions{padding:0 3px 0 6px}.v-select[dir=rtl] .vs__clear{margin-left:6px;margin-right:0}.v-select[dir=rtl] .vs__deselect{margin-left:0;margin-right:2px}.v-select[dir=rtl] .vs__dropdown-menu{text-align:right}.vs__dropdown-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--vs-search-input-bg);border:var(--vs-border-width) var(--vs-border-style) var(--vs-border-color);border-radius:var(--vs-border-radius);display:flex;padding:0 0 4px;white-space:normal}.vs__selected-options{display:flex;flex-basis:100%;flex-grow:1;flex-wrap:wrap;padding:0 2px;position:relative}.vs__actions{align-items:center;display:flex;padding:var(--vs-actions-padding)}.vs--searchable .vs__dropdown-toggle{cursor:text}.vs--unsearchable .vs__dropdown-toggle{cursor:pointer}.vs--open .vs__dropdown-toggle{border-bottom-color:transparent;border-bottom-left-radius:0;border-bottom-right-radius:0}.vs__open-indicator{fill:var(--vs-controls-color);transform:scale(var(--vs-controls-size));transition:transform var(--vs-transition-duration) var(--vs-transition-timing-function);transition-timing-function:var(--vs-transition-timing-function)}.vs--open .vs__open-indicator{transform:rotate(180deg) scale(var(--vs-controls-size))}.vs--loading .vs__open-indicator{opacity:0}.vs__clear{fill:var(--vs-controls-color);background-color:transparent;border:0;cursor:pointer;margin-right:8px;padding:0}.vs__dropdown-menu{background:var(--vs-dropdown-bg);border:var(--vs-border-width) var(--vs-border-style) var(--vs-border-color);border-radius:0 0 var(--vs-border-radius) var(--vs-border-radius);border-top-style:none;box-shadow:var(--vs-dropdown-box-shadow);box-sizing:border-box;color:var(--vs-dropdown-color);display:block;left:0;list-style:none;margin:0;max-height:var(--vs-dropdown-max-height);min-width:var(--vs-dropdown-min-width);overflow-y:auto;padding:5px 0;position:absolute;text-align:left;top:calc(100% - var(--vs-border-width));width:100%;z-index:var(--vs-dropdown-z-index)}.vs__no-options{text-align:center}.vs__dropdown-option{clear:both;color:var(--vs-dropdown-option-color);cursor:pointer;display:block;line-height:1.42857143;padding:var(--vs-dropdown-option-padding);white-space:nowrap}.vs__dropdown-option--highlight{background:var(--vs-dropdown-option--active-bg);color:var(--vs-dropdown-option--active-color)}.vs__dropdown-option--deselect{background:var(--vs-dropdown-option--deselect-bg);color:var(--vs-dropdown-option--deselect-color)}.vs__dropdown-option--disabled{background:var(--vs-state-disabled-bg);color:var(--vs-state-disabled-color);cursor:var(--vs-state-disabled-cursor)}.vs__selected{align-items:center;background-color:var(--vs-selected-bg);border:var(--vs-selected-border-width) var(--vs-selected-border-style) var(--vs-selected-border-color);border-radius:var(--vs-border-radius);color:var(--vs-selected-color);display:flex;line-height:var(--vs-line-height);margin:4px 2px 0;padding:0 .25em;z-index:0}.vs__deselect{fill:var(--vs-controls-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;cursor:pointer;display:inline-flex;margin-left:4px;padding:0;text-shadow:var(--vs-controls--deselect-text-shadow)}.vs--single .vs__selected{background-color:transparent;border-color:transparent}.vs--single.vs--loading .vs__selected,.vs--single.vs--open .vs__selected{opacity:.4;position:absolute}.vs--single.vs--searching .vs__selected{display:none}.vs__search::-webkit-search-cancel-button{display:none}.vs__search::-ms-clear,.vs__search::-webkit-search-decoration,.vs__search::-webkit-search-results-button,.vs__search::-webkit-search-results-decoration{display:none}.vs__search,.vs__search:focus{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:1px solid transparent;border-left:none;box-shadow:none;color:var(--vs-search-input-color);flex-grow:1;font-size:var(--vs-font-size);line-height:var(--vs-line-height);margin:4px 0 0;max-width:100%;outline:none;padding:0 7px;width:0;z-index:1}.vs__search::-moz-placeholder{color:var(--vs-search-input-placeholder-color)}.vs__search::placeholder{color:var(--vs-search-input-placeholder-color)}.vs--unsearchable .vs__search{opacity:1}.vs--unsearchable:not(.vs--disabled) .vs__search{cursor:pointer}.vs--single.vs--searching:not(.vs--open):not(.vs--loading) .vs__search{opacity:.2}.vs__spinner{align-self:center;animation:vSelectSpinner 1.1s linear infinite;border:.9em solid hsla(0,0%,39%,.1);border-left-color:rgba(60,60,60,.45);font-size:5px;opacity:0;overflow:hidden;text-indent:-9999em;transform:translateZ(0) scale(var(--vs-controls--spinner-size,var(--vs-controls-size)));transition:opacity .1s}.vs__spinner,.vs__spinner:after{border-radius:50%;height:5em;transform:scale(var(--vs-controls--spinner-size,var(--vs-controls-size)));width:5em}.vs--loading .vs__spinner{opacity:1} .daterangepicker { position: absolute; color: inherit; background-color: #fff; border-radius: 4px; border: 1px solid #ddd; width: 278px; max-width: none; padding: 0; margin-top: 7px; top: 100px; left: 20px; z-index: 3001; display: none; font-family: arial; font-size: 15px; line-height: 1em; } .daterangepicker:before, .daterangepicker:after { position: absolute; display: inline-block; border-bottom-color: rgba(0, 0, 0, 0.2); content: ''; } .daterangepicker:before { top: -7px; border-right: 7px solid transparent; border-left: 7px solid transparent; border-bottom: 7px solid #ccc; } .daterangepicker:after { top: -6px; border-right: 6px solid transparent; border-bottom: 6px solid #fff; border-left: 6px solid transparent; } .daterangepicker.opensleft:before { right: 9px; } .daterangepicker.opensleft:after { right: 10px; } .daterangepicker.openscenter:before { left: 0; right: 0; width: 0; margin-left: auto; margin-right: auto; } .daterangepicker.openscenter:after { left: 0; right: 0; width: 0; margin-left: auto; margin-right: auto; } .daterangepicker.opensright:before { left: 9px; } .daterangepicker.opensright:after { left: 10px; } .daterangepicker.drop-up { margin-top: -7px; } .daterangepicker.drop-up:before { top: initial; bottom: -7px; border-bottom: initial; border-top: 7px solid #ccc; } .daterangepicker.drop-up:after { top: initial; bottom: -6px; border-bottom: initial; border-top: 6px solid #fff; } .daterangepicker.single .daterangepicker .ranges, .daterangepicker.single .drp-calendar { float: none; } .daterangepicker.single .drp-selected { display: none; } .daterangepicker.show-calendar .drp-calendar { display: block; } .daterangepicker.show-calendar .drp-buttons { display: block; } .daterangepicker.auto-apply .drp-buttons { display: none; } .daterangepicker .drp-calendar { display: none; max-width: 270px; } .daterangepicker .drp-calendar.left { padding: 8px 0 8px 8px; } .daterangepicker .drp-calendar.right { padding: 8px; } .daterangepicker .drp-calendar.single .calendar-table { border: none; } .daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span { color: #fff; border: solid black; border-width: 0 2px 2px 0; border-radius: 0; display: inline-block; padding: 3px; } .daterangepicker .calendar-table .next span { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); } .daterangepicker .calendar-table .prev span { transform: rotate(135deg); -webkit-transform: rotate(135deg); } .daterangepicker .calendar-table th, .daterangepicker .calendar-table td { white-space: nowrap; text-align: center; vertical-align: middle; min-width: 32px; width: 32px; height: 24px; line-height: 24px; font-size: 12px; border-radius: 4px; border: 1px solid transparent; white-space: nowrap; cursor: pointer; } .daterangepicker .calendar-table { border: 1px solid #fff; border-radius: 4px; background-color: #fff; } .daterangepicker .calendar-table table { width: 100%; margin: 0; border-spacing: 0; border-collapse: collapse; } .daterangepicker td.available:hover, .daterangepicker th.available:hover { background-color: #eee; border-color: transparent; color: inherit; } .daterangepicker td.week, .daterangepicker th.week { font-size: 80%; color: #ccc; } .daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date { background-color: #fff; border-color: transparent; color: #999; } .daterangepicker td.in-range { background-color: #ebf4f8; border-color: transparent; color: #000; border-radius: 0; } .daterangepicker td.start-date { border-radius: 4px 0 0 4px; } .daterangepicker td.end-date { border-radius: 0 4px 4px 0; } .daterangepicker td.start-date.end-date { border-radius: 4px; } .daterangepicker td.active, .daterangepicker td.active:hover { background-color: #357ebd; border-color: transparent; color: #fff; } .daterangepicker th.month { width: auto; } .daterangepicker td.disabled, .daterangepicker option.disabled { color: #999; cursor: not-allowed; text-decoration: line-through; } .daterangepicker select.monthselect, .daterangepicker select.yearselect { font-size: 12px; padding: 1px; height: auto; margin: 0; cursor: default; } .daterangepicker select.monthselect { margin-right: 2%; width: 56%; } .daterangepicker select.yearselect { width: 40%; } .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect { width: 50px; margin: 0 auto; background: #eee; border: 1px solid #eee; padding: 2px; outline: 0; font-size: 12px; } .daterangepicker .calendar-time { text-align: center; margin: 4px auto 0 auto; line-height: 30px; position: relative; } .daterangepicker .calendar-time select.disabled { color: #ccc; cursor: not-allowed; } .daterangepicker .drp-buttons { clear: both; text-align: right; padding: 8px; border-top: 1px solid #ddd; display: none; line-height: 12px; vertical-align: middle; } .daterangepicker .drp-selected { display: inline-block; font-size: 12px; padding-right: 8px; } .daterangepicker .drp-buttons .btn { margin-left: 8px; font-size: 12px; font-weight: bold; padding: 4px 8px; } .daterangepicker.show-ranges.single.rtl .drp-calendar.left { border-right: 1px solid #ddd; } .daterangepicker.show-ranges.single.ltr .drp-calendar.left { border-left: 1px solid #ddd; } .daterangepicker.show-ranges.rtl .drp-calendar.right { border-right: 1px solid #ddd; } .daterangepicker.show-ranges.ltr .drp-calendar.left { border-left: 1px solid #ddd; } .daterangepicker .ranges { float: none; text-align: left; margin: 0; } .daterangepicker.show-calendar .ranges { margin-top: 8px; } .daterangepicker .ranges ul { list-style: none; margin: 0 auto; padding: 0; width: 100%; } .daterangepicker .ranges li { font-size: 12px; padding: 8px 12px; cursor: pointer; } .daterangepicker .ranges li:hover { background-color: #eee; } .daterangepicker .ranges li.active { background-color: #08c; color: #fff; } /* Larger Screen Styling */ @media (min-width: 564px) { .daterangepicker { width: auto; } .daterangepicker .ranges ul { width: 140px; } .daterangepicker.single .ranges ul { width: 100%; } .daterangepicker.single .drp-calendar.left { clear: none; } .daterangepicker.single .ranges, .daterangepicker.single .drp-calendar { float: left; } .daterangepicker { direction: ltr; text-align: left; } .daterangepicker .drp-calendar.left { clear: left; margin-right: 0; } .daterangepicker .drp-calendar.left .calendar-table { border-right: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } .daterangepicker .drp-calendar.right { margin-left: 0; } .daterangepicker .drp-calendar.right .calendar-table { border-left: none; border-top-left-radius: 0; border-bottom-left-radius: 0; } .daterangepicker .drp-calendar.left .calendar-table { padding-right: 8px; } .daterangepicker .ranges, .daterangepicker .drp-calendar { float: left; } } @media (min-width: 730px) { .daterangepicker .ranges { width: auto; } .daterangepicker .ranges { float: left; } .daterangepicker.rtl .ranges { float: right; } .daterangepicker .drp-calendar.left { clear: none !important; } } /* This is the core CSS of Tooltipster */ /* GENERAL STRUCTURE RULES (do not edit this section) */ .tooltipster-base { /* this ensures that a constrained height set by functionPosition, if greater that the natural height of the tooltip, will be enforced in browsers that support display:flex */ display: flex; pointer-events: none; /* this may be overriden in JS for fixed position origins */ position: absolute; } .tooltipster-box { /* see .tooltipster-base. flex-shrink 1 is only necessary for IE10- and flex-basis auto for IE11- (at least) */ flex: 1 1 auto; } .tooltipster-content { /* prevents an overflow if the user adds padding to the div */ box-sizing: border-box; /* these make sure we'll be able to detect any overflow */ max-height: 100%; max-width: 100%; overflow: auto; } .tooltipster-ruler { /* these let us test the size of the tooltip without overflowing the window */ bottom: 0; left: 0; overflow: hidden; position: fixed; right: 0; top: 0; visibility: hidden; } /* ANIMATIONS */ /* Open/close animations */ /* fade */ .tooltipster-fade { opacity: 0; transition-property: opacity; } .tooltipster-fade.tooltipster-show { opacity: 1; } /* grow */ .tooltipster-grow { transform: scale(0,0); transition-property: transform; -webkit-backface-visibility: hidden; } .tooltipster-grow.tooltipster-show { transform: scale(1,1); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } /* swing */ .tooltipster-swing { opacity: 0; transform: rotateZ(4deg); transition-property: transform; } .tooltipster-swing.tooltipster-show { opacity: 1; transform: rotateZ(0deg); transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); } /* fall */ .tooltipster-fall { transition-property: top; transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-fall.tooltipster-initial { top: 0 !important; } .tooltipster-fall.tooltipster-show { } .tooltipster-fall.tooltipster-dying { transition-property: all; top: 0 !important; opacity: 0; } /* slide */ .tooltipster-slide { transition-property: left; transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-slide.tooltipster-initial { left: -40px !important; } .tooltipster-slide.tooltipster-show { } .tooltipster-slide.tooltipster-dying { transition-property: all; left: 0 !important; opacity: 0; } /* Update animations */ /* We use animations rather than transitions here because transition durations may be specified in the style tag due to animationDuration, and we try to avoid collisions and the use of !important */ /* fade */ @keyframes tooltipster-fading { 0% { opacity: 0; } 100% { opacity: 1; } } .tooltipster-update-fade { animation: tooltipster-fading 400ms; } /* rotate */ @keyframes tooltipster-rotating { 25% { transform: rotate(-2deg); } 75% { transform: rotate(2deg); } 100% { transform: rotate(0); } } .tooltipster-update-rotate { animation: tooltipster-rotating 600ms; } /* scale */ @keyframes tooltipster-scaling { 50% { transform: scale(1.1); } 100% { transform: scale(1); } } .tooltipster-update-scale { animation: tooltipster-scaling 600ms; } /** * DEFAULT STYLE OF THE SIDETIP PLUGIN * * All styles are "namespaced" with .tooltipster-sidetip to prevent * conflicts between plugins. */ /* .tooltipster-box */ .tooltipster-sidetip .tooltipster-box { background: #565656; border: 2px solid black; border-radius: 4px; } .tooltipster-sidetip.tooltipster-bottom .tooltipster-box { margin-top: 8px; } .tooltipster-sidetip.tooltipster-left .tooltipster-box { margin-right: 8px; } .tooltipster-sidetip.tooltipster-right .tooltipster-box { margin-left: 8px; } .tooltipster-sidetip.tooltipster-top .tooltipster-box { margin-bottom: 8px; } /* .tooltipster-content */ .tooltipster-sidetip .tooltipster-content { color: white; line-height: 18px; padding: 6px 14px; } /* .tooltipster-arrow : will keep only the zone of .tooltipster-arrow-uncropped that corresponds to the arrow we want to display */ .tooltipster-sidetip .tooltipster-arrow { overflow: hidden; position: absolute; } .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow { height: 10px; /* half the width, for centering */ margin-left: -10px; top: 0; width: 20px; } .tooltipster-sidetip.tooltipster-left .tooltipster-arrow { height: 20px; margin-top: -10px; right: 0; /* top 0 to keep the arrow from overflowing .tooltipster-base when it has not been positioned yet */ top: 0; width: 10px; } .tooltipster-sidetip.tooltipster-right .tooltipster-arrow { height: 20px; margin-top: -10px; left: 0; /* same as .tooltipster-left .tooltipster-arrow */ top: 0; width: 10px; } .tooltipster-sidetip.tooltipster-top .tooltipster-arrow { bottom: 0; height: 10px; margin-left: -10px; width: 20px; } /* common rules between .tooltipster-arrow-background and .tooltipster-arrow-border */ .tooltipster-sidetip .tooltipster-arrow-background, .tooltipster-sidetip .tooltipster-arrow-border { height: 0; position: absolute; width: 0; } /* .tooltipster-arrow-background */ .tooltipster-sidetip .tooltipster-arrow-background { border: 10px solid transparent; } .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background { border-bottom-color: #565656; left: 0; top: 3px; } .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background { border-left-color: #565656; left: -3px; top: 0; } .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background { border-right-color: #565656; left: 3px; top: 0; } .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background { border-top-color: #565656; left: 0; top: -3px; } /* .tooltipster-arrow-border */ .tooltipster-sidetip .tooltipster-arrow-border { border: 10px solid transparent; left: 0; top: 0; } .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border { border-bottom-color: black; } .tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border { border-left-color: black; } .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border { border-right-color: black; } .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border { border-top-color: black; } /* tooltipster-arrow-uncropped */ .tooltipster-sidetip .tooltipster-arrow-uncropped { position: relative; } .tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped { top: -10px; } .tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped { left: -10px; } /*! Flickity v2.3.0 https://flickity.metafizzy.co ---------------------------------------------- */ .flickity-enabled { position: relative; } .flickity-enabled:focus { outline: none; } .flickity-viewport { overflow: hidden; position: relative; height: 100%; } .flickity-slider { position: absolute; width: 100%; height: 100%; } /* draggable */ .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: grabbing; } /* ---- flickity-button ---- */ .flickity-button { position: absolute; background: hsla(0, 0%, 100%, 0.75); border: none; color: #333; } .flickity-button:hover { background: white; cursor: pointer; } .flickity-button:focus { outline: none; box-shadow: 0 0 0 5px #19F; } .flickity-button:active { opacity: 0.6; } .flickity-button:disabled { opacity: 0.3; cursor: auto; /* prevent disabled button from capturing pointer up event. #716 */ pointer-events: none; } .flickity-button-icon { fill: currentColor; } /* ---- previous/next buttons ---- */ .flickity-prev-next-button { top: 50%; width: 44px; height: 44px; border-radius: 50%; /* vertically center */ transform: translateY(-50%); } .flickity-prev-next-button.previous { left: 10px; } .flickity-prev-next-button.next { right: 10px; } /* right to left */ .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 10px; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px; } .flickity-prev-next-button .flickity-button-icon { position: absolute; left: 20%; top: 20%; width: 60%; height: 60%; } /* ---- page dots ---- */ .flickity-page-dots { position: absolute; width: 100%; bottom: -25px; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25; cursor: pointer; } .flickity-page-dots .dot.is-selected { opacity: 1; } /* Tabulator v4.9.3 (c) Oliver Folkerd */ .tabulator { position: relative; background-color: #fff; overflow: hidden; font-size: 14px; text-align: left; transform: translatez(0); } .tabulator[tabulator-layout="fitDataFill"] .tabulator-tableHolder .tabulator-table { min-width: 100%; } .tabulator[tabulator-layout="fitDataTable"] { display: inline-block; } .tabulator.tabulator-block-select { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .tabulator .tabulator-header { position: relative; box-sizing: border-box; width: 100%; border-bottom: 1px solid #999; background-color: #fff; color: #555; font-weight: bold; white-space: nowrap; overflow: hidden; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } .tabulator .tabulator-header.tabulator-header-hidden { display: none; } .tabulator .tabulator-header .tabulator-col { display: inline-block; position: relative; box-sizing: border-box; border-right: 1px solid #ddd; background-color: #fff; text-align: left; vertical-align: bottom; overflow: hidden; } .tabulator .tabulator-header .tabulator-col.tabulator-moving { position: absolute; border: 1px solid #999; background: #e6e6e6; pointer-events: none; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content { box-sizing: border-box; position: relative; padding: 4px; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-menu-button { padding: 0 8px; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-menu-button:hover { cursor: pointer; opacity: .6; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title-holder { position: relative; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title { box-sizing: border-box; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-title-editor { box-sizing: border-box; width: 100%; border: 1px solid #999; padding: 1px; background: #fff; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-header-menu-button + .tabulator-title-editor { width: calc(100% - 22px); } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter { display: flex; align-items: center; position: absolute; top: 0; bottom: 0; right: 4px; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #bbb; } .tabulator .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols { position: relative; display: flex; border-top: 1px solid #ddd; overflow: hidden; margin-right: -1px; } .tabulator .tabulator-header .tabulator-col:first-child .tabulator-col-resize-handle.prev { display: none; } .tabulator .tabulator-header .tabulator-col .tabulator-header-filter { position: relative; box-sizing: border-box; margin-top: 2px; width: 100%; text-align: center; } .tabulator .tabulator-header .tabulator-col .tabulator-header-filter textarea { height: auto !important; } .tabulator .tabulator-header .tabulator-col .tabulator-header-filter svg { margin-top: 3px; } .tabulator .tabulator-header .tabulator-col .tabulator-header-filter input::-ms-clear { width: 0; height: 0; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title { padding-right: 25px; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { cursor: pointer; background-color: #e6e6e6; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-col-sorter { color: #bbb; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-top: none; border-bottom: 6px solid #bbb; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="asc"] .tabulator-col-content .tabulator-col-sorter { color: #666; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="asc"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-top: none; border-bottom: 6px solid #666; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="desc"] .tabulator-col-content .tabulator-col-sorter { color: #666; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="desc"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow { border-bottom: none; border-top: 6px solid #666; color: #666; } .tabulator .tabulator-header .tabulator-col.tabulator-col-vertical .tabulator-col-content .tabulator-col-title { writing-mode: vertical-rl; text-orientation: mixed; display: flex; align-items: center; justify-content: center; } .tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-col-vertical-flip .tabulator-col-title { transform: rotate(180deg); } .tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-sortable .tabulator-col-title { padding-right: 0; padding-top: 20px; } .tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-sortable.tabulator-col-vertical-flip .tabulator-col-title { padding-right: 0; padding-bottom: 20px; } .tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-sortable .tabulator-col-sorter { justify-content: center; left: 0; right: 0; top: 4px; bottom: auto; } .tabulator .tabulator-header .tabulator-frozen { display: inline-block; position: absolute; z-index: 10; } .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left { border-right: 2px solid #ddd; } .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right { border-left: 2px solid #ddd; } .tabulator .tabulator-header .tabulator-calcs-holder { box-sizing: border-box; min-width: 600%; background: #f2f2f2 !important; border-top: 1px solid #ddd; border-bottom: 1px solid #999; overflow: hidden; } .tabulator .tabulator-header .tabulator-calcs-holder .tabulator-row { background: #f2f2f2 !important; } .tabulator .tabulator-header .tabulator-calcs-holder .tabulator-row .tabulator-col-resize-handle { display: none; } .tabulator .tabulator-header .tabulator-frozen-rows-holder { min-width: 600%; } .tabulator .tabulator-header .tabulator-frozen-rows-holder:empty { display: none; } .tabulator .tabulator-tableHolder { position: relative; width: 100%; white-space: nowrap; overflow: auto; -webkit-overflow-scrolling: touch; } .tabulator .tabulator-tableHolder:focus { outline: none; } .tabulator .tabulator-tableHolder .tabulator-placeholder { box-sizing: border-box; display: flex; align-items: center; width: 100%; } .tabulator .tabulator-tableHolder .tabulator-placeholder[tabulator-render-mode="virtual"] { min-height: 100%; min-width: 100%; } .tabulator .tabulator-tableHolder .tabulator-placeholder span { display: inline-block; margin: 0 auto; padding: 10px; color: #000; font-weight: bold; font-size: 20px; } .tabulator .tabulator-tableHolder .tabulator-table { position: relative; display: inline-block; background-color: #fff; white-space: nowrap; overflow: visible; color: #333; } .tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs { font-weight: bold; background: #f2f2f2 !important; } .tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs.tabulator-calcs-top { border-bottom: 2px solid #ddd; } .tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs.tabulator-calcs-bottom { border-top: 2px solid #ddd; } .tabulator .tabulator-col-resize-handle { position: absolute; right: 0; top: 0; bottom: 0; width: 5px; } .tabulator .tabulator-col-resize-handle.prev { left: 0; right: auto; } .tabulator .tabulator-col-resize-handle:hover { cursor: ew-resize; } .tabulator .tabulator-footer { padding: 5px 10px; border-top: 1px solid #999; background-color: #fff; text-align: right; color: #555; font-weight: bold; white-space: nowrap; user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } .tabulator .tabulator-footer .tabulator-calcs-holder { box-sizing: border-box; width: calc(100% + 20px); margin: -5px -10px 5px -10px; text-align: left; background: #f2f2f2 !important; border-bottom: 1px solid #fff; border-top: 1px solid #ddd; overflow: hidden; } .tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row { background: #f2f2f2 !important; } .tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row .tabulator-col-resize-handle { display: none; } .tabulator .tabulator-footer .tabulator-calcs-holder:only-child { margin-bottom: -5px; border-bottom: none; } .tabulator .tabulator-footer .tabulator-paginator { color: #555; font-family: inherit; font-weight: inherit; font-size: inherit; } .tabulator .tabulator-footer .tabulator-page-size { display: inline-block; margin: 0 5px; padding: 2px 5px; border: 1px solid #aaa; border-radius: 3px; } .tabulator .tabulator-footer .tabulator-pages { margin: 0 7px; } .tabulator .tabulator-footer .tabulator-page { display: inline-block; margin: 0 2px; padding: 2px 5px; border: 1px solid #aaa; border-radius: 3px; background: rgba(255, 255, 255, 0.2); } .tabulator .tabulator-footer .tabulator-page.active { color: #d00; } .tabulator .tabulator-footer .tabulator-page:disabled { opacity: .5; } .tabulator .tabulator-footer .tabulator-page:not(.disabled):hover { cursor: pointer; background: rgba(0, 0, 0, 0.2); color: #fff; } .tabulator .tabulator-loader { position: absolute; display: flex; align-items: center; top: 0; left: 0; z-index: 100; height: 100%; width: 100%; background: rgba(0, 0, 0, 0.4); text-align: center; } .tabulator .tabulator-loader .tabulator-loader-msg { display: inline-block; margin: 0 auto; padding: 10px 20px; border-radius: 10px; background: #fff; font-weight: bold; font-size: 16px; } .tabulator .tabulator-loader .tabulator-loader-msg.tabulator-loading { border: 4px solid #333; color: #000; } .tabulator .tabulator-loader .tabulator-loader-msg.tabulator-error { border: 4px solid #D00; color: #590000; } .tabulator-row { position: relative; box-sizing: border-box; min-height: 22px; background-color: #fff; border-bottom: 1px solid #ddd; } .tabulator-row:nth-child(even) { background-color: #fff; } .tabulator-row.tabulator-selectable:hover { background-color: #bbb; cursor: pointer; } .tabulator-row.tabulator-selected { background-color: #9ABCEA; } .tabulator-row.tabulator-selected:hover { background-color: #769BCC; cursor: pointer; } .tabulator-row.tabulator-moving { position: absolute; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; pointer-events: none !important; z-index: 15; } .tabulator-row .tabulator-row-resize-handle { position: absolute; right: 0; bottom: 0; left: 0; height: 5px; } .tabulator-row .tabulator-row-resize-handle.prev { top: 0; bottom: auto; } .tabulator-row .tabulator-row-resize-handle:hover { cursor: ns-resize; } .tabulator-row .tabulator-frozen { display: inline-block; position: absolute; background-color: inherit; z-index: 10; } .tabulator-row .tabulator-frozen.tabulator-frozen-left { border-right: 2px solid #ddd; } .tabulator-row .tabulator-frozen.tabulator-frozen-right { border-left: 2px solid #ddd; } .tabulator-row .tabulator-responsive-collapse { box-sizing: border-box; padding: 5px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } .tabulator-row .tabulator-responsive-collapse:empty { display: none; } .tabulator-row .tabulator-responsive-collapse table { font-size: 14px; } .tabulator-row .tabulator-responsive-collapse table tr td { position: relative; } .tabulator-row .tabulator-responsive-collapse table tr td:first-of-type { padding-right: 10px; } .tabulator-row .tabulator-cell { display: inline-block; position: relative; box-sizing: border-box; padding: 4px; border-right: 1px solid #ddd; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tabulator-row .tabulator-cell:last-of-type { border-right: none; } .tabulator-row .tabulator-cell.tabulator-editing { border: 1px solid #1D68CD; outline: none; padding: 0; } .tabulator-row .tabulator-cell.tabulator-editing input, .tabulator-row .tabulator-cell.tabulator-editing select { border: 1px; background: transparent; } .tabulator-row .tabulator-cell.tabulator-validation-fail { border: 1px solid #dd0000; } .tabulator-row .tabulator-cell.tabulator-validation-fail input, .tabulator-row .tabulator-cell.tabulator-validation-fail select { border: 1px; background: transparent; color: #dd0000; } .tabulator-row .tabulator-cell:first-child .tabulator-col-resize-handle.prev { display: none; } .tabulator-row .tabulator-cell.tabulator-row-handle { display: inline-flex; align-items: center; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; } .tabulator-row .tabulator-cell.tabulator-row-handle .tabulator-row-handle-box { width: 80%; } .tabulator-row .tabulator-cell.tabulator-row-handle .tabulator-row-handle-box .tabulator-row-handle-bar { width: 100%; height: 3px; margin-top: 2px; background: #666; } .tabulator-row .tabulator-cell .tabulator-data-tree-branch { display: inline-block; vertical-align: middle; height: 9px; width: 7px; margin-top: -9px; margin-right: 5px; border-bottom-left-radius: 1px; border-left: 2px solid #ddd; border-bottom: 2px solid #ddd; } .tabulator-row .tabulator-cell .tabulator-data-tree-control { display: inline-flex; justify-content: center; align-items: center; vertical-align: middle; height: 11px; width: 11px; margin-right: 5px; border: 1px solid #333; border-radius: 2px; background: rgba(0, 0, 0, 0.1); overflow: hidden; } .tabulator-row .tabulator-cell .tabulator-data-tree-control:hover { cursor: pointer; background: rgba(0, 0, 0, 0.2); } .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse { display: inline-block; position: relative; height: 7px; width: 1px; background: transparent; } .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse:after { position: absolute; content: ""; left: -3px; top: 3px; height: 1px; width: 7px; background: #333; } .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand { display: inline-block; position: relative; height: 7px; width: 1px; background: #333; } .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand:after { position: absolute; content: ""; left: -3px; top: 3px; height: 1px; width: 7px; background: #333; } .tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle { display: inline-flex; align-items: center; justify-content: center; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; height: 15px; width: 15px; border-radius: 20px; background: #666; color: #fff; font-weight: bold; font-size: 1.1em; } .tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle:hover { opacity: .7; } .tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle.open .tabulator-responsive-collapse-toggle-close { display: initial; } .tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle.open .tabulator-responsive-collapse-toggle-open { display: none; } .tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle .tabulator-responsive-collapse-toggle-close { display: none; } .tabulator-row .tabulator-cell .tabulator-traffic-light { display: inline-block; height: 14px; width: 14px; border-radius: 14px; } .tabulator-row.tabulator-group { box-sizing: border-box; border-bottom: 1px solid #999; border-right: 1px solid #ddd; border-top: 1px solid #999; padding: 5px; padding-left: 10px; background: #fafafa; font-weight: bold; min-width: 100%; } .tabulator-row.tabulator-group:hover { cursor: pointer; background-color: rgba(0, 0, 0, 0.1); } .tabulator-row.tabulator-group.tabulator-group-visible .tabulator-arrow { margin-right: 10px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #666; border-bottom: 0; } .tabulator-row.tabulator-group.tabulator-group-level-1 { padding-left: 30px; } .tabulator-row.tabulator-group.tabulator-group-level-2 { padding-left: 50px; } .tabulator-row.tabulator-group.tabulator-group-level-3 { padding-left: 70px; } .tabulator-row.tabulator-group.tabulator-group-level-4 { padding-left: 90px; } .tabulator-row.tabulator-group.tabulator-group-level-5 { padding-left: 110px; } .tabulator-row.tabulator-group .tabulator-group-toggle { display: inline-block; } .tabulator-row.tabulator-group .tabulator-arrow { display: inline-block; width: 0; height: 0; margin-right: 16px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 0; border-left: 6px solid #666; vertical-align: middle; } .tabulator-row.tabulator-group span { margin-left: 10px; color: #666; } .tabulator-menu { position: absolute; display: inline-block; box-sizing: border-box; background: #fff; border: 1px solid #ddd; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2); font-size: 14px; overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 10000; } .tabulator-menu .tabulator-menu-item { position: relative; box-sizing: border-box; padding: 5px 10px; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .tabulator-menu .tabulator-menu-item.tabulator-menu-item-disabled { opacity: .5; } .tabulator-menu .tabulator-menu-item:not(.tabulator-menu-item-disabled):hover { cursor: pointer; background: #fff; } .tabulator-menu .tabulator-menu-item.tabulator-menu-item-submenu { padding-right: 25px; } .tabulator-menu .tabulator-menu-item.tabulator-menu-item-submenu::after { display: inline-block; position: absolute; top: calc(5px + .4em); right: 10px; height: 7px; width: 7px; content: ''; border-width: 1px 1px 0 0; border-style: solid; border-color: #ddd; vertical-align: top; transform: rotate(45deg); } .tabulator-menu .tabulator-menu-separator { border-top: 1px solid #ddd; } .tabulator-edit-select-list { position: absolute; display: inline-block; box-sizing: border-box; max-height: 200px; background: #fff; border: 1px solid #ddd; font-size: 14px; overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 10000; } .tabulator-edit-select-list .tabulator-edit-select-list-item { padding: 4px; color: #333; } .tabulator-edit-select-list .tabulator-edit-select-list-item.active { color: #fff; background: #1D68CD; } .tabulator-edit-select-list .tabulator-edit-select-list-item.active.focused { outline: 1px solid rgba(255, 255, 255, 0.5); } .tabulator-edit-select-list .tabulator-edit-select-list-item.focused { outline: 1px solid #1D68CD; } .tabulator-edit-select-list .tabulator-edit-select-list-item:hover { cursor: pointer; color: #fff; background: #1D68CD; } .tabulator-edit-select-list .tabulator-edit-select-list-notice { padding: 4px; color: #333; text-align: center; } .tabulator-edit-select-list .tabulator-edit-select-list-group { border-bottom: 1px solid #ddd; padding: 4px; padding-top: 6px; color: #333; font-weight: bold; } .tabulator.tabulator-ltr { direction: ltr; } .tabulator.tabulator-rtl { text-align: initial; direction: rtl; } .tabulator.tabulator-rtl .tabulator-header .tabulator-col { text-align: initial; border-left: 1px solid #ddd; border-right: initial; } .tabulator.tabulator-rtl .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols { margin-right: initial; margin-left: -1px; } .tabulator.tabulator-rtl .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title { padding-right: 0; padding-left: 25px; } .tabulator.tabulator-rtl .tabulator-header .tabulator-col .tabulator-col-content .tabulator-arrow { left: 8px; right: initial; } .tabulator.tabulator-rtl .tabulator-row .tabulator-cell { border-right: initial; border-left: 1px solid #ddd; } .tabulator.tabulator-rtl .tabulator-row .tabulator-cell .tabulator-data-tree-branch { margin-right: initial; margin-left: 5px; border-bottom-left-radius: initial; border-bottom-right-radius: 1px; border-left: initial; border-right: 2px solid #ddd; } .tabulator.tabulator-rtl .tabulator-row .tabulator-cell .tabulator-data-tree-control { margin-right: initial; margin-left: 5px; } .tabulator.tabulator-rtl .tabulator-col-resize-handle { position: absolute; left: 0; right: auto; } .tabulator.tabulator-rtl .tabulator-col-resize-handle.prev { right: 0; left: auto; } .tabulator-print-fullscreen { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 10000; } body.tabulator-print-fullscreen-hide > *:not(.tabulator-print-fullscreen) { display: none !important; } .tabulator-print-table { border-collapse: collapse; } .tabulator-print-table .tabulator-print-table-group { box-sizing: border-box; border-bottom: 1px solid #999; border-right: 1px solid #ddd; border-top: 1px solid #999; padding: 5px; padding-left: 10px; background: #fafafa; font-weight: bold; min-width: 100%; } .tabulator-print-table .tabulator-print-table-group:hover { cursor: pointer; background-color: rgba(0, 0, 0, 0.1); } .tabulator-print-table .tabulator-print-table-group.tabulator-group-visible .tabulator-arrow { margin-right: 10px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #666; border-bottom: 0; } .tabulator-print-table .tabulator-print-table-group.tabulator-group-level-1 td { padding-left: 30px !important; } .tabulator-print-table .tabulator-print-table-group.tabulator-group-level-2 td { padding-left: 50px !important; } .tabulator-print-table .tabulator-print-table-group.tabulator-group-level-3 td { padding-left: 70px !important; } .tabulator-print-table .tabulator-print-table-group.tabulator-group-level-4 td { padding-left: 90px !important; } .tabulator-print-table .tabulator-print-table-group.tabulator-group-level-5 td { padding-left: 110px !important; } .tabulator-print-table .tabulator-print-table-group .tabulator-group-toggle { display: inline-block; } .tabulator-print-table .tabulator-print-table-group .tabulator-arrow { display: inline-block; width: 0; height: 0; margin-right: 16px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 0; border-left: 6px solid #666; vertical-align: middle; } .tabulator-print-table .tabulator-print-table-group span { margin-left: 10px; color: #666; } .tabulator-print-table .tabulator-data-tree-branch { display: inline-block; vertical-align: middle; height: 9px; width: 7px; margin-top: -9px; margin-right: 5px; border-bottom-left-radius: 1px; border-left: 2px solid #ddd; border-bottom: 2px solid #ddd; } .tabulator-print-table .tabulator-data-tree-control { display: inline-flex; justify-content: center; align-items: center; vertical-align: middle; height: 11px; width: 11px; margin-right: 5px; border: 1px solid #333; border-radius: 2px; background: rgba(0, 0, 0, 0.1); overflow: hidden; } .tabulator-print-table .tabulator-data-tree-control:hover { cursor: pointer; background: rgba(0, 0, 0, 0.2); } .tabulator-print-table .tabulator-data-tree-control .tabulator-data-tree-control-collapse { display: inline-block; position: relative; height: 7px; width: 1px; background: transparent; } .tabulator-print-table .tabulator-data-tree-control .tabulator-data-tree-control-collapse:after { position: absolute; content: ""; left: -3px; top: 3px; height: 1px; width: 7px; background: #333; } .tabulator-print-table .tabulator-data-tree-control .tabulator-data-tree-control-expand { display: inline-block; position: relative; height: 7px; width: 1px; background: #333; } .tabulator-print-table .tabulator-data-tree-control .tabulator-data-tree-control-expand:after { position: absolute; content: ""; left: -3px; top: 3px; height: 1px; width: 7px; background: #333; } /*! * Cropper.js v1.6.2 * https://fengyuanchen.github.io/cropperjs * * Copyright 2015-present Chen Fengyuan * Released under the MIT license * * Date: 2024-04-21T07:43:02.731Z */ .cropper-container { direction: ltr; font-size: 0; line-height: 0; position: relative; touch-action: none; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .cropper-container img { backface-visibility: hidden; display: block; height: 100%; image-orientation: 0deg; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 0 !important; width: 100%; } .cropper-wrap-box, .cropper-canvas, .cropper-drag-box, .cropper-crop-box, .cropper-modal { bottom: 0; left: 0; position: absolute; right: 0; top: 0; } .cropper-wrap-box, .cropper-canvas { overflow: hidden; } .cropper-drag-box { background-color: #fff; opacity: 0; } .cropper-modal { background-color: #000; opacity: 0.5; } .cropper-view-box { display: block; height: 100%; outline: 1px solid #39f; outline-color: rgba(51, 153, 255, 0.75); overflow: hidden; width: 100%; } .cropper-dashed { border: 0 dashed #eee; display: block; opacity: 0.5; position: absolute; } .cropper-dashed.dashed-h { border-bottom-width: 1px; border-top-width: 1px; height: calc(100% / 3); left: 0; top: calc(100% / 3); width: 100%; } .cropper-dashed.dashed-v { border-left-width: 1px; border-right-width: 1px; height: 100%; left: calc(100% / 3); top: 0; width: calc(100% / 3); } .cropper-center { display: block; height: 0; left: 50%; opacity: 0.75; position: absolute; top: 50%; width: 0; } .cropper-center::before, .cropper-center::after { background-color: #eee; content: ' '; display: block; position: absolute; } .cropper-center::before { height: 1px; left: -3px; top: 0; width: 7px; } .cropper-center::after { height: 7px; left: 0; top: -3px; width: 1px; } .cropper-face, .cropper-line, .cropper-point { display: block; height: 100%; opacity: 0.1; position: absolute; width: 100%; } .cropper-face { background-color: #fff; left: 0; top: 0; } .cropper-line { background-color: #39f; } .cropper-line.line-e { cursor: ew-resize; right: -3px; top: 0; width: 5px; } .cropper-line.line-n { cursor: ns-resize; height: 5px; left: 0; top: -3px; } .cropper-line.line-w { cursor: ew-resize; left: -3px; top: 0; width: 5px; } .cropper-line.line-s { bottom: -3px; cursor: ns-resize; height: 5px; left: 0; } .cropper-point { background-color: #39f; height: 5px; opacity: 0.75; width: 5px; } .cropper-point.point-e { cursor: ew-resize; margin-top: -3px; right: -3px; top: 50%; } .cropper-point.point-n { cursor: ns-resize; left: 50%; margin-left: -3px; top: -3px; } .cropper-point.point-w { cursor: ew-resize; left: -3px; margin-top: -3px; top: 50%; } .cropper-point.point-s { bottom: -3px; cursor: s-resize; left: 50%; margin-left: -3px; } .cropper-point.point-ne { cursor: nesw-resize; right: -3px; top: -3px; } .cropper-point.point-nw { cursor: nwse-resize; left: -3px; top: -3px; } .cropper-point.point-sw { bottom: -3px; cursor: nesw-resize; left: -3px; } .cropper-point.point-se { bottom: -3px; cursor: nwse-resize; height: 20px; opacity: 1; right: -3px; width: 20px; } @media (min-width: 768px) { .cropper-point.point-se { height: 15px; width: 15px; } } @media (min-width: 992px) { .cropper-point.point-se { height: 10px; width: 10px; } } @media (min-width: 1200px) { .cropper-point.point-se { height: 5px; opacity: 0.75; width: 5px; } } .cropper-point.point-se::before { background-color: #39f; bottom: -50%; content: ' '; display: block; height: 200%; opacity: 0; position: absolute; right: -50%; width: 200%; } .cropper-invisible { opacity: 0; } .cropper-bg { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC'); } .cropper-hide { display: block; height: 0; position: absolute; width: 0; } .cropper-hidden { display: none !important; } .cropper-move { cursor: move; } .cropper-crop { cursor: crosshair; } .cropper-disabled .cropper-drag-box, .cropper-disabled .cropper-face, .cropper-disabled .cropper-line, .cropper-disabled .cropper-point { cursor: not-allowed; } @charset "UTF-8"; /* Colors */ /* Additional */ :root { --green: #5ce02e; --green-rgb: 92,224,46; --light-green:#6DA152; --blue: #0DCAF0; --blue-rgb: 13,202,240; --blue-100: #0DCAF0; --yellow-light:#F0EA4F; --yellow: #FFCA10; --yellow-rgb: 255,202,16; --forecast: #FFCA10; --forecast-rgb: 255,202,16; --orange:#F2883E; --orange-100: #F29142; --alabaster-solid: #0e0e0e; --gallery-approx: #1c1c1c; --dark-green: #112D09; --dark-green-rgb: 17,45,9; --red: #dc2958; --red-rgb: 220,41,88; --dark-red: #340C17; --dark-red-rgb: 52,12,23; --white: #fff; --white24: rgba(255, 255, 255, 0.24); --white-rgb: 255,255,255; --white48: rgba(0, 0, 0, 0.48); --gray: #bbbbbb; --gray-rgb: 187,187,187; --gray-100: #666666; --gray-100-rgb: 102,102,102; --gray-200: #3a3a3a; --gray-200-rgb: 58,58,58; --gray-300: #232323; --gray-300-rgb: 35,35,35; --black-50: #1a1a1a; --black-50-rgb: 26,26,26; --black-100: #1c1c1c; --black-100-rgb: 28,28,28; --black-200: #181818; --black-200-rgb: 24,24,24; --black-300: #141414; --black-300-rgb: 20,20,20; --black-400: #0f0f0f; --black-400-rgb: 15,15,15; --black-500: #0b0b0b; --black-500-rgb: 11,11,11; --black-600: #070707; --black-600-rgb: 7,7,7; --black:#000000; --black-rgb: 0,0,0; --e2: #e2e2e2; --a1: #a1a1a1; --vietnam-card-bg: #1c1c1c; --autoplay-timeout:3500; } .inverted { --green: #3BAB14; --green-rgb: 59,171,20; --forecast: #8A6800; --forecast-rgb: 138,104,0; --dark-green: #112D09; --dark-green-rgb: 17,45,9; --red: #dc2958; --red-rgb: 220,41,88; --alabaster-solid: #fafafa; --gallery-approx: #EBEBEB; --dark-red: #340C17; --dark-red-rgb: 52,12,23; --white: black; --white24: rgba(0, 0, 0, 0.24); --white48: #6f6f6f; --white64: rgba(0, 0, 0, 0.64); --white-rgb: 0,0,0; --e2: #1d1d1d; --a1: #5e5e5e; --gray: #444444; --gray-rgb: 68,68,68; --gray-100: #999999; --gray-100-rgb: 153,153,153; --gray-200: #c5c5c5; --gray-200-rgb: 197,197,197; --gray-300: gainsboro; --gray-300-rgb: 220,220,220; --black-50: #F1F1F1; --black-50-rgb: 241,241,241; --black-100: #e3e3e3; --black-100-rgb: 227,227,227; --black-200: #e7e7e7; --black-200-rgb: 231,231,231; --black-300: #ebebeb; --black-300-rgb: 235,235,235; --black-400: #f0f0f0; --black-400-rgb: 240,240,240; --black-500: #f4f4f4; --black-500-rgb: 244,244,244; --black-600: #f8f8f8; --black-600-rgb: 248,248,248; --black: white; --black-rgb: 255,255,255; --vietnam-card-bg: #fff; } /* cyrillic-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxFIzIFKw.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxMIzIFKw.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* greek-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxEIzIFKw.woff2) format("woff2"); unicode-range: U+1F00-1FFF; } /* greek */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxLIzIFKw.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } /* vietnamese */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxHIzIFKw.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxGIzIFKw.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 100; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOkCnqEu92Fr1MmgVxIIzI.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fCRc4EsA.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fABc4EsA.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* greek-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fCBc4EsA.woff2) format("woff2"); unicode-range: U+1F00-1FFF; } /* greek */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fBxc4EsA.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } /* vietnamese */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fCxc4EsA.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* greek-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format("woff2"); unicode-range: U+1F00-1FFF; } /* greek */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } /* vietnamese */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fCRc4EsA.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* greek-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fCBc4EsA.woff2) format("woff2"); unicode-range: U+1F00-1FFF; } /* greek */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fBxc4EsA.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } /* vietnamese */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fCxc4EsA.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfCRc4EsA.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfABc4EsA.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* greek-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfCBc4EsA.woff2) format("woff2"); unicode-range: U+1F00-1FFF; } /* greek */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfBxc4EsA.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } /* vietnamese */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfCxc4EsA.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* cyrillic-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfCRc4EsA.woff2) format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; } /* cyrillic */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfABc4EsA.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; } /* greek-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfCBc4EsA.woff2) format("woff2"); unicode-range: U+1F00-1FFF; } /* greek */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfBxc4EsA.woff2) format("woff2"); unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; } /* vietnamese */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfCxc4EsA.woff2) format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; } /* latin-ext */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfChc4EsA.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: "Roboto"; font-style: normal; font-weight: 900; font-display: swap; src: url(https://fonts.gstatic.com/s/roboto/v32/KFOlCnqEu92Fr1MmYUtfBBc4.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* http://meyerweb.com/eric/tools/css/reset/ v4.0 | 20180602 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section { display: block; } /* HTML5 hidden-attribute fix for newer browsers */ *[hidden] { display: none; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } table { border-collapse: collapse; border-spacing: 0; } /*! * Bootstrap Grid v4.6.2 (https://getbootstrap.com/) * Copyright 2011-2022 The Bootstrap Authors * Copyright 2011-2022 Twitter, Inc. * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ html { box-sizing: border-box; -ms-overflow-style: scrollbar; } *, *::before, *::after { box-sizing: inherit; } .container, .container-fluid, .container-xl, .container-lg, .container-md, .container-sm { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 576px) { .container-sm, .container { max-width: 540px; } } @media (min-width: 768px) { .container-md, .container-sm, .container { max-width: 720px; } } @media (min-width: 992px) { .container-lg, .container-md, .container-sm, .container { max-width: 960px; } } @media (min-width: 1200px) { .container-xl, .container-lg, .container-md, .container-sm, .container { max-width: 1140px; } } .row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; } .no-gutters { margin-right: 0; margin-left: 0; } .no-gutters > .col, .no-gutters > [class*=col-] { padding-right: 0; padding-left: 0; } .col-xl, .col-xl-auto, .col-xl-12, .col-xl-11, .col-xl-10, .col-xl-9, .col-xl-8, .col-xl-7, .col-xl-6, .col-xl-5, .col-xl-4, .col-xl-3, .col-xl-2, .col-xl-1, .col-lg, .col-lg-auto, .col-lg-12, .col-lg-11, .col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .col-lg-5, .col-lg-4, .col-lg-3, .col-lg-2, .col-lg-1, .col-md, .col-md-auto, .col-md-12, .col-md-11, .col-md-10, .col-md-9, .col-md-8, .col-md-7, .col-md-6, .col-md-5, .col-md-4, .col-md-3, .col-md-2, .col-md-1, .col-sm, .col-sm-auto, .col-sm-12, .col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3, .col-sm-2, .col-sm-1, .col, .col-auto, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 { position: relative; width: 100%; padding-right: 15px; padding-left: 15px; } .col { flex-basis: 0; flex-grow: 1; max-width: 100%; } .row-cols-1 > * { flex: 0 0 100%; max-width: 100%; } .row-cols-2 > * { flex: 0 0 50%; max-width: 50%; } .row-cols-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .row-cols-4 > * { flex: 0 0 25%; max-width: 25%; } .row-cols-5 > * { flex: 0 0 20%; max-width: 20%; } .row-cols-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .col-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .col-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .col-3 { flex: 0 0 25%; max-width: 25%; } .col-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .col-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .col-6 { flex: 0 0 50%; max-width: 50%; } .col-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .col-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .col-9 { flex: 0 0 75%; max-width: 75%; } .col-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .col-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .col-12 { flex: 0 0 100%; max-width: 100%; } .order-first { order: -1; } .order-last { order: 13; } .order-0 { order: 0; } .order-1 { order: 1; } .order-2 { order: 2; } .order-3 { order: 3; } .order-4 { order: 4; } .order-5 { order: 5; } .order-6 { order: 6; } .order-7 { order: 7; } .order-8 { order: 8; } .order-9 { order: 9; } .order-10 { order: 10; } .order-11 { order: 11; } .order-12 { order: 12; } .offset-1 { margin-left: 8.33333333%; } .offset-2 { margin-left: 16.66666667%; } .offset-3 { margin-left: 25%; } .offset-4 { margin-left: 33.33333333%; } .offset-5 { margin-left: 41.66666667%; } .offset-6 { margin-left: 50%; } .offset-7 { margin-left: 58.33333333%; } .offset-8 { margin-left: 66.66666667%; } .offset-9 { margin-left: 75%; } .offset-10 { margin-left: 83.33333333%; } .offset-11 { margin-left: 91.66666667%; } @media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; max-width: 100%; } .row-cols-sm-1 > * { flex: 0 0 100%; max-width: 100%; } .row-cols-sm-2 > * { flex: 0 0 50%; max-width: 50%; } .row-cols-sm-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .row-cols-sm-4 > * { flex: 0 0 25%; max-width: 25%; } .row-cols-sm-5 > * { flex: 0 0 20%; max-width: 20%; } .row-cols-sm-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-sm-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .col-sm-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .col-sm-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .col-sm-3 { flex: 0 0 25%; max-width: 25%; } .col-sm-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .col-sm-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .col-sm-6 { flex: 0 0 50%; max-width: 50%; } .col-sm-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .col-sm-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .col-sm-9 { flex: 0 0 75%; max-width: 75%; } .col-sm-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .col-sm-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .col-sm-12 { flex: 0 0 100%; max-width: 100%; } .order-sm-first { order: -1; } .order-sm-last { order: 13; } .order-sm-0 { order: 0; } .order-sm-1 { order: 1; } .order-sm-2 { order: 2; } .order-sm-3 { order: 3; } .order-sm-4 { order: 4; } .order-sm-5 { order: 5; } .order-sm-6 { order: 6; } .order-sm-7 { order: 7; } .order-sm-8 { order: 8; } .order-sm-9 { order: 9; } .order-sm-10 { order: 10; } .order-sm-11 { order: 11; } .order-sm-12 { order: 12; } .offset-sm-0 { margin-left: 0; } .offset-sm-1 { margin-left: 8.33333333%; } .offset-sm-2 { margin-left: 16.66666667%; } .offset-sm-3 { margin-left: 25%; } .offset-sm-4 { margin-left: 33.33333333%; } .offset-sm-5 { margin-left: 41.66666667%; } .offset-sm-6 { margin-left: 50%; } .offset-sm-7 { margin-left: 58.33333333%; } .offset-sm-8 { margin-left: 66.66666667%; } .offset-sm-9 { margin-left: 75%; } .offset-sm-10 { margin-left: 83.33333333%; } .offset-sm-11 { margin-left: 91.66666667%; } } @media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; } .row-cols-md-1 > * { flex: 0 0 100%; max-width: 100%; } .row-cols-md-2 > * { flex: 0 0 50%; max-width: 50%; } .row-cols-md-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .row-cols-md-4 > * { flex: 0 0 25%; max-width: 25%; } .row-cols-md-5 > * { flex: 0 0 20%; max-width: 20%; } .row-cols-md-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-md-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .col-md-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .col-md-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .col-md-3 { flex: 0 0 25%; max-width: 25%; } .col-md-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .col-md-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .col-md-6 { flex: 0 0 50%; max-width: 50%; } .col-md-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .col-md-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .col-md-9 { flex: 0 0 75%; max-width: 75%; } .col-md-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .col-md-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .col-md-12 { flex: 0 0 100%; max-width: 100%; } .order-md-first { order: -1; } .order-md-last { order: 13; } .order-md-0 { order: 0; } .order-md-1 { order: 1; } .order-md-2 { order: 2; } .order-md-3 { order: 3; } .order-md-4 { order: 4; } .order-md-5 { order: 5; } .order-md-6 { order: 6; } .order-md-7 { order: 7; } .order-md-8 { order: 8; } .order-md-9 { order: 9; } .order-md-10 { order: 10; } .order-md-11 { order: 11; } .order-md-12 { order: 12; } .offset-md-0 { margin-left: 0; } .offset-md-1 { margin-left: 8.33333333%; } .offset-md-2 { margin-left: 16.66666667%; } .offset-md-3 { margin-left: 25%; } .offset-md-4 { margin-left: 33.33333333%; } .offset-md-5 { margin-left: 41.66666667%; } .offset-md-6 { margin-left: 50%; } .offset-md-7 { margin-left: 58.33333333%; } .offset-md-8 { margin-left: 66.66666667%; } .offset-md-9 { margin-left: 75%; } .offset-md-10 { margin-left: 83.33333333%; } .offset-md-11 { margin-left: 91.66666667%; } } @media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; max-width: 100%; } .row-cols-lg-1 > * { flex: 0 0 100%; max-width: 100%; } .row-cols-lg-2 > * { flex: 0 0 50%; max-width: 50%; } .row-cols-lg-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .row-cols-lg-4 > * { flex: 0 0 25%; max-width: 25%; } .row-cols-lg-5 > * { flex: 0 0 20%; max-width: 20%; } .row-cols-lg-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-lg-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .col-lg-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .col-lg-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .col-lg-3 { flex: 0 0 25%; max-width: 25%; } .col-lg-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .col-lg-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .col-lg-6 { flex: 0 0 50%; max-width: 50%; } .col-lg-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .col-lg-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .col-lg-9 { flex: 0 0 75%; max-width: 75%; } .col-lg-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .col-lg-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .col-lg-12 { flex: 0 0 100%; max-width: 100%; } .order-lg-first { order: -1; } .order-lg-last { order: 13; } .order-lg-0 { order: 0; } .order-lg-1 { order: 1; } .order-lg-2 { order: 2; } .order-lg-3 { order: 3; } .order-lg-4 { order: 4; } .order-lg-5 { order: 5; } .order-lg-6 { order: 6; } .order-lg-7 { order: 7; } .order-lg-8 { order: 8; } .order-lg-9 { order: 9; } .order-lg-10 { order: 10; } .order-lg-11 { order: 11; } .order-lg-12 { order: 12; } .offset-lg-0 { margin-left: 0; } .offset-lg-1 { margin-left: 8.33333333%; } .offset-lg-2 { margin-left: 16.66666667%; } .offset-lg-3 { margin-left: 25%; } .offset-lg-4 { margin-left: 33.33333333%; } .offset-lg-5 { margin-left: 41.66666667%; } .offset-lg-6 { margin-left: 50%; } .offset-lg-7 { margin-left: 58.33333333%; } .offset-lg-8 { margin-left: 66.66666667%; } .offset-lg-9 { margin-left: 75%; } .offset-lg-10 { margin-left: 83.33333333%; } .offset-lg-11 { margin-left: 91.66666667%; } } @media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; max-width: 100%; } .row-cols-xl-1 > * { flex: 0 0 100%; max-width: 100%; } .row-cols-xl-2 > * { flex: 0 0 50%; max-width: 50%; } .row-cols-xl-3 > * { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; } .row-cols-xl-4 > * { flex: 0 0 25%; max-width: 25%; } .row-cols-xl-5 > * { flex: 0 0 20%; max-width: 20%; } .row-cols-xl-6 > * { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; } .col-xl-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .col-xl-1 { flex: 0 0 8.33333333%; max-width: 8.33333333%; } .col-xl-2 { flex: 0 0 16.66666667%; max-width: 16.66666667%; } .col-xl-3 { flex: 0 0 25%; max-width: 25%; } .col-xl-4 { flex: 0 0 33.33333333%; max-width: 33.33333333%; } .col-xl-5 { flex: 0 0 41.66666667%; max-width: 41.66666667%; } .col-xl-6 { flex: 0 0 50%; max-width: 50%; } .col-xl-7 { flex: 0 0 58.33333333%; max-width: 58.33333333%; } .col-xl-8 { flex: 0 0 66.66666667%; max-width: 66.66666667%; } .col-xl-9 { flex: 0 0 75%; max-width: 75%; } .col-xl-10 { flex: 0 0 83.33333333%; max-width: 83.33333333%; } .col-xl-11 { flex: 0 0 91.66666667%; max-width: 91.66666667%; } .col-xl-12 { flex: 0 0 100%; max-width: 100%; } .order-xl-first { order: -1; } .order-xl-last { order: 13; } .order-xl-0 { order: 0; } .order-xl-1 { order: 1; } .order-xl-2 { order: 2; } .order-xl-3 { order: 3; } .order-xl-4 { order: 4; } .order-xl-5 { order: 5; } .order-xl-6 { order: 6; } .order-xl-7 { order: 7; } .order-xl-8 { order: 8; } .order-xl-9 { order: 9; } .order-xl-10 { order: 10; } .order-xl-11 { order: 11; } .order-xl-12 { order: 12; } .offset-xl-0 { margin-left: 0; } .offset-xl-1 { margin-left: 8.33333333%; } .offset-xl-2 { margin-left: 16.66666667%; } .offset-xl-3 { margin-left: 25%; } .offset-xl-4 { margin-left: 33.33333333%; } .offset-xl-5 { margin-left: 41.66666667%; } .offset-xl-6 { margin-left: 50%; } .offset-xl-7 { margin-left: 58.33333333%; } .offset-xl-8 { margin-left: 66.66666667%; } .offset-xl-9 { margin-left: 75%; } .offset-xl-10 { margin-left: 83.33333333%; } .offset-xl-11 { margin-left: 91.66666667%; } } .d-none { display: none !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-block { display: block !important; } .d-table { display: table !important; } .d-table-row { display: table-row !important; } .d-table-cell { display: table-cell !important; } .d-flex { display: flex !important; } .d-inline-flex { display: inline-flex !important; } @media (min-width: 576px) { .d-sm-none { display: none !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-block { display: block !important; } .d-sm-table { display: table !important; } .d-sm-table-row { display: table-row !important; } .d-sm-table-cell { display: table-cell !important; } .d-sm-flex { display: flex !important; } .d-sm-inline-flex { display: inline-flex !important; } } @media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-block { display: block !important; } .d-md-table { display: table !important; } .d-md-table-row { display: table-row !important; } .d-md-table-cell { display: table-cell !important; } .d-md-flex { display: flex !important; } .d-md-inline-flex { display: inline-flex !important; } } @media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-block { display: block !important; } .d-lg-table { display: table !important; } .d-lg-table-row { display: table-row !important; } .d-lg-table-cell { display: table-cell !important; } .d-lg-flex { display: flex !important; } .d-lg-inline-flex { display: inline-flex !important; } } @media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-block { display: block !important; } .d-xl-table { display: table !important; } .d-xl-table-row { display: table-row !important; } .d-xl-table-cell { display: table-cell !important; } .d-xl-flex { display: flex !important; } .d-xl-inline-flex { display: inline-flex !important; } } @media print { .d-print-none { display: none !important; } .d-print-inline { display: inline !important; } .d-print-inline-block { display: inline-block !important; } .d-print-block { display: block !important; } .d-print-table { display: table !important; } .d-print-table-row { display: table-row !important; } .d-print-table-cell { display: table-cell !important; } .d-print-flex { display: flex !important; } .d-print-inline-flex { display: inline-flex !important; } } .flex-row { flex-direction: row !important; } .flex-column { flex-direction: column !important; } .flex-row-reverse { flex-direction: row-reverse !important; } .flex-column-reverse { flex-direction: column-reverse !important; } .flex-wrap { flex-wrap: wrap !important; } .flex-nowrap { flex-wrap: nowrap !important; } .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-fill { flex: 1 1 auto !important; } .flex-grow-0 { flex-grow: 0 !important; } .flex-grow-1 { flex-grow: 1 !important; } .flex-shrink-0 { flex-shrink: 0 !important; } .flex-shrink-1 { flex-shrink: 1 !important; } .justify-content-start { justify-content: flex-start !important; } .justify-content-end { justify-content: flex-end !important; } .justify-content-center { justify-content: center !important; } .justify-content-between { justify-content: space-between !important; } .justify-content-around { justify-content: space-around !important; } .align-items-start { align-items: flex-start !important; } .align-items-end { align-items: flex-end !important; } .align-items-center { align-items: center !important; } .align-items-baseline { align-items: baseline !important; } .align-items-stretch { align-items: stretch !important; } .align-content-start { align-content: flex-start !important; } .align-content-end { align-content: flex-end !important; } .align-content-center { align-content: center !important; } .align-content-between { align-content: space-between !important; } .align-content-around { align-content: space-around !important; } .align-content-stretch { align-content: stretch !important; } .align-self-auto { align-self: auto !important; } .align-self-start { align-self: flex-start !important; } .align-self-end { align-self: flex-end !important; } .align-self-center { align-self: center !important; } .align-self-baseline { align-self: baseline !important; } .align-self-stretch { align-self: stretch !important; } @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; } .flex-sm-column { flex-direction: column !important; } .flex-sm-row-reverse { flex-direction: row-reverse !important; } .flex-sm-column-reverse { flex-direction: column-reverse !important; } .flex-sm-wrap { flex-wrap: wrap !important; } .flex-sm-nowrap { flex-wrap: nowrap !important; } .flex-sm-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-sm-fill { flex: 1 1 auto !important; } .flex-sm-grow-0 { flex-grow: 0 !important; } .flex-sm-grow-1 { flex-grow: 1 !important; } .flex-sm-shrink-0 { flex-shrink: 0 !important; } .flex-sm-shrink-1 { flex-shrink: 1 !important; } .justify-content-sm-start { justify-content: flex-start !important; } .justify-content-sm-end { justify-content: flex-end !important; } .justify-content-sm-center { justify-content: center !important; } .justify-content-sm-between { justify-content: space-between !important; } .justify-content-sm-around { justify-content: space-around !important; } .align-items-sm-start { align-items: flex-start !important; } .align-items-sm-end { align-items: flex-end !important; } .align-items-sm-center { align-items: center !important; } .align-items-sm-baseline { align-items: baseline !important; } .align-items-sm-stretch { align-items: stretch !important; } .align-content-sm-start { align-content: flex-start !important; } .align-content-sm-end { align-content: flex-end !important; } .align-content-sm-center { align-content: center !important; } .align-content-sm-between { align-content: space-between !important; } .align-content-sm-around { align-content: space-around !important; } .align-content-sm-stretch { align-content: stretch !important; } .align-self-sm-auto { align-self: auto !important; } .align-self-sm-start { align-self: flex-start !important; } .align-self-sm-end { align-self: flex-end !important; } .align-self-sm-center { align-self: center !important; } .align-self-sm-baseline { align-self: baseline !important; } .align-self-sm-stretch { align-self: stretch !important; } } @media (min-width: 768px) { .flex-md-row { flex-direction: row !important; } .flex-md-column { flex-direction: column !important; } .flex-md-row-reverse { flex-direction: row-reverse !important; } .flex-md-column-reverse { flex-direction: column-reverse !important; } .flex-md-wrap { flex-wrap: wrap !important; } .flex-md-nowrap { flex-wrap: nowrap !important; } .flex-md-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-md-fill { flex: 1 1 auto !important; } .flex-md-grow-0 { flex-grow: 0 !important; } .flex-md-grow-1 { flex-grow: 1 !important; } .flex-md-shrink-0 { flex-shrink: 0 !important; } .flex-md-shrink-1 { flex-shrink: 1 !important; } .justify-content-md-start { justify-content: flex-start !important; } .justify-content-md-end { justify-content: flex-end !important; } .justify-content-md-center { justify-content: center !important; } .justify-content-md-between { justify-content: space-between !important; } .justify-content-md-around { justify-content: space-around !important; } .align-items-md-start { align-items: flex-start !important; } .align-items-md-end { align-items: flex-end !important; } .align-items-md-center { align-items: center !important; } .align-items-md-baseline { align-items: baseline !important; } .align-items-md-stretch { align-items: stretch !important; } .align-content-md-start { align-content: flex-start !important; } .align-content-md-end { align-content: flex-end !important; } .align-content-md-center { align-content: center !important; } .align-content-md-between { align-content: space-between !important; } .align-content-md-around { align-content: space-around !important; } .align-content-md-stretch { align-content: stretch !important; } .align-self-md-auto { align-self: auto !important; } .align-self-md-start { align-self: flex-start !important; } .align-self-md-end { align-self: flex-end !important; } .align-self-md-center { align-self: center !important; } .align-self-md-baseline { align-self: baseline !important; } .align-self-md-stretch { align-self: stretch !important; } } @media (min-width: 992px) { .flex-lg-row { flex-direction: row !important; } .flex-lg-column { flex-direction: column !important; } .flex-lg-row-reverse { flex-direction: row-reverse !important; } .flex-lg-column-reverse { flex-direction: column-reverse !important; } .flex-lg-wrap { flex-wrap: wrap !important; } .flex-lg-nowrap { flex-wrap: nowrap !important; } .flex-lg-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-lg-fill { flex: 1 1 auto !important; } .flex-lg-grow-0 { flex-grow: 0 !important; } .flex-lg-grow-1 { flex-grow: 1 !important; } .flex-lg-shrink-0 { flex-shrink: 0 !important; } .flex-lg-shrink-1 { flex-shrink: 1 !important; } .justify-content-lg-start { justify-content: flex-start !important; } .justify-content-lg-end { justify-content: flex-end !important; } .justify-content-lg-center { justify-content: center !important; } .justify-content-lg-between { justify-content: space-between !important; } .justify-content-lg-around { justify-content: space-around !important; } .align-items-lg-start { align-items: flex-start !important; } .align-items-lg-end { align-items: flex-end !important; } .align-items-lg-center { align-items: center !important; } .align-items-lg-baseline { align-items: baseline !important; } .align-items-lg-stretch { align-items: stretch !important; } .align-content-lg-start { align-content: flex-start !important; } .align-content-lg-end { align-content: flex-end !important; } .align-content-lg-center { align-content: center !important; } .align-content-lg-between { align-content: space-between !important; } .align-content-lg-around { align-content: space-around !important; } .align-content-lg-stretch { align-content: stretch !important; } .align-self-lg-auto { align-self: auto !important; } .align-self-lg-start { align-self: flex-start !important; } .align-self-lg-end { align-self: flex-end !important; } .align-self-lg-center { align-self: center !important; } .align-self-lg-baseline { align-self: baseline !important; } .align-self-lg-stretch { align-self: stretch !important; } } @media (min-width: 1200px) { .flex-xl-row { flex-direction: row !important; } .flex-xl-column { flex-direction: column !important; } .flex-xl-row-reverse { flex-direction: row-reverse !important; } .flex-xl-column-reverse { flex-direction: column-reverse !important; } .flex-xl-wrap { flex-wrap: wrap !important; } .flex-xl-nowrap { flex-wrap: nowrap !important; } .flex-xl-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-xl-fill { flex: 1 1 auto !important; } .flex-xl-grow-0 { flex-grow: 0 !important; } .flex-xl-grow-1 { flex-grow: 1 !important; } .flex-xl-shrink-0 { flex-shrink: 0 !important; } .flex-xl-shrink-1 { flex-shrink: 1 !important; } .justify-content-xl-start { justify-content: flex-start !important; } .justify-content-xl-end { justify-content: flex-end !important; } .justify-content-xl-center { justify-content: center !important; } .justify-content-xl-between { justify-content: space-between !important; } .justify-content-xl-around { justify-content: space-around !important; } .align-items-xl-start { align-items: flex-start !important; } .align-items-xl-end { align-items: flex-end !important; } .align-items-xl-center { align-items: center !important; } .align-items-xl-baseline { align-items: baseline !important; } .align-items-xl-stretch { align-items: stretch !important; } .align-content-xl-start { align-content: flex-start !important; } .align-content-xl-end { align-content: flex-end !important; } .align-content-xl-center { align-content: center !important; } .align-content-xl-between { align-content: space-between !important; } .align-content-xl-around { align-content: space-around !important; } .align-content-xl-stretch { align-content: stretch !important; } .align-self-xl-auto { align-self: auto !important; } .align-self-xl-start { align-self: flex-start !important; } .align-self-xl-end { align-self: flex-end !important; } .align-self-xl-center { align-self: center !important; } .align-self-xl-baseline { align-self: baseline !important; } .align-self-xl-stretch { align-self: stretch !important; } } .m-0 { margin: 0 !important; } .mt-0, .my-0 { margin-top: 0 !important; } .mr-0, .mx-0 { margin-right: 0 !important; } .mb-0, .my-0 { margin-bottom: 0 !important; } .ml-0, .mx-0 { margin-left: 0 !important; } .m-1 { margin: 0.25rem !important; } .mt-1, .my-1 { margin-top: 0.25rem !important; } .mr-1, .mx-1 { margin-right: 0.25rem !important; } .mb-1, .my-1 { margin-bottom: 0.25rem !important; } .ml-1, .mx-1 { margin-left: 0.25rem !important; } .m-2 { margin: 0.5rem !important; } .mt-2, .my-2 { margin-top: 0.5rem !important; } .mr-2, .mx-2 { margin-right: 0.5rem !important; } .mb-2, .my-2 { margin-bottom: 0.5rem !important; } .ml-2, .mx-2 { margin-left: 0.5rem !important; } .m-3 { margin: 1rem !important; } .mt-3, .my-3 { margin-top: 1rem !important; } .mr-3, .mx-3 { margin-right: 1rem !important; } .mb-3, .my-3 { margin-bottom: 1rem !important; } .ml-3, .mx-3 { margin-left: 1rem !important; } .m-4 { margin: 1.5rem !important; } .mt-4, .my-4 { margin-top: 1.5rem !important; } .mr-4, .mx-4 { margin-right: 1.5rem !important; } .mb-4, .my-4 { margin-bottom: 1.5rem !important; } .ml-4, .mx-4 { margin-left: 1.5rem !important; } .m-5 { margin: 0.5rem !important; } .mt-5, .my-5 { margin-top: 0.5rem !important; } .mr-5, .mx-5 { margin-right: 0.5rem !important; } .mb-5, .my-5 { margin-bottom: 0.5rem !important; } .ml-5, .mx-5 { margin-left: 0.5rem !important; } .m-10 { margin: 1rem !important; } .mt-10, .my-10 { margin-top: 1rem !important; } .mr-10, .mx-10 { margin-right: 1rem !important; } .mb-10, .my-10 { margin-bottom: 1rem !important; } .ml-10, .mx-10 { margin-left: 1rem !important; } .m-15 { margin: 1.5rem !important; } .mt-15, .my-15 { margin-top: 1.5rem !important; } .mr-15, .mx-15 { margin-right: 1.5rem !important; } .mb-15, .my-15 { margin-bottom: 1.5rem !important; } .ml-15, .mx-15 { margin-left: 1.5rem !important; } .m-20 { margin: 2rem !important; } .mt-20, .my-20 { margin-top: 2rem !important; } .mr-20, .mx-20 { margin-right: 2rem !important; } .mb-20, .my-20 { margin-bottom: 2rem !important; } .ml-20, .mx-20 { margin-left: 2rem !important; } .m-25 { margin: 2.5rem !important; } .mt-25, .my-25 { margin-top: 2.5rem !important; } .mr-25, .mx-25 { margin-right: 2.5rem !important; } .mb-25, .my-25 { margin-bottom: 2.5rem !important; } .ml-25, .mx-25 { margin-left: 2.5rem !important; } .m-30 { margin: 3rem !important; } .mt-30, .my-30 { margin-top: 3rem !important; } .mr-30, .mx-30 { margin-right: 3rem !important; } .mb-30, .my-30 { margin-bottom: 3rem !important; } .ml-30, .mx-30 { margin-left: 3rem !important; } .m-35 { margin: 3.5rem !important; } .mt-35, .my-35 { margin-top: 3.5rem !important; } .mr-35, .mx-35 { margin-right: 3.5rem !important; } .mb-35, .my-35 { margin-bottom: 3.5rem !important; } .ml-35, .mx-35 { margin-left: 3.5rem !important; } .m-40 { margin: 4rem !important; } .mt-40, .my-40 { margin-top: 4rem !important; } .mr-40, .mx-40 { margin-right: 4rem !important; } .mb-40, .my-40 { margin-bottom: 4rem !important; } .ml-40, .mx-40 { margin-left: 4rem !important; } .m-45 { margin: 4.5rem !important; } .mt-45, .my-45 { margin-top: 4.5rem !important; } .mr-45, .mx-45 { margin-right: 4.5rem !important; } .mb-45, .my-45 { margin-bottom: 4.5rem !important; } .ml-45, .mx-45 { margin-left: 4.5rem !important; } .m-50 { margin: 5rem !important; } .mt-50, .my-50 { margin-top: 5rem !important; } .mr-50, .mx-50 { margin-right: 5rem !important; } .mb-50, .my-50 { margin-bottom: 5rem !important; } .ml-50, .mx-50 { margin-left: 5rem !important; } .m-55 { margin: 5.5rem !important; } .mt-55, .my-55 { margin-top: 5.5rem !important; } .mr-55, .mx-55 { margin-right: 5.5rem !important; } .mb-55, .my-55 { margin-bottom: 5.5rem !important; } .ml-55, .mx-55 { margin-left: 5.5rem !important; } .m-60 { margin: 6rem !important; } .mt-60, .my-60 { margin-top: 6rem !important; } .mr-60, .mx-60 { margin-right: 6rem !important; } .mb-60, .my-60 { margin-bottom: 6rem !important; } .ml-60, .mx-60 { margin-left: 6rem !important; } .m-65 { margin: 6.5rem !important; } .mt-65, .my-65 { margin-top: 6.5rem !important; } .mr-65, .mx-65 { margin-right: 6.5rem !important; } .mb-65, .my-65 { margin-bottom: 6.5rem !important; } .ml-65, .mx-65 { margin-left: 6.5rem !important; } .m-70 { margin: 7rem !important; } .mt-70, .my-70 { margin-top: 7rem !important; } .mr-70, .mx-70 { margin-right: 7rem !important; } .mb-70, .my-70 { margin-bottom: 7rem !important; } .ml-70, .mx-70 { margin-left: 7rem !important; } .m-75 { margin: 7.5rem !important; } .mt-75, .my-75 { margin-top: 7.5rem !important; } .mr-75, .mx-75 { margin-right: 7.5rem !important; } .mb-75, .my-75 { margin-bottom: 7.5rem !important; } .ml-75, .mx-75 { margin-left: 7.5rem !important; } .m-80 { margin: 8rem !important; } .mt-80, .my-80 { margin-top: 8rem !important; } .mr-80, .mx-80 { margin-right: 8rem !important; } .mb-80, .my-80 { margin-bottom: 8rem !important; } .ml-80, .mx-80 { margin-left: 8rem !important; } .m-85 { margin: 8.5rem !important; } .mt-85, .my-85 { margin-top: 8.5rem !important; } .mr-85, .mx-85 { margin-right: 8.5rem !important; } .mb-85, .my-85 { margin-bottom: 8.5rem !important; } .ml-85, .mx-85 { margin-left: 8.5rem !important; } .m-90 { margin: 9rem !important; } .mt-90, .my-90 { margin-top: 9rem !important; } .mr-90, .mx-90 { margin-right: 9rem !important; } .mb-90, .my-90 { margin-bottom: 9rem !important; } .ml-90, .mx-90 { margin-left: 9rem !important; } .m-95 { margin: 9.5rem !important; } .mt-95, .my-95 { margin-top: 9.5rem !important; } .mr-95, .mx-95 { margin-right: 9.5rem !important; } .mb-95, .my-95 { margin-bottom: 9.5rem !important; } .ml-95, .mx-95 { margin-left: 9.5rem !important; } .m-100 { margin: 10rem !important; } .mt-100, .my-100 { margin-top: 10rem !important; } .mr-100, .mx-100 { margin-right: 10rem !important; } .mb-100, .my-100 { margin-bottom: 10rem !important; } .ml-100, .mx-100 { margin-left: 10rem !important; } .p-0 { padding: 0 !important; } .pt-0, .py-0 { padding-top: 0 !important; } .pr-0, .px-0 { padding-right: 0 !important; } .pb-0, .py-0 { padding-bottom: 0 !important; } .pl-0, .px-0 { padding-left: 0 !important; } .p-1 { padding: 0.25rem !important; } .pt-1, .py-1 { padding-top: 0.25rem !important; } .pr-1, .px-1 { padding-right: 0.25rem !important; } .pb-1, .py-1 { padding-bottom: 0.25rem !important; } .pl-1, .px-1 { padding-left: 0.25rem !important; } .p-2 { padding: 0.5rem !important; } .pt-2, .py-2 { padding-top: 0.5rem !important; } .pr-2, .px-2 { padding-right: 0.5rem !important; } .pb-2, .py-2 { padding-bottom: 0.5rem !important; } .pl-2, .px-2 { padding-left: 0.5rem !important; } .p-3 { padding: 1rem !important; } .pt-3, .py-3 { padding-top: 1rem !important; } .pr-3, .px-3 { padding-right: 1rem !important; } .pb-3, .py-3 { padding-bottom: 1rem !important; } .pl-3, .px-3 { padding-left: 1rem !important; } .p-4 { padding: 1.5rem !important; } .pt-4, .py-4 { padding-top: 1.5rem !important; } .pr-4, .px-4 { padding-right: 1.5rem !important; } .pb-4, .py-4 { padding-bottom: 1.5rem !important; } .pl-4, .px-4 { padding-left: 1.5rem !important; } .p-5 { padding: 0.5rem !important; } .pt-5, .py-5 { padding-top: 0.5rem !important; } .pr-5, .px-5 { padding-right: 0.5rem !important; } .pb-5, .py-5 { padding-bottom: 0.5rem !important; } .pl-5, .px-5 { padding-left: 0.5rem !important; } .p-10 { padding: 1rem !important; } .pt-10, .py-10 { padding-top: 1rem !important; } .pr-10, .px-10 { padding-right: 1rem !important; } .pb-10, .py-10 { padding-bottom: 1rem !important; } .pl-10, .px-10 { padding-left: 1rem !important; } .p-15 { padding: 1.5rem !important; } .pt-15, .py-15 { padding-top: 1.5rem !important; } .pr-15, .px-15 { padding-right: 1.5rem !important; } .pb-15, .py-15 { padding-bottom: 1.5rem !important; } .pl-15, .px-15 { padding-left: 1.5rem !important; } .p-20 { padding: 2rem !important; } .pt-20, .py-20 { padding-top: 2rem !important; } .pr-20, .px-20 { padding-right: 2rem !important; } .pb-20, .py-20 { padding-bottom: 2rem !important; } .pl-20, .px-20 { padding-left: 2rem !important; } .p-25 { padding: 2.5rem !important; } .pt-25, .py-25 { padding-top: 2.5rem !important; } .pr-25, .px-25 { padding-right: 2.5rem !important; } .pb-25, .py-25 { padding-bottom: 2.5rem !important; } .pl-25, .px-25 { padding-left: 2.5rem !important; } .p-30 { padding: 3rem !important; } .pt-30, .py-30 { padding-top: 3rem !important; } .pr-30, .px-30 { padding-right: 3rem !important; } .pb-30, .py-30 { padding-bottom: 3rem !important; } .pl-30, .px-30 { padding-left: 3rem !important; } .p-35 { padding: 3.5rem !important; } .pt-35, .py-35 { padding-top: 3.5rem !important; } .pr-35, .px-35 { padding-right: 3.5rem !important; } .pb-35, .py-35 { padding-bottom: 3.5rem !important; } .pl-35, .px-35 { padding-left: 3.5rem !important; } .p-40 { padding: 4rem !important; } .pt-40, .py-40 { padding-top: 4rem !important; } .pr-40, .px-40 { padding-right: 4rem !important; } .pb-40, .py-40 { padding-bottom: 4rem !important; } .pl-40, .px-40 { padding-left: 4rem !important; } .p-45 { padding: 4.5rem !important; } .pt-45, .py-45 { padding-top: 4.5rem !important; } .pr-45, .px-45 { padding-right: 4.5rem !important; } .pb-45, .py-45 { padding-bottom: 4.5rem !important; } .pl-45, .px-45 { padding-left: 4.5rem !important; } .p-50 { padding: 5rem !important; } .pt-50, .py-50 { padding-top: 5rem !important; } .pr-50, .px-50 { padding-right: 5rem !important; } .pb-50, .py-50 { padding-bottom: 5rem !important; } .pl-50, .px-50 { padding-left: 5rem !important; } .p-55 { padding: 5.5rem !important; } .pt-55, .py-55 { padding-top: 5.5rem !important; } .pr-55, .px-55 { padding-right: 5.5rem !important; } .pb-55, .py-55 { padding-bottom: 5.5rem !important; } .pl-55, .px-55 { padding-left: 5.5rem !important; } .p-60 { padding: 6rem !important; } .pt-60, .py-60 { padding-top: 6rem !important; } .pr-60, .px-60 { padding-right: 6rem !important; } .pb-60, .py-60 { padding-bottom: 6rem !important; } .pl-60, .px-60 { padding-left: 6rem !important; } .p-65 { padding: 6.5rem !important; } .pt-65, .py-65 { padding-top: 6.5rem !important; } .pr-65, .px-65 { padding-right: 6.5rem !important; } .pb-65, .py-65 { padding-bottom: 6.5rem !important; } .pl-65, .px-65 { padding-left: 6.5rem !important; } .p-70 { padding: 7rem !important; } .pt-70, .py-70 { padding-top: 7rem !important; } .pr-70, .px-70 { padding-right: 7rem !important; } .pb-70, .py-70 { padding-bottom: 7rem !important; } .pl-70, .px-70 { padding-left: 7rem !important; } .p-75 { padding: 7.5rem !important; } .pt-75, .py-75 { padding-top: 7.5rem !important; } .pr-75, .px-75 { padding-right: 7.5rem !important; } .pb-75, .py-75 { padding-bottom: 7.5rem !important; } .pl-75, .px-75 { padding-left: 7.5rem !important; } .p-80 { padding: 8rem !important; } .pt-80, .py-80 { padding-top: 8rem !important; } .pr-80, .px-80 { padding-right: 8rem !important; } .pb-80, .py-80 { padding-bottom: 8rem !important; } .pl-80, .px-80 { padding-left: 8rem !important; } .p-85 { padding: 8.5rem !important; } .pt-85, .py-85 { padding-top: 8.5rem !important; } .pr-85, .px-85 { padding-right: 8.5rem !important; } .pb-85, .py-85 { padding-bottom: 8.5rem !important; } .pl-85, .px-85 { padding-left: 8.5rem !important; } .p-90 { padding: 9rem !important; } .pt-90, .py-90 { padding-top: 9rem !important; } .pr-90, .px-90 { padding-right: 9rem !important; } .pb-90, .py-90 { padding-bottom: 9rem !important; } .pl-90, .px-90 { padding-left: 9rem !important; } .p-95 { padding: 9.5rem !important; } .pt-95, .py-95 { padding-top: 9.5rem !important; } .pr-95, .px-95 { padding-right: 9.5rem !important; } .pb-95, .py-95 { padding-bottom: 9.5rem !important; } .pl-95, .px-95 { padding-left: 9.5rem !important; } .p-100 { padding: 10rem !important; } .pt-100, .py-100 { padding-top: 10rem !important; } .pr-100, .px-100 { padding-right: 10rem !important; } .pb-100, .py-100 { padding-bottom: 10rem !important; } .pl-100, .px-100 { padding-left: 10rem !important; } .m-n1 { margin: -0.25rem !important; } .mt-n1, .my-n1 { margin-top: -0.25rem !important; } .mr-n1, .mx-n1 { margin-right: -0.25rem !important; } .mb-n1, .my-n1 { margin-bottom: -0.25rem !important; } .ml-n1, .mx-n1 { margin-left: -0.25rem !important; } .m-n2 { margin: -0.5rem !important; } .mt-n2, .my-n2 { margin-top: -0.5rem !important; } .mr-n2, .mx-n2 { margin-right: -0.5rem !important; } .mb-n2, .my-n2 { margin-bottom: -0.5rem !important; } .ml-n2, .mx-n2 { margin-left: -0.5rem !important; } .m-n3 { margin: -1rem !important; } .mt-n3, .my-n3 { margin-top: -1rem !important; } .mr-n3, .mx-n3 { margin-right: -1rem !important; } .mb-n3, .my-n3 { margin-bottom: -1rem !important; } .ml-n3, .mx-n3 { margin-left: -1rem !important; } .m-n4 { margin: -1.5rem !important; } .mt-n4, .my-n4 { margin-top: -1.5rem !important; } .mr-n4, .mx-n4 { margin-right: -1.5rem !important; } .mb-n4, .my-n4 { margin-bottom: -1.5rem !important; } .ml-n4, .mx-n4 { margin-left: -1.5rem !important; } .m-n5 { margin: -0.5rem !important; } .mt-n5, .my-n5 { margin-top: -0.5rem !important; } .mr-n5, .mx-n5 { margin-right: -0.5rem !important; } .mb-n5, .my-n5 { margin-bottom: -0.5rem !important; } .ml-n5, .mx-n5 { margin-left: -0.5rem !important; } .m-n10 { margin: -1rem !important; } .mt-n10, .my-n10 { margin-top: -1rem !important; } .mr-n10, .mx-n10 { margin-right: -1rem !important; } .mb-n10, .my-n10 { margin-bottom: -1rem !important; } .ml-n10, .mx-n10 { margin-left: -1rem !important; } .m-n15 { margin: -1.5rem !important; } .mt-n15, .my-n15 { margin-top: -1.5rem !important; } .mr-n15, .mx-n15 { margin-right: -1.5rem !important; } .mb-n15, .my-n15 { margin-bottom: -1.5rem !important; } .ml-n15, .mx-n15 { margin-left: -1.5rem !important; } .m-n20 { margin: -2rem !important; } .mt-n20, .my-n20 { margin-top: -2rem !important; } .mr-n20, .mx-n20 { margin-right: -2rem !important; } .mb-n20, .my-n20 { margin-bottom: -2rem !important; } .ml-n20, .mx-n20 { margin-left: -2rem !important; } .m-n25 { margin: -2.5rem !important; } .mt-n25, .my-n25 { margin-top: -2.5rem !important; } .mr-n25, .mx-n25 { margin-right: -2.5rem !important; } .mb-n25, .my-n25 { margin-bottom: -2.5rem !important; } .ml-n25, .mx-n25 { margin-left: -2.5rem !important; } .m-n30 { margin: -3rem !important; } .mt-n30, .my-n30 { margin-top: -3rem !important; } .mr-n30, .mx-n30 { margin-right: -3rem !important; } .mb-n30, .my-n30 { margin-bottom: -3rem !important; } .ml-n30, .mx-n30 { margin-left: -3rem !important; } .m-n35 { margin: -3.5rem !important; } .mt-n35, .my-n35 { margin-top: -3.5rem !important; } .mr-n35, .mx-n35 { margin-right: -3.5rem !important; } .mb-n35, .my-n35 { margin-bottom: -3.5rem !important; } .ml-n35, .mx-n35 { margin-left: -3.5rem !important; } .m-n40 { margin: -4rem !important; } .mt-n40, .my-n40 { margin-top: -4rem !important; } .mr-n40, .mx-n40 { margin-right: -4rem !important; } .mb-n40, .my-n40 { margin-bottom: -4rem !important; } .ml-n40, .mx-n40 { margin-left: -4rem !important; } .m-n45 { margin: -4.5rem !important; } .mt-n45, .my-n45 { margin-top: -4.5rem !important; } .mr-n45, .mx-n45 { margin-right: -4.5rem !important; } .mb-n45, .my-n45 { margin-bottom: -4.5rem !important; } .ml-n45, .mx-n45 { margin-left: -4.5rem !important; } .m-n50 { margin: -5rem !important; } .mt-n50, .my-n50 { margin-top: -5rem !important; } .mr-n50, .mx-n50 { margin-right: -5rem !important; } .mb-n50, .my-n50 { margin-bottom: -5rem !important; } .ml-n50, .mx-n50 { margin-left: -5rem !important; } .m-n55 { margin: -5.5rem !important; } .mt-n55, .my-n55 { margin-top: -5.5rem !important; } .mr-n55, .mx-n55 { margin-right: -5.5rem !important; } .mb-n55, .my-n55 { margin-bottom: -5.5rem !important; } .ml-n55, .mx-n55 { margin-left: -5.5rem !important; } .m-n60 { margin: -6rem !important; } .mt-n60, .my-n60 { margin-top: -6rem !important; } .mr-n60, .mx-n60 { margin-right: -6rem !important; } .mb-n60, .my-n60 { margin-bottom: -6rem !important; } .ml-n60, .mx-n60 { margin-left: -6rem !important; } .m-n65 { margin: -6.5rem !important; } .mt-n65, .my-n65 { margin-top: -6.5rem !important; } .mr-n65, .mx-n65 { margin-right: -6.5rem !important; } .mb-n65, .my-n65 { margin-bottom: -6.5rem !important; } .ml-n65, .mx-n65 { margin-left: -6.5rem !important; } .m-n70 { margin: -7rem !important; } .mt-n70, .my-n70 { margin-top: -7rem !important; } .mr-n70, .mx-n70 { margin-right: -7rem !important; } .mb-n70, .my-n70 { margin-bottom: -7rem !important; } .ml-n70, .mx-n70 { margin-left: -7rem !important; } .m-n75 { margin: -7.5rem !important; } .mt-n75, .my-n75 { margin-top: -7.5rem !important; } .mr-n75, .mx-n75 { margin-right: -7.5rem !important; } .mb-n75, .my-n75 { margin-bottom: -7.5rem !important; } .ml-n75, .mx-n75 { margin-left: -7.5rem !important; } .m-n80 { margin: -8rem !important; } .mt-n80, .my-n80 { margin-top: -8rem !important; } .mr-n80, .mx-n80 { margin-right: -8rem !important; } .mb-n80, .my-n80 { margin-bottom: -8rem !important; } .ml-n80, .mx-n80 { margin-left: -8rem !important; } .m-n85 { margin: -8.5rem !important; } .mt-n85, .my-n85 { margin-top: -8.5rem !important; } .mr-n85, .mx-n85 { margin-right: -8.5rem !important; } .mb-n85, .my-n85 { margin-bottom: -8.5rem !important; } .ml-n85, .mx-n85 { margin-left: -8.5rem !important; } .m-n90 { margin: -9rem !important; } .mt-n90, .my-n90 { margin-top: -9rem !important; } .mr-n90, .mx-n90 { margin-right: -9rem !important; } .mb-n90, .my-n90 { margin-bottom: -9rem !important; } .ml-n90, .mx-n90 { margin-left: -9rem !important; } .m-n95 { margin: -9.5rem !important; } .mt-n95, .my-n95 { margin-top: -9.5rem !important; } .mr-n95, .mx-n95 { margin-right: -9.5rem !important; } .mb-n95, .my-n95 { margin-bottom: -9.5rem !important; } .ml-n95, .mx-n95 { margin-left: -9.5rem !important; } .m-n100 { margin: -10rem !important; } .mt-n100, .my-n100 { margin-top: -10rem !important; } .mr-n100, .mx-n100 { margin-right: -10rem !important; } .mb-n100, .my-n100 { margin-bottom: -10rem !important; } .ml-n100, .mx-n100 { margin-left: -10rem !important; } .m-auto { margin: auto !important; } .mt-auto, .my-auto { margin-top: auto !important; } .mr-auto, .mx-auto { margin-right: auto !important; } .mb-auto, .my-auto { margin-bottom: auto !important; } .ml-auto, .mx-auto { margin-left: auto !important; } @media (min-width: 576px) { .m-sm-0 { margin: 0 !important; } .mt-sm-0, .my-sm-0 { margin-top: 0 !important; } .mr-sm-0, .mx-sm-0 { margin-right: 0 !important; } .mb-sm-0, .my-sm-0 { margin-bottom: 0 !important; } .ml-sm-0, .mx-sm-0 { margin-left: 0 !important; } .m-sm-1 { margin: 0.25rem !important; } .mt-sm-1, .my-sm-1 { margin-top: 0.25rem !important; } .mr-sm-1, .mx-sm-1 { margin-right: 0.25rem !important; } .mb-sm-1, .my-sm-1 { margin-bottom: 0.25rem !important; } .ml-sm-1, .mx-sm-1 { margin-left: 0.25rem !important; } .m-sm-2 { margin: 0.5rem !important; } .mt-sm-2, .my-sm-2 { margin-top: 0.5rem !important; } .mr-sm-2, .mx-sm-2 { margin-right: 0.5rem !important; } .mb-sm-2, .my-sm-2 { margin-bottom: 0.5rem !important; } .ml-sm-2, .mx-sm-2 { margin-left: 0.5rem !important; } .m-sm-3 { margin: 1rem !important; } .mt-sm-3, .my-sm-3 { margin-top: 1rem !important; } .mr-sm-3, .mx-sm-3 { margin-right: 1rem !important; } .mb-sm-3, .my-sm-3 { margin-bottom: 1rem !important; } .ml-sm-3, .mx-sm-3 { margin-left: 1rem !important; } .m-sm-4 { margin: 1.5rem !important; } .mt-sm-4, .my-sm-4 { margin-top: 1.5rem !important; } .mr-sm-4, .mx-sm-4 { margin-right: 1.5rem !important; } .mb-sm-4, .my-sm-4 { margin-bottom: 1.5rem !important; } .ml-sm-4, .mx-sm-4 { margin-left: 1.5rem !important; } .m-sm-5 { margin: 0.5rem !important; } .mt-sm-5, .my-sm-5 { margin-top: 0.5rem !important; } .mr-sm-5, .mx-sm-5 { margin-right: 0.5rem !important; } .mb-sm-5, .my-sm-5 { margin-bottom: 0.5rem !important; } .ml-sm-5, .mx-sm-5 { margin-left: 0.5rem !important; } .m-sm-10 { margin: 1rem !important; } .mt-sm-10, .my-sm-10 { margin-top: 1rem !important; } .mr-sm-10, .mx-sm-10 { margin-right: 1rem !important; } .mb-sm-10, .my-sm-10 { margin-bottom: 1rem !important; } .ml-sm-10, .mx-sm-10 { margin-left: 1rem !important; } .m-sm-15 { margin: 1.5rem !important; } .mt-sm-15, .my-sm-15 { margin-top: 1.5rem !important; } .mr-sm-15, .mx-sm-15 { margin-right: 1.5rem !important; } .mb-sm-15, .my-sm-15 { margin-bottom: 1.5rem !important; } .ml-sm-15, .mx-sm-15 { margin-left: 1.5rem !important; } .m-sm-20 { margin: 2rem !important; } .mt-sm-20, .my-sm-20 { margin-top: 2rem !important; } .mr-sm-20, .mx-sm-20 { margin-right: 2rem !important; } .mb-sm-20, .my-sm-20 { margin-bottom: 2rem !important; } .ml-sm-20, .mx-sm-20 { margin-left: 2rem !important; } .m-sm-25 { margin: 2.5rem !important; } .mt-sm-25, .my-sm-25 { margin-top: 2.5rem !important; } .mr-sm-25, .mx-sm-25 { margin-right: 2.5rem !important; } .mb-sm-25, .my-sm-25 { margin-bottom: 2.5rem !important; } .ml-sm-25, .mx-sm-25 { margin-left: 2.5rem !important; } .m-sm-30 { margin: 3rem !important; } .mt-sm-30, .my-sm-30 { margin-top: 3rem !important; } .mr-sm-30, .mx-sm-30 { margin-right: 3rem !important; } .mb-sm-30, .my-sm-30 { margin-bottom: 3rem !important; } .ml-sm-30, .mx-sm-30 { margin-left: 3rem !important; } .m-sm-35 { margin: 3.5rem !important; } .mt-sm-35, .my-sm-35 { margin-top: 3.5rem !important; } .mr-sm-35, .mx-sm-35 { margin-right: 3.5rem !important; } .mb-sm-35, .my-sm-35 { margin-bottom: 3.5rem !important; } .ml-sm-35, .mx-sm-35 { margin-left: 3.5rem !important; } .m-sm-40 { margin: 4rem !important; } .mt-sm-40, .my-sm-40 { margin-top: 4rem !important; } .mr-sm-40, .mx-sm-40 { margin-right: 4rem !important; } .mb-sm-40, .my-sm-40 { margin-bottom: 4rem !important; } .ml-sm-40, .mx-sm-40 { margin-left: 4rem !important; } .m-sm-45 { margin: 4.5rem !important; } .mt-sm-45, .my-sm-45 { margin-top: 4.5rem !important; } .mr-sm-45, .mx-sm-45 { margin-right: 4.5rem !important; } .mb-sm-45, .my-sm-45 { margin-bottom: 4.5rem !important; } .ml-sm-45, .mx-sm-45 { margin-left: 4.5rem !important; } .m-sm-50 { margin: 5rem !important; } .mt-sm-50, .my-sm-50 { margin-top: 5rem !important; } .mr-sm-50, .mx-sm-50 { margin-right: 5rem !important; } .mb-sm-50, .my-sm-50 { margin-bottom: 5rem !important; } .ml-sm-50, .mx-sm-50 { margin-left: 5rem !important; } .m-sm-55 { margin: 5.5rem !important; } .mt-sm-55, .my-sm-55 { margin-top: 5.5rem !important; } .mr-sm-55, .mx-sm-55 { margin-right: 5.5rem !important; } .mb-sm-55, .my-sm-55 { margin-bottom: 5.5rem !important; } .ml-sm-55, .mx-sm-55 { margin-left: 5.5rem !important; } .m-sm-60 { margin: 6rem !important; } .mt-sm-60, .my-sm-60 { margin-top: 6rem !important; } .mr-sm-60, .mx-sm-60 { margin-right: 6rem !important; } .mb-sm-60, .my-sm-60 { margin-bottom: 6rem !important; } .ml-sm-60, .mx-sm-60 { margin-left: 6rem !important; } .m-sm-65 { margin: 6.5rem !important; } .mt-sm-65, .my-sm-65 { margin-top: 6.5rem !important; } .mr-sm-65, .mx-sm-65 { margin-right: 6.5rem !important; } .mb-sm-65, .my-sm-65 { margin-bottom: 6.5rem !important; } .ml-sm-65, .mx-sm-65 { margin-left: 6.5rem !important; } .m-sm-70 { margin: 7rem !important; } .mt-sm-70, .my-sm-70 { margin-top: 7rem !important; } .mr-sm-70, .mx-sm-70 { margin-right: 7rem !important; } .mb-sm-70, .my-sm-70 { margin-bottom: 7rem !important; } .ml-sm-70, .mx-sm-70 { margin-left: 7rem !important; } .m-sm-75 { margin: 7.5rem !important; } .mt-sm-75, .my-sm-75 { margin-top: 7.5rem !important; } .mr-sm-75, .mx-sm-75 { margin-right: 7.5rem !important; } .mb-sm-75, .my-sm-75 { margin-bottom: 7.5rem !important; } .ml-sm-75, .mx-sm-75 { margin-left: 7.5rem !important; } .m-sm-80 { margin: 8rem !important; } .mt-sm-80, .my-sm-80 { margin-top: 8rem !important; } .mr-sm-80, .mx-sm-80 { margin-right: 8rem !important; } .mb-sm-80, .my-sm-80 { margin-bottom: 8rem !important; } .ml-sm-80, .mx-sm-80 { margin-left: 8rem !important; } .m-sm-85 { margin: 8.5rem !important; } .mt-sm-85, .my-sm-85 { margin-top: 8.5rem !important; } .mr-sm-85, .mx-sm-85 { margin-right: 8.5rem !important; } .mb-sm-85, .my-sm-85 { margin-bottom: 8.5rem !important; } .ml-sm-85, .mx-sm-85 { margin-left: 8.5rem !important; } .m-sm-90 { margin: 9rem !important; } .mt-sm-90, .my-sm-90 { margin-top: 9rem !important; } .mr-sm-90, .mx-sm-90 { margin-right: 9rem !important; } .mb-sm-90, .my-sm-90 { margin-bottom: 9rem !important; } .ml-sm-90, .mx-sm-90 { margin-left: 9rem !important; } .m-sm-95 { margin: 9.5rem !important; } .mt-sm-95, .my-sm-95 { margin-top: 9.5rem !important; } .mr-sm-95, .mx-sm-95 { margin-right: 9.5rem !important; } .mb-sm-95, .my-sm-95 { margin-bottom: 9.5rem !important; } .ml-sm-95, .mx-sm-95 { margin-left: 9.5rem !important; } .m-sm-100 { margin: 10rem !important; } .mt-sm-100, .my-sm-100 { margin-top: 10rem !important; } .mr-sm-100, .mx-sm-100 { margin-right: 10rem !important; } .mb-sm-100, .my-sm-100 { margin-bottom: 10rem !important; } .ml-sm-100, .mx-sm-100 { margin-left: 10rem !important; } .p-sm-0 { padding: 0 !important; } .pt-sm-0, .py-sm-0 { padding-top: 0 !important; } .pr-sm-0, .px-sm-0 { padding-right: 0 !important; } .pb-sm-0, .py-sm-0 { padding-bottom: 0 !important; } .pl-sm-0, .px-sm-0 { padding-left: 0 !important; } .p-sm-1 { padding: 0.25rem !important; } .pt-sm-1, .py-sm-1 { padding-top: 0.25rem !important; } .pr-sm-1, .px-sm-1 { padding-right: 0.25rem !important; } .pb-sm-1, .py-sm-1 { padding-bottom: 0.25rem !important; } .pl-sm-1, .px-sm-1 { padding-left: 0.25rem !important; } .p-sm-2 { padding: 0.5rem !important; } .pt-sm-2, .py-sm-2 { padding-top: 0.5rem !important; } .pr-sm-2, .px-sm-2 { padding-right: 0.5rem !important; } .pb-sm-2, .py-sm-2 { padding-bottom: 0.5rem !important; } .pl-sm-2, .px-sm-2 { padding-left: 0.5rem !important; } .p-sm-3 { padding: 1rem !important; } .pt-sm-3, .py-sm-3 { padding-top: 1rem !important; } .pr-sm-3, .px-sm-3 { padding-right: 1rem !important; } .pb-sm-3, .py-sm-3 { padding-bottom: 1rem !important; } .pl-sm-3, .px-sm-3 { padding-left: 1rem !important; } .p-sm-4 { padding: 1.5rem !important; } .pt-sm-4, .py-sm-4 { padding-top: 1.5rem !important; } .pr-sm-4, .px-sm-4 { padding-right: 1.5rem !important; } .pb-sm-4, .py-sm-4 { padding-bottom: 1.5rem !important; } .pl-sm-4, .px-sm-4 { padding-left: 1.5rem !important; } .p-sm-5 { padding: 0.5rem !important; } .pt-sm-5, .py-sm-5 { padding-top: 0.5rem !important; } .pr-sm-5, .px-sm-5 { padding-right: 0.5rem !important; } .pb-sm-5, .py-sm-5 { padding-bottom: 0.5rem !important; } .pl-sm-5, .px-sm-5 { padding-left: 0.5rem !important; } .p-sm-10 { padding: 1rem !important; } .pt-sm-10, .py-sm-10 { padding-top: 1rem !important; } .pr-sm-10, .px-sm-10 { padding-right: 1rem !important; } .pb-sm-10, .py-sm-10 { padding-bottom: 1rem !important; } .pl-sm-10, .px-sm-10 { padding-left: 1rem !important; } .p-sm-15 { padding: 1.5rem !important; } .pt-sm-15, .py-sm-15 { padding-top: 1.5rem !important; } .pr-sm-15, .px-sm-15 { padding-right: 1.5rem !important; } .pb-sm-15, .py-sm-15 { padding-bottom: 1.5rem !important; } .pl-sm-15, .px-sm-15 { padding-left: 1.5rem !important; } .p-sm-20 { padding: 2rem !important; } .pt-sm-20, .py-sm-20 { padding-top: 2rem !important; } .pr-sm-20, .px-sm-20 { padding-right: 2rem !important; } .pb-sm-20, .py-sm-20 { padding-bottom: 2rem !important; } .pl-sm-20, .px-sm-20 { padding-left: 2rem !important; } .p-sm-25 { padding: 2.5rem !important; } .pt-sm-25, .py-sm-25 { padding-top: 2.5rem !important; } .pr-sm-25, .px-sm-25 { padding-right: 2.5rem !important; } .pb-sm-25, .py-sm-25 { padding-bottom: 2.5rem !important; } .pl-sm-25, .px-sm-25 { padding-left: 2.5rem !important; } .p-sm-30 { padding: 3rem !important; } .pt-sm-30, .py-sm-30 { padding-top: 3rem !important; } .pr-sm-30, .px-sm-30 { padding-right: 3rem !important; } .pb-sm-30, .py-sm-30 { padding-bottom: 3rem !important; } .pl-sm-30, .px-sm-30 { padding-left: 3rem !important; } .p-sm-35 { padding: 3.5rem !important; } .pt-sm-35, .py-sm-35 { padding-top: 3.5rem !important; } .pr-sm-35, .px-sm-35 { padding-right: 3.5rem !important; } .pb-sm-35, .py-sm-35 { padding-bottom: 3.5rem !important; } .pl-sm-35, .px-sm-35 { padding-left: 3.5rem !important; } .p-sm-40 { padding: 4rem !important; } .pt-sm-40, .py-sm-40 { padding-top: 4rem !important; } .pr-sm-40, .px-sm-40 { padding-right: 4rem !important; } .pb-sm-40, .py-sm-40 { padding-bottom: 4rem !important; } .pl-sm-40, .px-sm-40 { padding-left: 4rem !important; } .p-sm-45 { padding: 4.5rem !important; } .pt-sm-45, .py-sm-45 { padding-top: 4.5rem !important; } .pr-sm-45, .px-sm-45 { padding-right: 4.5rem !important; } .pb-sm-45, .py-sm-45 { padding-bottom: 4.5rem !important; } .pl-sm-45, .px-sm-45 { padding-left: 4.5rem !important; } .p-sm-50 { padding: 5rem !important; } .pt-sm-50, .py-sm-50 { padding-top: 5rem !important; } .pr-sm-50, .px-sm-50 { padding-right: 5rem !important; } .pb-sm-50, .py-sm-50 { padding-bottom: 5rem !important; } .pl-sm-50, .px-sm-50 { padding-left: 5rem !important; } .p-sm-55 { padding: 5.5rem !important; } .pt-sm-55, .py-sm-55 { padding-top: 5.5rem !important; } .pr-sm-55, .px-sm-55 { padding-right: 5.5rem !important; } .pb-sm-55, .py-sm-55 { padding-bottom: 5.5rem !important; } .pl-sm-55, .px-sm-55 { padding-left: 5.5rem !important; } .p-sm-60 { padding: 6rem !important; } .pt-sm-60, .py-sm-60 { padding-top: 6rem !important; } .pr-sm-60, .px-sm-60 { padding-right: 6rem !important; } .pb-sm-60, .py-sm-60 { padding-bottom: 6rem !important; } .pl-sm-60, .px-sm-60 { padding-left: 6rem !important; } .p-sm-65 { padding: 6.5rem !important; } .pt-sm-65, .py-sm-65 { padding-top: 6.5rem !important; } .pr-sm-65, .px-sm-65 { padding-right: 6.5rem !important; } .pb-sm-65, .py-sm-65 { padding-bottom: 6.5rem !important; } .pl-sm-65, .px-sm-65 { padding-left: 6.5rem !important; } .p-sm-70 { padding: 7rem !important; } .pt-sm-70, .py-sm-70 { padding-top: 7rem !important; } .pr-sm-70, .px-sm-70 { padding-right: 7rem !important; } .pb-sm-70, .py-sm-70 { padding-bottom: 7rem !important; } .pl-sm-70, .px-sm-70 { padding-left: 7rem !important; } .p-sm-75 { padding: 7.5rem !important; } .pt-sm-75, .py-sm-75 { padding-top: 7.5rem !important; } .pr-sm-75, .px-sm-75 { padding-right: 7.5rem !important; } .pb-sm-75, .py-sm-75 { padding-bottom: 7.5rem !important; } .pl-sm-75, .px-sm-75 { padding-left: 7.5rem !important; } .p-sm-80 { padding: 8rem !important; } .pt-sm-80, .py-sm-80 { padding-top: 8rem !important; } .pr-sm-80, .px-sm-80 { padding-right: 8rem !important; } .pb-sm-80, .py-sm-80 { padding-bottom: 8rem !important; } .pl-sm-80, .px-sm-80 { padding-left: 8rem !important; } .p-sm-85 { padding: 8.5rem !important; } .pt-sm-85, .py-sm-85 { padding-top: 8.5rem !important; } .pr-sm-85, .px-sm-85 { padding-right: 8.5rem !important; } .pb-sm-85, .py-sm-85 { padding-bottom: 8.5rem !important; } .pl-sm-85, .px-sm-85 { padding-left: 8.5rem !important; } .p-sm-90 { padding: 9rem !important; } .pt-sm-90, .py-sm-90 { padding-top: 9rem !important; } .pr-sm-90, .px-sm-90 { padding-right: 9rem !important; } .pb-sm-90, .py-sm-90 { padding-bottom: 9rem !important; } .pl-sm-90, .px-sm-90 { padding-left: 9rem !important; } .p-sm-95 { padding: 9.5rem !important; } .pt-sm-95, .py-sm-95 { padding-top: 9.5rem !important; } .pr-sm-95, .px-sm-95 { padding-right: 9.5rem !important; } .pb-sm-95, .py-sm-95 { padding-bottom: 9.5rem !important; } .pl-sm-95, .px-sm-95 { padding-left: 9.5rem !important; } .p-sm-100 { padding: 10rem !important; } .pt-sm-100, .py-sm-100 { padding-top: 10rem !important; } .pr-sm-100, .px-sm-100 { padding-right: 10rem !important; } .pb-sm-100, .py-sm-100 { padding-bottom: 10rem !important; } .pl-sm-100, .px-sm-100 { padding-left: 10rem !important; } .m-sm-n1 { margin: -0.25rem !important; } .mt-sm-n1, .my-sm-n1 { margin-top: -0.25rem !important; } .mr-sm-n1, .mx-sm-n1 { margin-right: -0.25rem !important; } .mb-sm-n1, .my-sm-n1 { margin-bottom: -0.25rem !important; } .ml-sm-n1, .mx-sm-n1 { margin-left: -0.25rem !important; } .m-sm-n2 { margin: -0.5rem !important; } .mt-sm-n2, .my-sm-n2 { margin-top: -0.5rem !important; } .mr-sm-n2, .mx-sm-n2 { margin-right: -0.5rem !important; } .mb-sm-n2, .my-sm-n2 { margin-bottom: -0.5rem !important; } .ml-sm-n2, .mx-sm-n2 { margin-left: -0.5rem !important; } .m-sm-n3 { margin: -1rem !important; } .mt-sm-n3, .my-sm-n3 { margin-top: -1rem !important; } .mr-sm-n3, .mx-sm-n3 { margin-right: -1rem !important; } .mb-sm-n3, .my-sm-n3 { margin-bottom: -1rem !important; } .ml-sm-n3, .mx-sm-n3 { margin-left: -1rem !important; } .m-sm-n4 { margin: -1.5rem !important; } .mt-sm-n4, .my-sm-n4 { margin-top: -1.5rem !important; } .mr-sm-n4, .mx-sm-n4 { margin-right: -1.5rem !important; } .mb-sm-n4, .my-sm-n4 { margin-bottom: -1.5rem !important; } .ml-sm-n4, .mx-sm-n4 { margin-left: -1.5rem !important; } .m-sm-n5 { margin: -0.5rem !important; } .mt-sm-n5, .my-sm-n5 { margin-top: -0.5rem !important; } .mr-sm-n5, .mx-sm-n5 { margin-right: -0.5rem !important; } .mb-sm-n5, .my-sm-n5 { margin-bottom: -0.5rem !important; } .ml-sm-n5, .mx-sm-n5 { margin-left: -0.5rem !important; } .m-sm-n10 { margin: -1rem !important; } .mt-sm-n10, .my-sm-n10 { margin-top: -1rem !important; } .mr-sm-n10, .mx-sm-n10 { margin-right: -1rem !important; } .mb-sm-n10, .my-sm-n10 { margin-bottom: -1rem !important; } .ml-sm-n10, .mx-sm-n10 { margin-left: -1rem !important; } .m-sm-n15 { margin: -1.5rem !important; } .mt-sm-n15, .my-sm-n15 { margin-top: -1.5rem !important; } .mr-sm-n15, .mx-sm-n15 { margin-right: -1.5rem !important; } .mb-sm-n15, .my-sm-n15 { margin-bottom: -1.5rem !important; } .ml-sm-n15, .mx-sm-n15 { margin-left: -1.5rem !important; } .m-sm-n20 { margin: -2rem !important; } .mt-sm-n20, .my-sm-n20 { margin-top: -2rem !important; } .mr-sm-n20, .mx-sm-n20 { margin-right: -2rem !important; } .mb-sm-n20, .my-sm-n20 { margin-bottom: -2rem !important; } .ml-sm-n20, .mx-sm-n20 { margin-left: -2rem !important; } .m-sm-n25 { margin: -2.5rem !important; } .mt-sm-n25, .my-sm-n25 { margin-top: -2.5rem !important; } .mr-sm-n25, .mx-sm-n25 { margin-right: -2.5rem !important; } .mb-sm-n25, .my-sm-n25 { margin-bottom: -2.5rem !important; } .ml-sm-n25, .mx-sm-n25 { margin-left: -2.5rem !important; } .m-sm-n30 { margin: -3rem !important; } .mt-sm-n30, .my-sm-n30 { margin-top: -3rem !important; } .mr-sm-n30, .mx-sm-n30 { margin-right: -3rem !important; } .mb-sm-n30, .my-sm-n30 { margin-bottom: -3rem !important; } .ml-sm-n30, .mx-sm-n30 { margin-left: -3rem !important; } .m-sm-n35 { margin: -3.5rem !important; } .mt-sm-n35, .my-sm-n35 { margin-top: -3.5rem !important; } .mr-sm-n35, .mx-sm-n35 { margin-right: -3.5rem !important; } .mb-sm-n35, .my-sm-n35 { margin-bottom: -3.5rem !important; } .ml-sm-n35, .mx-sm-n35 { margin-left: -3.5rem !important; } .m-sm-n40 { margin: -4rem !important; } .mt-sm-n40, .my-sm-n40 { margin-top: -4rem !important; } .mr-sm-n40, .mx-sm-n40 { margin-right: -4rem !important; } .mb-sm-n40, .my-sm-n40 { margin-bottom: -4rem !important; } .ml-sm-n40, .mx-sm-n40 { margin-left: -4rem !important; } .m-sm-n45 { margin: -4.5rem !important; } .mt-sm-n45, .my-sm-n45 { margin-top: -4.5rem !important; } .mr-sm-n45, .mx-sm-n45 { margin-right: -4.5rem !important; } .mb-sm-n45, .my-sm-n45 { margin-bottom: -4.5rem !important; } .ml-sm-n45, .mx-sm-n45 { margin-left: -4.5rem !important; } .m-sm-n50 { margin: -5rem !important; } .mt-sm-n50, .my-sm-n50 { margin-top: -5rem !important; } .mr-sm-n50, .mx-sm-n50 { margin-right: -5rem !important; } .mb-sm-n50, .my-sm-n50 { margin-bottom: -5rem !important; } .ml-sm-n50, .mx-sm-n50 { margin-left: -5rem !important; } .m-sm-n55 { margin: -5.5rem !important; } .mt-sm-n55, .my-sm-n55 { margin-top: -5.5rem !important; } .mr-sm-n55, .mx-sm-n55 { margin-right: -5.5rem !important; } .mb-sm-n55, .my-sm-n55 { margin-bottom: -5.5rem !important; } .ml-sm-n55, .mx-sm-n55 { margin-left: -5.5rem !important; } .m-sm-n60 { margin: -6rem !important; } .mt-sm-n60, .my-sm-n60 { margin-top: -6rem !important; } .mr-sm-n60, .mx-sm-n60 { margin-right: -6rem !important; } .mb-sm-n60, .my-sm-n60 { margin-bottom: -6rem !important; } .ml-sm-n60, .mx-sm-n60 { margin-left: -6rem !important; } .m-sm-n65 { margin: -6.5rem !important; } .mt-sm-n65, .my-sm-n65 { margin-top: -6.5rem !important; } .mr-sm-n65, .mx-sm-n65 { margin-right: -6.5rem !important; } .mb-sm-n65, .my-sm-n65 { margin-bottom: -6.5rem !important; } .ml-sm-n65, .mx-sm-n65 { margin-left: -6.5rem !important; } .m-sm-n70 { margin: -7rem !important; } .mt-sm-n70, .my-sm-n70 { margin-top: -7rem !important; } .mr-sm-n70, .mx-sm-n70 { margin-right: -7rem !important; } .mb-sm-n70, .my-sm-n70 { margin-bottom: -7rem !important; } .ml-sm-n70, .mx-sm-n70 { margin-left: -7rem !important; } .m-sm-n75 { margin: -7.5rem !important; } .mt-sm-n75, .my-sm-n75 { margin-top: -7.5rem !important; } .mr-sm-n75, .mx-sm-n75 { margin-right: -7.5rem !important; } .mb-sm-n75, .my-sm-n75 { margin-bottom: -7.5rem !important; } .ml-sm-n75, .mx-sm-n75 { margin-left: -7.5rem !important; } .m-sm-n80 { margin: -8rem !important; } .mt-sm-n80, .my-sm-n80 { margin-top: -8rem !important; } .mr-sm-n80, .mx-sm-n80 { margin-right: -8rem !important; } .mb-sm-n80, .my-sm-n80 { margin-bottom: -8rem !important; } .ml-sm-n80, .mx-sm-n80 { margin-left: -8rem !important; } .m-sm-n85 { margin: -8.5rem !important; } .mt-sm-n85, .my-sm-n85 { margin-top: -8.5rem !important; } .mr-sm-n85, .mx-sm-n85 { margin-right: -8.5rem !important; } .mb-sm-n85, .my-sm-n85 { margin-bottom: -8.5rem !important; } .ml-sm-n85, .mx-sm-n85 { margin-left: -8.5rem !important; } .m-sm-n90 { margin: -9rem !important; } .mt-sm-n90, .my-sm-n90 { margin-top: -9rem !important; } .mr-sm-n90, .mx-sm-n90 { margin-right: -9rem !important; } .mb-sm-n90, .my-sm-n90 { margin-bottom: -9rem !important; } .ml-sm-n90, .mx-sm-n90 { margin-left: -9rem !important; } .m-sm-n95 { margin: -9.5rem !important; } .mt-sm-n95, .my-sm-n95 { margin-top: -9.5rem !important; } .mr-sm-n95, .mx-sm-n95 { margin-right: -9.5rem !important; } .mb-sm-n95, .my-sm-n95 { margin-bottom: -9.5rem !important; } .ml-sm-n95, .mx-sm-n95 { margin-left: -9.5rem !important; } .m-sm-n100 { margin: -10rem !important; } .mt-sm-n100, .my-sm-n100 { margin-top: -10rem !important; } .mr-sm-n100, .mx-sm-n100 { margin-right: -10rem !important; } .mb-sm-n100, .my-sm-n100 { margin-bottom: -10rem !important; } .ml-sm-n100, .mx-sm-n100 { margin-left: -10rem !important; } .m-sm-auto { margin: auto !important; } .mt-sm-auto, .my-sm-auto { margin-top: auto !important; } .mr-sm-auto, .mx-sm-auto { margin-right: auto !important; } .mb-sm-auto, .my-sm-auto { margin-bottom: auto !important; } .ml-sm-auto, .mx-sm-auto { margin-left: auto !important; } } @media (min-width: 768px) { .m-md-0 { margin: 0 !important; } .mt-md-0, .my-md-0 { margin-top: 0 !important; } .mr-md-0, .mx-md-0 { margin-right: 0 !important; } .mb-md-0, .my-md-0 { margin-bottom: 0 !important; } .ml-md-0, .mx-md-0 { margin-left: 0 !important; } .m-md-1 { margin: 0.25rem !important; } .mt-md-1, .my-md-1 { margin-top: 0.25rem !important; } .mr-md-1, .mx-md-1 { margin-right: 0.25rem !important; } .mb-md-1, .my-md-1 { margin-bottom: 0.25rem !important; } .ml-md-1, .mx-md-1 { margin-left: 0.25rem !important; } .m-md-2 { margin: 0.5rem !important; } .mt-md-2, .my-md-2 { margin-top: 0.5rem !important; } .mr-md-2, .mx-md-2 { margin-right: 0.5rem !important; } .mb-md-2, .my-md-2 { margin-bottom: 0.5rem !important; } .ml-md-2, .mx-md-2 { margin-left: 0.5rem !important; } .m-md-3 { margin: 1rem !important; } .mt-md-3, .my-md-3 { margin-top: 1rem !important; } .mr-md-3, .mx-md-3 { margin-right: 1rem !important; } .mb-md-3, .my-md-3 { margin-bottom: 1rem !important; } .ml-md-3, .mx-md-3 { margin-left: 1rem !important; } .m-md-4 { margin: 1.5rem !important; } .mt-md-4, .my-md-4 { margin-top: 1.5rem !important; } .mr-md-4, .mx-md-4 { margin-right: 1.5rem !important; } .mb-md-4, .my-md-4 { margin-bottom: 1.5rem !important; } .ml-md-4, .mx-md-4 { margin-left: 1.5rem !important; } .m-md-5 { margin: 0.5rem !important; } .mt-md-5, .my-md-5 { margin-top: 0.5rem !important; } .mr-md-5, .mx-md-5 { margin-right: 0.5rem !important; } .mb-md-5, .my-md-5 { margin-bottom: 0.5rem !important; } .ml-md-5, .mx-md-5 { margin-left: 0.5rem !important; } .m-md-10 { margin: 1rem !important; } .mt-md-10, .my-md-10 { margin-top: 1rem !important; } .mr-md-10, .mx-md-10 { margin-right: 1rem !important; } .mb-md-10, .my-md-10 { margin-bottom: 1rem !important; } .ml-md-10, .mx-md-10 { margin-left: 1rem !important; } .m-md-15 { margin: 1.5rem !important; } .mt-md-15, .my-md-15 { margin-top: 1.5rem !important; } .mr-md-15, .mx-md-15 { margin-right: 1.5rem !important; } .mb-md-15, .my-md-15 { margin-bottom: 1.5rem !important; } .ml-md-15, .mx-md-15 { margin-left: 1.5rem !important; } .m-md-20 { margin: 2rem !important; } .mt-md-20, .my-md-20 { margin-top: 2rem !important; } .mr-md-20, .mx-md-20 { margin-right: 2rem !important; } .mb-md-20, .my-md-20 { margin-bottom: 2rem !important; } .ml-md-20, .mx-md-20 { margin-left: 2rem !important; } .m-md-25 { margin: 2.5rem !important; } .mt-md-25, .my-md-25 { margin-top: 2.5rem !important; } .mr-md-25, .mx-md-25 { margin-right: 2.5rem !important; } .mb-md-25, .my-md-25 { margin-bottom: 2.5rem !important; } .ml-md-25, .mx-md-25 { margin-left: 2.5rem !important; } .m-md-30 { margin: 3rem !important; } .mt-md-30, .my-md-30 { margin-top: 3rem !important; } .mr-md-30, .mx-md-30 { margin-right: 3rem !important; } .mb-md-30, .my-md-30 { margin-bottom: 3rem !important; } .ml-md-30, .mx-md-30 { margin-left: 3rem !important; } .m-md-35 { margin: 3.5rem !important; } .mt-md-35, .my-md-35 { margin-top: 3.5rem !important; } .mr-md-35, .mx-md-35 { margin-right: 3.5rem !important; } .mb-md-35, .my-md-35 { margin-bottom: 3.5rem !important; } .ml-md-35, .mx-md-35 { margin-left: 3.5rem !important; } .m-md-40 { margin: 4rem !important; } .mt-md-40, .my-md-40 { margin-top: 4rem !important; } .mr-md-40, .mx-md-40 { margin-right: 4rem !important; } .mb-md-40, .my-md-40 { margin-bottom: 4rem !important; } .ml-md-40, .mx-md-40 { margin-left: 4rem !important; } .m-md-45 { margin: 4.5rem !important; } .mt-md-45, .my-md-45 { margin-top: 4.5rem !important; } .mr-md-45, .mx-md-45 { margin-right: 4.5rem !important; } .mb-md-45, .my-md-45 { margin-bottom: 4.5rem !important; } .ml-md-45, .mx-md-45 { margin-left: 4.5rem !important; } .m-md-50 { margin: 5rem !important; } .mt-md-50, .my-md-50 { margin-top: 5rem !important; } .mr-md-50, .mx-md-50 { margin-right: 5rem !important; } .mb-md-50, .my-md-50 { margin-bottom: 5rem !important; } .ml-md-50, .mx-md-50 { margin-left: 5rem !important; } .m-md-55 { margin: 5.5rem !important; } .mt-md-55, .my-md-55 { margin-top: 5.5rem !important; } .mr-md-55, .mx-md-55 { margin-right: 5.5rem !important; } .mb-md-55, .my-md-55 { margin-bottom: 5.5rem !important; } .ml-md-55, .mx-md-55 { margin-left: 5.5rem !important; } .m-md-60 { margin: 6rem !important; } .mt-md-60, .my-md-60 { margin-top: 6rem !important; } .mr-md-60, .mx-md-60 { margin-right: 6rem !important; } .mb-md-60, .my-md-60 { margin-bottom: 6rem !important; } .ml-md-60, .mx-md-60 { margin-left: 6rem !important; } .m-md-65 { margin: 6.5rem !important; } .mt-md-65, .my-md-65 { margin-top: 6.5rem !important; } .mr-md-65, .mx-md-65 { margin-right: 6.5rem !important; } .mb-md-65, .my-md-65 { margin-bottom: 6.5rem !important; } .ml-md-65, .mx-md-65 { margin-left: 6.5rem !important; } .m-md-70 { margin: 7rem !important; } .mt-md-70, .my-md-70 { margin-top: 7rem !important; } .mr-md-70, .mx-md-70 { margin-right: 7rem !important; } .mb-md-70, .my-md-70 { margin-bottom: 7rem !important; } .ml-md-70, .mx-md-70 { margin-left: 7rem !important; } .m-md-75 { margin: 7.5rem !important; } .mt-md-75, .my-md-75 { margin-top: 7.5rem !important; } .mr-md-75, .mx-md-75 { margin-right: 7.5rem !important; } .mb-md-75, .my-md-75 { margin-bottom: 7.5rem !important; } .ml-md-75, .mx-md-75 { margin-left: 7.5rem !important; } .m-md-80 { margin: 8rem !important; } .mt-md-80, .my-md-80 { margin-top: 8rem !important; } .mr-md-80, .mx-md-80 { margin-right: 8rem !important; } .mb-md-80, .my-md-80 { margin-bottom: 8rem !important; } .ml-md-80, .mx-md-80 { margin-left: 8rem !important; } .m-md-85 { margin: 8.5rem !important; } .mt-md-85, .my-md-85 { margin-top: 8.5rem !important; } .mr-md-85, .mx-md-85 { margin-right: 8.5rem !important; } .mb-md-85, .my-md-85 { margin-bottom: 8.5rem !important; } .ml-md-85, .mx-md-85 { margin-left: 8.5rem !important; } .m-md-90 { margin: 9rem !important; } .mt-md-90, .my-md-90 { margin-top: 9rem !important; } .mr-md-90, .mx-md-90 { margin-right: 9rem !important; } .mb-md-90, .my-md-90 { margin-bottom: 9rem !important; } .ml-md-90, .mx-md-90 { margin-left: 9rem !important; } .m-md-95 { margin: 9.5rem !important; } .mt-md-95, .my-md-95 { margin-top: 9.5rem !important; } .mr-md-95, .mx-md-95 { margin-right: 9.5rem !important; } .mb-md-95, .my-md-95 { margin-bottom: 9.5rem !important; } .ml-md-95, .mx-md-95 { margin-left: 9.5rem !important; } .m-md-100 { margin: 10rem !important; } .mt-md-100, .my-md-100 { margin-top: 10rem !important; } .mr-md-100, .mx-md-100 { margin-right: 10rem !important; } .mb-md-100, .my-md-100 { margin-bottom: 10rem !important; } .ml-md-100, .mx-md-100 { margin-left: 10rem !important; } .p-md-0 { padding: 0 !important; } .pt-md-0, .py-md-0 { padding-top: 0 !important; } .pr-md-0, .px-md-0 { padding-right: 0 !important; } .pb-md-0, .py-md-0 { padding-bottom: 0 !important; } .pl-md-0, .px-md-0 { padding-left: 0 !important; } .p-md-1 { padding: 0.25rem !important; } .pt-md-1, .py-md-1 { padding-top: 0.25rem !important; } .pr-md-1, .px-md-1 { padding-right: 0.25rem !important; } .pb-md-1, .py-md-1 { padding-bottom: 0.25rem !important; } .pl-md-1, .px-md-1 { padding-left: 0.25rem !important; } .p-md-2 { padding: 0.5rem !important; } .pt-md-2, .py-md-2 { padding-top: 0.5rem !important; } .pr-md-2, .px-md-2 { padding-right: 0.5rem !important; } .pb-md-2, .py-md-2 { padding-bottom: 0.5rem !important; } .pl-md-2, .px-md-2 { padding-left: 0.5rem !important; } .p-md-3 { padding: 1rem !important; } .pt-md-3, .py-md-3 { padding-top: 1rem !important; } .pr-md-3, .px-md-3 { padding-right: 1rem !important; } .pb-md-3, .py-md-3 { padding-bottom: 1rem !important; } .pl-md-3, .px-md-3 { padding-left: 1rem !important; } .p-md-4 { padding: 1.5rem !important; } .pt-md-4, .py-md-4 { padding-top: 1.5rem !important; } .pr-md-4, .px-md-4 { padding-right: 1.5rem !important; } .pb-md-4, .py-md-4 { padding-bottom: 1.5rem !important; } .pl-md-4, .px-md-4 { padding-left: 1.5rem !important; } .p-md-5 { padding: 0.5rem !important; } .pt-md-5, .py-md-5 { padding-top: 0.5rem !important; } .pr-md-5, .px-md-5 { padding-right: 0.5rem !important; } .pb-md-5, .py-md-5 { padding-bottom: 0.5rem !important; } .pl-md-5, .px-md-5 { padding-left: 0.5rem !important; } .p-md-10 { padding: 1rem !important; } .pt-md-10, .py-md-10 { padding-top: 1rem !important; } .pr-md-10, .px-md-10 { padding-right: 1rem !important; } .pb-md-10, .py-md-10 { padding-bottom: 1rem !important; } .pl-md-10, .px-md-10 { padding-left: 1rem !important; } .p-md-15 { padding: 1.5rem !important; } .pt-md-15, .py-md-15 { padding-top: 1.5rem !important; } .pr-md-15, .px-md-15 { padding-right: 1.5rem !important; } .pb-md-15, .py-md-15 { padding-bottom: 1.5rem !important; } .pl-md-15, .px-md-15 { padding-left: 1.5rem !important; } .p-md-20 { padding: 2rem !important; } .pt-md-20, .py-md-20 { padding-top: 2rem !important; } .pr-md-20, .px-md-20 { padding-right: 2rem !important; } .pb-md-20, .py-md-20 { padding-bottom: 2rem !important; } .pl-md-20, .px-md-20 { padding-left: 2rem !important; } .p-md-25 { padding: 2.5rem !important; } .pt-md-25, .py-md-25 { padding-top: 2.5rem !important; } .pr-md-25, .px-md-25 { padding-right: 2.5rem !important; } .pb-md-25, .py-md-25 { padding-bottom: 2.5rem !important; } .pl-md-25, .px-md-25 { padding-left: 2.5rem !important; } .p-md-30 { padding: 3rem !important; } .pt-md-30, .py-md-30 { padding-top: 3rem !important; } .pr-md-30, .px-md-30 { padding-right: 3rem !important; } .pb-md-30, .py-md-30 { padding-bottom: 3rem !important; } .pl-md-30, .px-md-30 { padding-left: 3rem !important; } .p-md-35 { padding: 3.5rem !important; } .pt-md-35, .py-md-35 { padding-top: 3.5rem !important; } .pr-md-35, .px-md-35 { padding-right: 3.5rem !important; } .pb-md-35, .py-md-35 { padding-bottom: 3.5rem !important; } .pl-md-35, .px-md-35 { padding-left: 3.5rem !important; } .p-md-40 { padding: 4rem !important; } .pt-md-40, .py-md-40 { padding-top: 4rem !important; } .pr-md-40, .px-md-40 { padding-right: 4rem !important; } .pb-md-40, .py-md-40 { padding-bottom: 4rem !important; } .pl-md-40, .px-md-40 { padding-left: 4rem !important; } .p-md-45 { padding: 4.5rem !important; } .pt-md-45, .py-md-45 { padding-top: 4.5rem !important; } .pr-md-45, .px-md-45 { padding-right: 4.5rem !important; } .pb-md-45, .py-md-45 { padding-bottom: 4.5rem !important; } .pl-md-45, .px-md-45 { padding-left: 4.5rem !important; } .p-md-50 { padding: 5rem !important; } .pt-md-50, .py-md-50 { padding-top: 5rem !important; } .pr-md-50, .px-md-50 { padding-right: 5rem !important; } .pb-md-50, .py-md-50 { padding-bottom: 5rem !important; } .pl-md-50, .px-md-50 { padding-left: 5rem !important; } .p-md-55 { padding: 5.5rem !important; } .pt-md-55, .py-md-55 { padding-top: 5.5rem !important; } .pr-md-55, .px-md-55 { padding-right: 5.5rem !important; } .pb-md-55, .py-md-55 { padding-bottom: 5.5rem !important; } .pl-md-55, .px-md-55 { padding-left: 5.5rem !important; } .p-md-60 { padding: 6rem !important; } .pt-md-60, .py-md-60 { padding-top: 6rem !important; } .pr-md-60, .px-md-60 { padding-right: 6rem !important; } .pb-md-60, .py-md-60 { padding-bottom: 6rem !important; } .pl-md-60, .px-md-60 { padding-left: 6rem !important; } .p-md-65 { padding: 6.5rem !important; } .pt-md-65, .py-md-65 { padding-top: 6.5rem !important; } .pr-md-65, .px-md-65 { padding-right: 6.5rem !important; } .pb-md-65, .py-md-65 { padding-bottom: 6.5rem !important; } .pl-md-65, .px-md-65 { padding-left: 6.5rem !important; } .p-md-70 { padding: 7rem !important; } .pt-md-70, .py-md-70 { padding-top: 7rem !important; } .pr-md-70, .px-md-70 { padding-right: 7rem !important; } .pb-md-70, .py-md-70 { padding-bottom: 7rem !important; } .pl-md-70, .px-md-70 { padding-left: 7rem !important; } .p-md-75 { padding: 7.5rem !important; } .pt-md-75, .py-md-75 { padding-top: 7.5rem !important; } .pr-md-75, .px-md-75 { padding-right: 7.5rem !important; } .pb-md-75, .py-md-75 { padding-bottom: 7.5rem !important; } .pl-md-75, .px-md-75 { padding-left: 7.5rem !important; } .p-md-80 { padding: 8rem !important; } .pt-md-80, .py-md-80 { padding-top: 8rem !important; } .pr-md-80, .px-md-80 { padding-right: 8rem !important; } .pb-md-80, .py-md-80 { padding-bottom: 8rem !important; } .pl-md-80, .px-md-80 { padding-left: 8rem !important; } .p-md-85 { padding: 8.5rem !important; } .pt-md-85, .py-md-85 { padding-top: 8.5rem !important; } .pr-md-85, .px-md-85 { padding-right: 8.5rem !important; } .pb-md-85, .py-md-85 { padding-bottom: 8.5rem !important; } .pl-md-85, .px-md-85 { padding-left: 8.5rem !important; } .p-md-90 { padding: 9rem !important; } .pt-md-90, .py-md-90 { padding-top: 9rem !important; } .pr-md-90, .px-md-90 { padding-right: 9rem !important; } .pb-md-90, .py-md-90 { padding-bottom: 9rem !important; } .pl-md-90, .px-md-90 { padding-left: 9rem !important; } .p-md-95 { padding: 9.5rem !important; } .pt-md-95, .py-md-95 { padding-top: 9.5rem !important; } .pr-md-95, .px-md-95 { padding-right: 9.5rem !important; } .pb-md-95, .py-md-95 { padding-bottom: 9.5rem !important; } .pl-md-95, .px-md-95 { padding-left: 9.5rem !important; } .p-md-100 { padding: 10rem !important; } .pt-md-100, .py-md-100 { padding-top: 10rem !important; } .pr-md-100, .px-md-100 { padding-right: 10rem !important; } .pb-md-100, .py-md-100 { padding-bottom: 10rem !important; } .pl-md-100, .px-md-100 { padding-left: 10rem !important; } .m-md-n1 { margin: -0.25rem !important; } .mt-md-n1, .my-md-n1 { margin-top: -0.25rem !important; } .mr-md-n1, .mx-md-n1 { margin-right: -0.25rem !important; } .mb-md-n1, .my-md-n1 { margin-bottom: -0.25rem !important; } .ml-md-n1, .mx-md-n1 { margin-left: -0.25rem !important; } .m-md-n2 { margin: -0.5rem !important; } .mt-md-n2, .my-md-n2 { margin-top: -0.5rem !important; } .mr-md-n2, .mx-md-n2 { margin-right: -0.5rem !important; } .mb-md-n2, .my-md-n2 { margin-bottom: -0.5rem !important; } .ml-md-n2, .mx-md-n2 { margin-left: -0.5rem !important; } .m-md-n3 { margin: -1rem !important; } .mt-md-n3, .my-md-n3 { margin-top: -1rem !important; } .mr-md-n3, .mx-md-n3 { margin-right: -1rem !important; } .mb-md-n3, .my-md-n3 { margin-bottom: -1rem !important; } .ml-md-n3, .mx-md-n3 { margin-left: -1rem !important; } .m-md-n4 { margin: -1.5rem !important; } .mt-md-n4, .my-md-n4 { margin-top: -1.5rem !important; } .mr-md-n4, .mx-md-n4 { margin-right: -1.5rem !important; } .mb-md-n4, .my-md-n4 { margin-bottom: -1.5rem !important; } .ml-md-n4, .mx-md-n4 { margin-left: -1.5rem !important; } .m-md-n5 { margin: -0.5rem !important; } .mt-md-n5, .my-md-n5 { margin-top: -0.5rem !important; } .mr-md-n5, .mx-md-n5 { margin-right: -0.5rem !important; } .mb-md-n5, .my-md-n5 { margin-bottom: -0.5rem !important; } .ml-md-n5, .mx-md-n5 { margin-left: -0.5rem !important; } .m-md-n10 { margin: -1rem !important; } .mt-md-n10, .my-md-n10 { margin-top: -1rem !important; } .mr-md-n10, .mx-md-n10 { margin-right: -1rem !important; } .mb-md-n10, .my-md-n10 { margin-bottom: -1rem !important; } .ml-md-n10, .mx-md-n10 { margin-left: -1rem !important; } .m-md-n15 { margin: -1.5rem !important; } .mt-md-n15, .my-md-n15 { margin-top: -1.5rem !important; } .mr-md-n15, .mx-md-n15 { margin-right: -1.5rem !important; } .mb-md-n15, .my-md-n15 { margin-bottom: -1.5rem !important; } .ml-md-n15, .mx-md-n15 { margin-left: -1.5rem !important; } .m-md-n20 { margin: -2rem !important; } .mt-md-n20, .my-md-n20 { margin-top: -2rem !important; } .mr-md-n20, .mx-md-n20 { margin-right: -2rem !important; } .mb-md-n20, .my-md-n20 { margin-bottom: -2rem !important; } .ml-md-n20, .mx-md-n20 { margin-left: -2rem !important; } .m-md-n25 { margin: -2.5rem !important; } .mt-md-n25, .my-md-n25 { margin-top: -2.5rem !important; } .mr-md-n25, .mx-md-n25 { margin-right: -2.5rem !important; } .mb-md-n25, .my-md-n25 { margin-bottom: -2.5rem !important; } .ml-md-n25, .mx-md-n25 { margin-left: -2.5rem !important; } .m-md-n30 { margin: -3rem !important; } .mt-md-n30, .my-md-n30 { margin-top: -3rem !important; } .mr-md-n30, .mx-md-n30 { margin-right: -3rem !important; } .mb-md-n30, .my-md-n30 { margin-bottom: -3rem !important; } .ml-md-n30, .mx-md-n30 { margin-left: -3rem !important; } .m-md-n35 { margin: -3.5rem !important; } .mt-md-n35, .my-md-n35 { margin-top: -3.5rem !important; } .mr-md-n35, .mx-md-n35 { margin-right: -3.5rem !important; } .mb-md-n35, .my-md-n35 { margin-bottom: -3.5rem !important; } .ml-md-n35, .mx-md-n35 { margin-left: -3.5rem !important; } .m-md-n40 { margin: -4rem !important; } .mt-md-n40, .my-md-n40 { margin-top: -4rem !important; } .mr-md-n40, .mx-md-n40 { margin-right: -4rem !important; } .mb-md-n40, .my-md-n40 { margin-bottom: -4rem !important; } .ml-md-n40, .mx-md-n40 { margin-left: -4rem !important; } .m-md-n45 { margin: -4.5rem !important; } .mt-md-n45, .my-md-n45 { margin-top: -4.5rem !important; } .mr-md-n45, .mx-md-n45 { margin-right: -4.5rem !important; } .mb-md-n45, .my-md-n45 { margin-bottom: -4.5rem !important; } .ml-md-n45, .mx-md-n45 { margin-left: -4.5rem !important; } .m-md-n50 { margin: -5rem !important; } .mt-md-n50, .my-md-n50 { margin-top: -5rem !important; } .mr-md-n50, .mx-md-n50 { margin-right: -5rem !important; } .mb-md-n50, .my-md-n50 { margin-bottom: -5rem !important; } .ml-md-n50, .mx-md-n50 { margin-left: -5rem !important; } .m-md-n55 { margin: -5.5rem !important; } .mt-md-n55, .my-md-n55 { margin-top: -5.5rem !important; } .mr-md-n55, .mx-md-n55 { margin-right: -5.5rem !important; } .mb-md-n55, .my-md-n55 { margin-bottom: -5.5rem !important; } .ml-md-n55, .mx-md-n55 { margin-left: -5.5rem !important; } .m-md-n60 { margin: -6rem !important; } .mt-md-n60, .my-md-n60 { margin-top: -6rem !important; } .mr-md-n60, .mx-md-n60 { margin-right: -6rem !important; } .mb-md-n60, .my-md-n60 { margin-bottom: -6rem !important; } .ml-md-n60, .mx-md-n60 { margin-left: -6rem !important; } .m-md-n65 { margin: -6.5rem !important; } .mt-md-n65, .my-md-n65 { margin-top: -6.5rem !important; } .mr-md-n65, .mx-md-n65 { margin-right: -6.5rem !important; } .mb-md-n65, .my-md-n65 { margin-bottom: -6.5rem !important; } .ml-md-n65, .mx-md-n65 { margin-left: -6.5rem !important; } .m-md-n70 { margin: -7rem !important; } .mt-md-n70, .my-md-n70 { margin-top: -7rem !important; } .mr-md-n70, .mx-md-n70 { margin-right: -7rem !important; } .mb-md-n70, .my-md-n70 { margin-bottom: -7rem !important; } .ml-md-n70, .mx-md-n70 { margin-left: -7rem !important; } .m-md-n75 { margin: -7.5rem !important; } .mt-md-n75, .my-md-n75 { margin-top: -7.5rem !important; } .mr-md-n75, .mx-md-n75 { margin-right: -7.5rem !important; } .mb-md-n75, .my-md-n75 { margin-bottom: -7.5rem !important; } .ml-md-n75, .mx-md-n75 { margin-left: -7.5rem !important; } .m-md-n80 { margin: -8rem !important; } .mt-md-n80, .my-md-n80 { margin-top: -8rem !important; } .mr-md-n80, .mx-md-n80 { margin-right: -8rem !important; } .mb-md-n80, .my-md-n80 { margin-bottom: -8rem !important; } .ml-md-n80, .mx-md-n80 { margin-left: -8rem !important; } .m-md-n85 { margin: -8.5rem !important; } .mt-md-n85, .my-md-n85 { margin-top: -8.5rem !important; } .mr-md-n85, .mx-md-n85 { margin-right: -8.5rem !important; } .mb-md-n85, .my-md-n85 { margin-bottom: -8.5rem !important; } .ml-md-n85, .mx-md-n85 { margin-left: -8.5rem !important; } .m-md-n90 { margin: -9rem !important; } .mt-md-n90, .my-md-n90 { margin-top: -9rem !important; } .mr-md-n90, .mx-md-n90 { margin-right: -9rem !important; } .mb-md-n90, .my-md-n90 { margin-bottom: -9rem !important; } .ml-md-n90, .mx-md-n90 { margin-left: -9rem !important; } .m-md-n95 { margin: -9.5rem !important; } .mt-md-n95, .my-md-n95 { margin-top: -9.5rem !important; } .mr-md-n95, .mx-md-n95 { margin-right: -9.5rem !important; } .mb-md-n95, .my-md-n95 { margin-bottom: -9.5rem !important; } .ml-md-n95, .mx-md-n95 { margin-left: -9.5rem !important; } .m-md-n100 { margin: -10rem !important; } .mt-md-n100, .my-md-n100 { margin-top: -10rem !important; } .mr-md-n100, .mx-md-n100 { margin-right: -10rem !important; } .mb-md-n100, .my-md-n100 { margin-bottom: -10rem !important; } .ml-md-n100, .mx-md-n100 { margin-left: -10rem !important; } .m-md-auto { margin: auto !important; } .mt-md-auto, .my-md-auto { margin-top: auto !important; } .mr-md-auto, .mx-md-auto { margin-right: auto !important; } .mb-md-auto, .my-md-auto { margin-bottom: auto !important; } .ml-md-auto, .mx-md-auto { margin-left: auto !important; } } @media (min-width: 992px) { .m-lg-0 { margin: 0 !important; } .mt-lg-0, .my-lg-0 { margin-top: 0 !important; } .mr-lg-0, .mx-lg-0 { margin-right: 0 !important; } .mb-lg-0, .my-lg-0 { margin-bottom: 0 !important; } .ml-lg-0, .mx-lg-0 { margin-left: 0 !important; } .m-lg-1 { margin: 0.25rem !important; } .mt-lg-1, .my-lg-1 { margin-top: 0.25rem !important; } .mr-lg-1, .mx-lg-1 { margin-right: 0.25rem !important; } .mb-lg-1, .my-lg-1 { margin-bottom: 0.25rem !important; } .ml-lg-1, .mx-lg-1 { margin-left: 0.25rem !important; } .m-lg-2 { margin: 0.5rem !important; } .mt-lg-2, .my-lg-2 { margin-top: 0.5rem !important; } .mr-lg-2, .mx-lg-2 { margin-right: 0.5rem !important; } .mb-lg-2, .my-lg-2 { margin-bottom: 0.5rem !important; } .ml-lg-2, .mx-lg-2 { margin-left: 0.5rem !important; } .m-lg-3 { margin: 1rem !important; } .mt-lg-3, .my-lg-3 { margin-top: 1rem !important; } .mr-lg-3, .mx-lg-3 { margin-right: 1rem !important; } .mb-lg-3, .my-lg-3 { margin-bottom: 1rem !important; } .ml-lg-3, .mx-lg-3 { margin-left: 1rem !important; } .m-lg-4 { margin: 1.5rem !important; } .mt-lg-4, .my-lg-4 { margin-top: 1.5rem !important; } .mr-lg-4, .mx-lg-4 { margin-right: 1.5rem !important; } .mb-lg-4, .my-lg-4 { margin-bottom: 1.5rem !important; } .ml-lg-4, .mx-lg-4 { margin-left: 1.5rem !important; } .m-lg-5 { margin: 0.5rem !important; } .mt-lg-5, .my-lg-5 { margin-top: 0.5rem !important; } .mr-lg-5, .mx-lg-5 { margin-right: 0.5rem !important; } .mb-lg-5, .my-lg-5 { margin-bottom: 0.5rem !important; } .ml-lg-5, .mx-lg-5 { margin-left: 0.5rem !important; } .m-lg-10 { margin: 1rem !important; } .mt-lg-10, .my-lg-10 { margin-top: 1rem !important; } .mr-lg-10, .mx-lg-10 { margin-right: 1rem !important; } .mb-lg-10, .my-lg-10 { margin-bottom: 1rem !important; } .ml-lg-10, .mx-lg-10 { margin-left: 1rem !important; } .m-lg-15 { margin: 1.5rem !important; } .mt-lg-15, .my-lg-15 { margin-top: 1.5rem !important; } .mr-lg-15, .mx-lg-15 { margin-right: 1.5rem !important; } .mb-lg-15, .my-lg-15 { margin-bottom: 1.5rem !important; } .ml-lg-15, .mx-lg-15 { margin-left: 1.5rem !important; } .m-lg-20 { margin: 2rem !important; } .mt-lg-20, .my-lg-20 { margin-top: 2rem !important; } .mr-lg-20, .mx-lg-20 { margin-right: 2rem !important; } .mb-lg-20, .my-lg-20 { margin-bottom: 2rem !important; } .ml-lg-20, .mx-lg-20 { margin-left: 2rem !important; } .m-lg-25 { margin: 2.5rem !important; } .mt-lg-25, .my-lg-25 { margin-top: 2.5rem !important; } .mr-lg-25, .mx-lg-25 { margin-right: 2.5rem !important; } .mb-lg-25, .my-lg-25 { margin-bottom: 2.5rem !important; } .ml-lg-25, .mx-lg-25 { margin-left: 2.5rem !important; } .m-lg-30 { margin: 3rem !important; } .mt-lg-30, .my-lg-30 { margin-top: 3rem !important; } .mr-lg-30, .mx-lg-30 { margin-right: 3rem !important; } .mb-lg-30, .my-lg-30 { margin-bottom: 3rem !important; } .ml-lg-30, .mx-lg-30 { margin-left: 3rem !important; } .m-lg-35 { margin: 3.5rem !important; } .mt-lg-35, .my-lg-35 { margin-top: 3.5rem !important; } .mr-lg-35, .mx-lg-35 { margin-right: 3.5rem !important; } .mb-lg-35, .my-lg-35 { margin-bottom: 3.5rem !important; } .ml-lg-35, .mx-lg-35 { margin-left: 3.5rem !important; } .m-lg-40 { margin: 4rem !important; } .mt-lg-40, .my-lg-40 { margin-top: 4rem !important; } .mr-lg-40, .mx-lg-40 { margin-right: 4rem !important; } .mb-lg-40, .my-lg-40 { margin-bottom: 4rem !important; } .ml-lg-40, .mx-lg-40 { margin-left: 4rem !important; } .m-lg-45 { margin: 4.5rem !important; } .mt-lg-45, .my-lg-45 { margin-top: 4.5rem !important; } .mr-lg-45, .mx-lg-45 { margin-right: 4.5rem !important; } .mb-lg-45, .my-lg-45 { margin-bottom: 4.5rem !important; } .ml-lg-45, .mx-lg-45 { margin-left: 4.5rem !important; } .m-lg-50 { margin: 5rem !important; } .mt-lg-50, .my-lg-50 { margin-top: 5rem !important; } .mr-lg-50, .mx-lg-50 { margin-right: 5rem !important; } .mb-lg-50, .my-lg-50 { margin-bottom: 5rem !important; } .ml-lg-50, .mx-lg-50 { margin-left: 5rem !important; } .m-lg-55 { margin: 5.5rem !important; } .mt-lg-55, .my-lg-55 { margin-top: 5.5rem !important; } .mr-lg-55, .mx-lg-55 { margin-right: 5.5rem !important; } .mb-lg-55, .my-lg-55 { margin-bottom: 5.5rem !important; } .ml-lg-55, .mx-lg-55 { margin-left: 5.5rem !important; } .m-lg-60 { margin: 6rem !important; } .mt-lg-60, .my-lg-60 { margin-top: 6rem !important; } .mr-lg-60, .mx-lg-60 { margin-right: 6rem !important; } .mb-lg-60, .my-lg-60 { margin-bottom: 6rem !important; } .ml-lg-60, .mx-lg-60 { margin-left: 6rem !important; } .m-lg-65 { margin: 6.5rem !important; } .mt-lg-65, .my-lg-65 { margin-top: 6.5rem !important; } .mr-lg-65, .mx-lg-65 { margin-right: 6.5rem !important; } .mb-lg-65, .my-lg-65 { margin-bottom: 6.5rem !important; } .ml-lg-65, .mx-lg-65 { margin-left: 6.5rem !important; } .m-lg-70 { margin: 7rem !important; } .mt-lg-70, .my-lg-70 { margin-top: 7rem !important; } .mr-lg-70, .mx-lg-70 { margin-right: 7rem !important; } .mb-lg-70, .my-lg-70 { margin-bottom: 7rem !important; } .ml-lg-70, .mx-lg-70 { margin-left: 7rem !important; } .m-lg-75 { margin: 7.5rem !important; } .mt-lg-75, .my-lg-75 { margin-top: 7.5rem !important; } .mr-lg-75, .mx-lg-75 { margin-right: 7.5rem !important; } .mb-lg-75, .my-lg-75 { margin-bottom: 7.5rem !important; } .ml-lg-75, .mx-lg-75 { margin-left: 7.5rem !important; } .m-lg-80 { margin: 8rem !important; } .mt-lg-80, .my-lg-80 { margin-top: 8rem !important; } .mr-lg-80, .mx-lg-80 { margin-right: 8rem !important; } .mb-lg-80, .my-lg-80 { margin-bottom: 8rem !important; } .ml-lg-80, .mx-lg-80 { margin-left: 8rem !important; } .m-lg-85 { margin: 8.5rem !important; } .mt-lg-85, .my-lg-85 { margin-top: 8.5rem !important; } .mr-lg-85, .mx-lg-85 { margin-right: 8.5rem !important; } .mb-lg-85, .my-lg-85 { margin-bottom: 8.5rem !important; } .ml-lg-85, .mx-lg-85 { margin-left: 8.5rem !important; } .m-lg-90 { margin: 9rem !important; } .mt-lg-90, .my-lg-90 { margin-top: 9rem !important; } .mr-lg-90, .mx-lg-90 { margin-right: 9rem !important; } .mb-lg-90, .my-lg-90 { margin-bottom: 9rem !important; } .ml-lg-90, .mx-lg-90 { margin-left: 9rem !important; } .m-lg-95 { margin: 9.5rem !important; } .mt-lg-95, .my-lg-95 { margin-top: 9.5rem !important; } .mr-lg-95, .mx-lg-95 { margin-right: 9.5rem !important; } .mb-lg-95, .my-lg-95 { margin-bottom: 9.5rem !important; } .ml-lg-95, .mx-lg-95 { margin-left: 9.5rem !important; } .m-lg-100 { margin: 10rem !important; } .mt-lg-100, .my-lg-100 { margin-top: 10rem !important; } .mr-lg-100, .mx-lg-100 { margin-right: 10rem !important; } .mb-lg-100, .my-lg-100 { margin-bottom: 10rem !important; } .ml-lg-100, .mx-lg-100 { margin-left: 10rem !important; } .p-lg-0 { padding: 0 !important; } .pt-lg-0, .py-lg-0 { padding-top: 0 !important; } .pr-lg-0, .px-lg-0 { padding-right: 0 !important; } .pb-lg-0, .py-lg-0 { padding-bottom: 0 !important; } .pl-lg-0, .px-lg-0 { padding-left: 0 !important; } .p-lg-1 { padding: 0.25rem !important; } .pt-lg-1, .py-lg-1 { padding-top: 0.25rem !important; } .pr-lg-1, .px-lg-1 { padding-right: 0.25rem !important; } .pb-lg-1, .py-lg-1 { padding-bottom: 0.25rem !important; } .pl-lg-1, .px-lg-1 { padding-left: 0.25rem !important; } .p-lg-2 { padding: 0.5rem !important; } .pt-lg-2, .py-lg-2 { padding-top: 0.5rem !important; } .pr-lg-2, .px-lg-2 { padding-right: 0.5rem !important; } .pb-lg-2, .py-lg-2 { padding-bottom: 0.5rem !important; } .pl-lg-2, .px-lg-2 { padding-left: 0.5rem !important; } .p-lg-3 { padding: 1rem !important; } .pt-lg-3, .py-lg-3 { padding-top: 1rem !important; } .pr-lg-3, .px-lg-3 { padding-right: 1rem !important; } .pb-lg-3, .py-lg-3 { padding-bottom: 1rem !important; } .pl-lg-3, .px-lg-3 { padding-left: 1rem !important; } .p-lg-4 { padding: 1.5rem !important; } .pt-lg-4, .py-lg-4 { padding-top: 1.5rem !important; } .pr-lg-4, .px-lg-4 { padding-right: 1.5rem !important; } .pb-lg-4, .py-lg-4 { padding-bottom: 1.5rem !important; } .pl-lg-4, .px-lg-4 { padding-left: 1.5rem !important; } .p-lg-5 { padding: 0.5rem !important; } .pt-lg-5, .py-lg-5 { padding-top: 0.5rem !important; } .pr-lg-5, .px-lg-5 { padding-right: 0.5rem !important; } .pb-lg-5, .py-lg-5 { padding-bottom: 0.5rem !important; } .pl-lg-5, .px-lg-5 { padding-left: 0.5rem !important; } .p-lg-10 { padding: 1rem !important; } .pt-lg-10, .py-lg-10 { padding-top: 1rem !important; } .pr-lg-10, .px-lg-10 { padding-right: 1rem !important; } .pb-lg-10, .py-lg-10 { padding-bottom: 1rem !important; } .pl-lg-10, .px-lg-10 { padding-left: 1rem !important; } .p-lg-15 { padding: 1.5rem !important; } .pt-lg-15, .py-lg-15 { padding-top: 1.5rem !important; } .pr-lg-15, .px-lg-15 { padding-right: 1.5rem !important; } .pb-lg-15, .py-lg-15 { padding-bottom: 1.5rem !important; } .pl-lg-15, .px-lg-15 { padding-left: 1.5rem !important; } .p-lg-20 { padding: 2rem !important; } .pt-lg-20, .py-lg-20 { padding-top: 2rem !important; } .pr-lg-20, .px-lg-20 { padding-right: 2rem !important; } .pb-lg-20, .py-lg-20 { padding-bottom: 2rem !important; } .pl-lg-20, .px-lg-20 { padding-left: 2rem !important; } .p-lg-25 { padding: 2.5rem !important; } .pt-lg-25, .py-lg-25 { padding-top: 2.5rem !important; } .pr-lg-25, .px-lg-25 { padding-right: 2.5rem !important; } .pb-lg-25, .py-lg-25 { padding-bottom: 2.5rem !important; } .pl-lg-25, .px-lg-25 { padding-left: 2.5rem !important; } .p-lg-30 { padding: 3rem !important; } .pt-lg-30, .py-lg-30 { padding-top: 3rem !important; } .pr-lg-30, .px-lg-30 { padding-right: 3rem !important; } .pb-lg-30, .py-lg-30 { padding-bottom: 3rem !important; } .pl-lg-30, .px-lg-30 { padding-left: 3rem !important; } .p-lg-35 { padding: 3.5rem !important; } .pt-lg-35, .py-lg-35 { padding-top: 3.5rem !important; } .pr-lg-35, .px-lg-35 { padding-right: 3.5rem !important; } .pb-lg-35, .py-lg-35 { padding-bottom: 3.5rem !important; } .pl-lg-35, .px-lg-35 { padding-left: 3.5rem !important; } .p-lg-40 { padding: 4rem !important; } .pt-lg-40, .py-lg-40 { padding-top: 4rem !important; } .pr-lg-40, .px-lg-40 { padding-right: 4rem !important; } .pb-lg-40, .py-lg-40 { padding-bottom: 4rem !important; } .pl-lg-40, .px-lg-40 { padding-left: 4rem !important; } .p-lg-45 { padding: 4.5rem !important; } .pt-lg-45, .py-lg-45 { padding-top: 4.5rem !important; } .pr-lg-45, .px-lg-45 { padding-right: 4.5rem !important; } .pb-lg-45, .py-lg-45 { padding-bottom: 4.5rem !important; } .pl-lg-45, .px-lg-45 { padding-left: 4.5rem !important; } .p-lg-50 { padding: 5rem !important; } .pt-lg-50, .py-lg-50 { padding-top: 5rem !important; } .pr-lg-50, .px-lg-50 { padding-right: 5rem !important; } .pb-lg-50, .py-lg-50 { padding-bottom: 5rem !important; } .pl-lg-50, .px-lg-50 { padding-left: 5rem !important; } .p-lg-55 { padding: 5.5rem !important; } .pt-lg-55, .py-lg-55 { padding-top: 5.5rem !important; } .pr-lg-55, .px-lg-55 { padding-right: 5.5rem !important; } .pb-lg-55, .py-lg-55 { padding-bottom: 5.5rem !important; } .pl-lg-55, .px-lg-55 { padding-left: 5.5rem !important; } .p-lg-60 { padding: 6rem !important; } .pt-lg-60, .py-lg-60 { padding-top: 6rem !important; } .pr-lg-60, .px-lg-60 { padding-right: 6rem !important; } .pb-lg-60, .py-lg-60 { padding-bottom: 6rem !important; } .pl-lg-60, .px-lg-60 { padding-left: 6rem !important; } .p-lg-65 { padding: 6.5rem !important; } .pt-lg-65, .py-lg-65 { padding-top: 6.5rem !important; } .pr-lg-65, .px-lg-65 { padding-right: 6.5rem !important; } .pb-lg-65, .py-lg-65 { padding-bottom: 6.5rem !important; } .pl-lg-65, .px-lg-65 { padding-left: 6.5rem !important; } .p-lg-70 { padding: 7rem !important; } .pt-lg-70, .py-lg-70 { padding-top: 7rem !important; } .pr-lg-70, .px-lg-70 { padding-right: 7rem !important; } .pb-lg-70, .py-lg-70 { padding-bottom: 7rem !important; } .pl-lg-70, .px-lg-70 { padding-left: 7rem !important; } .p-lg-75 { padding: 7.5rem !important; } .pt-lg-75, .py-lg-75 { padding-top: 7.5rem !important; } .pr-lg-75, .px-lg-75 { padding-right: 7.5rem !important; } .pb-lg-75, .py-lg-75 { padding-bottom: 7.5rem !important; } .pl-lg-75, .px-lg-75 { padding-left: 7.5rem !important; } .p-lg-80 { padding: 8rem !important; } .pt-lg-80, .py-lg-80 { padding-top: 8rem !important; } .pr-lg-80, .px-lg-80 { padding-right: 8rem !important; } .pb-lg-80, .py-lg-80 { padding-bottom: 8rem !important; } .pl-lg-80, .px-lg-80 { padding-left: 8rem !important; } .p-lg-85 { padding: 8.5rem !important; } .pt-lg-85, .py-lg-85 { padding-top: 8.5rem !important; } .pr-lg-85, .px-lg-85 { padding-right: 8.5rem !important; } .pb-lg-85, .py-lg-85 { padding-bottom: 8.5rem !important; } .pl-lg-85, .px-lg-85 { padding-left: 8.5rem !important; } .p-lg-90 { padding: 9rem !important; } .pt-lg-90, .py-lg-90 { padding-top: 9rem !important; } .pr-lg-90, .px-lg-90 { padding-right: 9rem !important; } .pb-lg-90, .py-lg-90 { padding-bottom: 9rem !important; } .pl-lg-90, .px-lg-90 { padding-left: 9rem !important; } .p-lg-95 { padding: 9.5rem !important; } .pt-lg-95, .py-lg-95 { padding-top: 9.5rem !important; } .pr-lg-95, .px-lg-95 { padding-right: 9.5rem !important; } .pb-lg-95, .py-lg-95 { padding-bottom: 9.5rem !important; } .pl-lg-95, .px-lg-95 { padding-left: 9.5rem !important; } .p-lg-100 { padding: 10rem !important; } .pt-lg-100, .py-lg-100 { padding-top: 10rem !important; } .pr-lg-100, .px-lg-100 { padding-right: 10rem !important; } .pb-lg-100, .py-lg-100 { padding-bottom: 10rem !important; } .pl-lg-100, .px-lg-100 { padding-left: 10rem !important; } .m-lg-n1 { margin: -0.25rem !important; } .mt-lg-n1, .my-lg-n1 { margin-top: -0.25rem !important; } .mr-lg-n1, .mx-lg-n1 { margin-right: -0.25rem !important; } .mb-lg-n1, .my-lg-n1 { margin-bottom: -0.25rem !important; } .ml-lg-n1, .mx-lg-n1 { margin-left: -0.25rem !important; } .m-lg-n2 { margin: -0.5rem !important; } .mt-lg-n2, .my-lg-n2 { margin-top: -0.5rem !important; } .mr-lg-n2, .mx-lg-n2 { margin-right: -0.5rem !important; } .mb-lg-n2, .my-lg-n2 { margin-bottom: -0.5rem !important; } .ml-lg-n2, .mx-lg-n2 { margin-left: -0.5rem !important; } .m-lg-n3 { margin: -1rem !important; } .mt-lg-n3, .my-lg-n3 { margin-top: -1rem !important; } .mr-lg-n3, .mx-lg-n3 { margin-right: -1rem !important; } .mb-lg-n3, .my-lg-n3 { margin-bottom: -1rem !important; } .ml-lg-n3, .mx-lg-n3 { margin-left: -1rem !important; } .m-lg-n4 { margin: -1.5rem !important; } .mt-lg-n4, .my-lg-n4 { margin-top: -1.5rem !important; } .mr-lg-n4, .mx-lg-n4 { margin-right: -1.5rem !important; } .mb-lg-n4, .my-lg-n4 { margin-bottom: -1.5rem !important; } .ml-lg-n4, .mx-lg-n4 { margin-left: -1.5rem !important; } .m-lg-n5 { margin: -0.5rem !important; } .mt-lg-n5, .my-lg-n5 { margin-top: -0.5rem !important; } .mr-lg-n5, .mx-lg-n5 { margin-right: -0.5rem !important; } .mb-lg-n5, .my-lg-n5 { margin-bottom: -0.5rem !important; } .ml-lg-n5, .mx-lg-n5 { margin-left: -0.5rem !important; } .m-lg-n10 { margin: -1rem !important; } .mt-lg-n10, .my-lg-n10 { margin-top: -1rem !important; } .mr-lg-n10, .mx-lg-n10 { margin-right: -1rem !important; } .mb-lg-n10, .my-lg-n10 { margin-bottom: -1rem !important; } .ml-lg-n10, .mx-lg-n10 { margin-left: -1rem !important; } .m-lg-n15 { margin: -1.5rem !important; } .mt-lg-n15, .my-lg-n15 { margin-top: -1.5rem !important; } .mr-lg-n15, .mx-lg-n15 { margin-right: -1.5rem !important; } .mb-lg-n15, .my-lg-n15 { margin-bottom: -1.5rem !important; } .ml-lg-n15, .mx-lg-n15 { margin-left: -1.5rem !important; } .m-lg-n20 { margin: -2rem !important; } .mt-lg-n20, .my-lg-n20 { margin-top: -2rem !important; } .mr-lg-n20, .mx-lg-n20 { margin-right: -2rem !important; } .mb-lg-n20, .my-lg-n20 { margin-bottom: -2rem !important; } .ml-lg-n20, .mx-lg-n20 { margin-left: -2rem !important; } .m-lg-n25 { margin: -2.5rem !important; } .mt-lg-n25, .my-lg-n25 { margin-top: -2.5rem !important; } .mr-lg-n25, .mx-lg-n25 { margin-right: -2.5rem !important; } .mb-lg-n25, .my-lg-n25 { margin-bottom: -2.5rem !important; } .ml-lg-n25, .mx-lg-n25 { margin-left: -2.5rem !important; } .m-lg-n30 { margin: -3rem !important; } .mt-lg-n30, .my-lg-n30 { margin-top: -3rem !important; } .mr-lg-n30, .mx-lg-n30 { margin-right: -3rem !important; } .mb-lg-n30, .my-lg-n30 { margin-bottom: -3rem !important; } .ml-lg-n30, .mx-lg-n30 { margin-left: -3rem !important; } .m-lg-n35 { margin: -3.5rem !important; } .mt-lg-n35, .my-lg-n35 { margin-top: -3.5rem !important; } .mr-lg-n35, .mx-lg-n35 { margin-right: -3.5rem !important; } .mb-lg-n35, .my-lg-n35 { margin-bottom: -3.5rem !important; } .ml-lg-n35, .mx-lg-n35 { margin-left: -3.5rem !important; } .m-lg-n40 { margin: -4rem !important; } .mt-lg-n40, .my-lg-n40 { margin-top: -4rem !important; } .mr-lg-n40, .mx-lg-n40 { margin-right: -4rem !important; } .mb-lg-n40, .my-lg-n40 { margin-bottom: -4rem !important; } .ml-lg-n40, .mx-lg-n40 { margin-left: -4rem !important; } .m-lg-n45 { margin: -4.5rem !important; } .mt-lg-n45, .my-lg-n45 { margin-top: -4.5rem !important; } .mr-lg-n45, .mx-lg-n45 { margin-right: -4.5rem !important; } .mb-lg-n45, .my-lg-n45 { margin-bottom: -4.5rem !important; } .ml-lg-n45, .mx-lg-n45 { margin-left: -4.5rem !important; } .m-lg-n50 { margin: -5rem !important; } .mt-lg-n50, .my-lg-n50 { margin-top: -5rem !important; } .mr-lg-n50, .mx-lg-n50 { margin-right: -5rem !important; } .mb-lg-n50, .my-lg-n50 { margin-bottom: -5rem !important; } .ml-lg-n50, .mx-lg-n50 { margin-left: -5rem !important; } .m-lg-n55 { margin: -5.5rem !important; } .mt-lg-n55, .my-lg-n55 { margin-top: -5.5rem !important; } .mr-lg-n55, .mx-lg-n55 { margin-right: -5.5rem !important; } .mb-lg-n55, .my-lg-n55 { margin-bottom: -5.5rem !important; } .ml-lg-n55, .mx-lg-n55 { margin-left: -5.5rem !important; } .m-lg-n60 { margin: -6rem !important; } .mt-lg-n60, .my-lg-n60 { margin-top: -6rem !important; } .mr-lg-n60, .mx-lg-n60 { margin-right: -6rem !important; } .mb-lg-n60, .my-lg-n60 { margin-bottom: -6rem !important; } .ml-lg-n60, .mx-lg-n60 { margin-left: -6rem !important; } .m-lg-n65 { margin: -6.5rem !important; } .mt-lg-n65, .my-lg-n65 { margin-top: -6.5rem !important; } .mr-lg-n65, .mx-lg-n65 { margin-right: -6.5rem !important; } .mb-lg-n65, .my-lg-n65 { margin-bottom: -6.5rem !important; } .ml-lg-n65, .mx-lg-n65 { margin-left: -6.5rem !important; } .m-lg-n70 { margin: -7rem !important; } .mt-lg-n70, .my-lg-n70 { margin-top: -7rem !important; } .mr-lg-n70, .mx-lg-n70 { margin-right: -7rem !important; } .mb-lg-n70, .my-lg-n70 { margin-bottom: -7rem !important; } .ml-lg-n70, .mx-lg-n70 { margin-left: -7rem !important; } .m-lg-n75 { margin: -7.5rem !important; } .mt-lg-n75, .my-lg-n75 { margin-top: -7.5rem !important; } .mr-lg-n75, .mx-lg-n75 { margin-right: -7.5rem !important; } .mb-lg-n75, .my-lg-n75 { margin-bottom: -7.5rem !important; } .ml-lg-n75, .mx-lg-n75 { margin-left: -7.5rem !important; } .m-lg-n80 { margin: -8rem !important; } .mt-lg-n80, .my-lg-n80 { margin-top: -8rem !important; } .mr-lg-n80, .mx-lg-n80 { margin-right: -8rem !important; } .mb-lg-n80, .my-lg-n80 { margin-bottom: -8rem !important; } .ml-lg-n80, .mx-lg-n80 { margin-left: -8rem !important; } .m-lg-n85 { margin: -8.5rem !important; } .mt-lg-n85, .my-lg-n85 { margin-top: -8.5rem !important; } .mr-lg-n85, .mx-lg-n85 { margin-right: -8.5rem !important; } .mb-lg-n85, .my-lg-n85 { margin-bottom: -8.5rem !important; } .ml-lg-n85, .mx-lg-n85 { margin-left: -8.5rem !important; } .m-lg-n90 { margin: -9rem !important; } .mt-lg-n90, .my-lg-n90 { margin-top: -9rem !important; } .mr-lg-n90, .mx-lg-n90 { margin-right: -9rem !important; } .mb-lg-n90, .my-lg-n90 { margin-bottom: -9rem !important; } .ml-lg-n90, .mx-lg-n90 { margin-left: -9rem !important; } .m-lg-n95 { margin: -9.5rem !important; } .mt-lg-n95, .my-lg-n95 { margin-top: -9.5rem !important; } .mr-lg-n95, .mx-lg-n95 { margin-right: -9.5rem !important; } .mb-lg-n95, .my-lg-n95 { margin-bottom: -9.5rem !important; } .ml-lg-n95, .mx-lg-n95 { margin-left: -9.5rem !important; } .m-lg-n100 { margin: -10rem !important; } .mt-lg-n100, .my-lg-n100 { margin-top: -10rem !important; } .mr-lg-n100, .mx-lg-n100 { margin-right: -10rem !important; } .mb-lg-n100, .my-lg-n100 { margin-bottom: -10rem !important; } .ml-lg-n100, .mx-lg-n100 { margin-left: -10rem !important; } .m-lg-auto { margin: auto !important; } .mt-lg-auto, .my-lg-auto { margin-top: auto !important; } .mr-lg-auto, .mx-lg-auto { margin-right: auto !important; } .mb-lg-auto, .my-lg-auto { margin-bottom: auto !important; } .ml-lg-auto, .mx-lg-auto { margin-left: auto !important; } } @media (min-width: 1200px) { .m-xl-0 { margin: 0 !important; } .mt-xl-0, .my-xl-0 { margin-top: 0 !important; } .mr-xl-0, .mx-xl-0 { margin-right: 0 !important; } .mb-xl-0, .my-xl-0 { margin-bottom: 0 !important; } .ml-xl-0, .mx-xl-0 { margin-left: 0 !important; } .m-xl-1 { margin: 0.25rem !important; } .mt-xl-1, .my-xl-1 { margin-top: 0.25rem !important; } .mr-xl-1, .mx-xl-1 { margin-right: 0.25rem !important; } .mb-xl-1, .my-xl-1 { margin-bottom: 0.25rem !important; } .ml-xl-1, .mx-xl-1 { margin-left: 0.25rem !important; } .m-xl-2 { margin: 0.5rem !important; } .mt-xl-2, .my-xl-2 { margin-top: 0.5rem !important; } .mr-xl-2, .mx-xl-2 { margin-right: 0.5rem !important; } .mb-xl-2, .my-xl-2 { margin-bottom: 0.5rem !important; } .ml-xl-2, .mx-xl-2 { margin-left: 0.5rem !important; } .m-xl-3 { margin: 1rem !important; } .mt-xl-3, .my-xl-3 { margin-top: 1rem !important; } .mr-xl-3, .mx-xl-3 { margin-right: 1rem !important; } .mb-xl-3, .my-xl-3 { margin-bottom: 1rem !important; } .ml-xl-3, .mx-xl-3 { margin-left: 1rem !important; } .m-xl-4 { margin: 1.5rem !important; } .mt-xl-4, .my-xl-4 { margin-top: 1.5rem !important; } .mr-xl-4, .mx-xl-4 { margin-right: 1.5rem !important; } .mb-xl-4, .my-xl-4 { margin-bottom: 1.5rem !important; } .ml-xl-4, .mx-xl-4 { margin-left: 1.5rem !important; } .m-xl-5 { margin: 0.5rem !important; } .mt-xl-5, .my-xl-5 { margin-top: 0.5rem !important; } .mr-xl-5, .mx-xl-5 { margin-right: 0.5rem !important; } .mb-xl-5, .my-xl-5 { margin-bottom: 0.5rem !important; } .ml-xl-5, .mx-xl-5 { margin-left: 0.5rem !important; } .m-xl-10 { margin: 1rem !important; } .mt-xl-10, .my-xl-10 { margin-top: 1rem !important; } .mr-xl-10, .mx-xl-10 { margin-right: 1rem !important; } .mb-xl-10, .my-xl-10 { margin-bottom: 1rem !important; } .ml-xl-10, .mx-xl-10 { margin-left: 1rem !important; } .m-xl-15 { margin: 1.5rem !important; } .mt-xl-15, .my-xl-15 { margin-top: 1.5rem !important; } .mr-xl-15, .mx-xl-15 { margin-right: 1.5rem !important; } .mb-xl-15, .my-xl-15 { margin-bottom: 1.5rem !important; } .ml-xl-15, .mx-xl-15 { margin-left: 1.5rem !important; } .m-xl-20 { margin: 2rem !important; } .mt-xl-20, .my-xl-20 { margin-top: 2rem !important; } .mr-xl-20, .mx-xl-20 { margin-right: 2rem !important; } .mb-xl-20, .my-xl-20 { margin-bottom: 2rem !important; } .ml-xl-20, .mx-xl-20 { margin-left: 2rem !important; } .m-xl-25 { margin: 2.5rem !important; } .mt-xl-25, .my-xl-25 { margin-top: 2.5rem !important; } .mr-xl-25, .mx-xl-25 { margin-right: 2.5rem !important; } .mb-xl-25, .my-xl-25 { margin-bottom: 2.5rem !important; } .ml-xl-25, .mx-xl-25 { margin-left: 2.5rem !important; } .m-xl-30 { margin: 3rem !important; } .mt-xl-30, .my-xl-30 { margin-top: 3rem !important; } .mr-xl-30, .mx-xl-30 { margin-right: 3rem !important; } .mb-xl-30, .my-xl-30 { margin-bottom: 3rem !important; } .ml-xl-30, .mx-xl-30 { margin-left: 3rem !important; } .m-xl-35 { margin: 3.5rem !important; } .mt-xl-35, .my-xl-35 { margin-top: 3.5rem !important; } .mr-xl-35, .mx-xl-35 { margin-right: 3.5rem !important; } .mb-xl-35, .my-xl-35 { margin-bottom: 3.5rem !important; } .ml-xl-35, .mx-xl-35 { margin-left: 3.5rem !important; } .m-xl-40 { margin: 4rem !important; } .mt-xl-40, .my-xl-40 { margin-top: 4rem !important; } .mr-xl-40, .mx-xl-40 { margin-right: 4rem !important; } .mb-xl-40, .my-xl-40 { margin-bottom: 4rem !important; } .ml-xl-40, .mx-xl-40 { margin-left: 4rem !important; } .m-xl-45 { margin: 4.5rem !important; } .mt-xl-45, .my-xl-45 { margin-top: 4.5rem !important; } .mr-xl-45, .mx-xl-45 { margin-right: 4.5rem !important; } .mb-xl-45, .my-xl-45 { margin-bottom: 4.5rem !important; } .ml-xl-45, .mx-xl-45 { margin-left: 4.5rem !important; } .m-xl-50 { margin: 5rem !important; } .mt-xl-50, .my-xl-50 { margin-top: 5rem !important; } .mr-xl-50, .mx-xl-50 { margin-right: 5rem !important; } .mb-xl-50, .my-xl-50 { margin-bottom: 5rem !important; } .ml-xl-50, .mx-xl-50 { margin-left: 5rem !important; } .m-xl-55 { margin: 5.5rem !important; } .mt-xl-55, .my-xl-55 { margin-top: 5.5rem !important; } .mr-xl-55, .mx-xl-55 { margin-right: 5.5rem !important; } .mb-xl-55, .my-xl-55 { margin-bottom: 5.5rem !important; } .ml-xl-55, .mx-xl-55 { margin-left: 5.5rem !important; } .m-xl-60 { margin: 6rem !important; } .mt-xl-60, .my-xl-60 { margin-top: 6rem !important; } .mr-xl-60, .mx-xl-60 { margin-right: 6rem !important; } .mb-xl-60, .my-xl-60 { margin-bottom: 6rem !important; } .ml-xl-60, .mx-xl-60 { margin-left: 6rem !important; } .m-xl-65 { margin: 6.5rem !important; } .mt-xl-65, .my-xl-65 { margin-top: 6.5rem !important; } .mr-xl-65, .mx-xl-65 { margin-right: 6.5rem !important; } .mb-xl-65, .my-xl-65 { margin-bottom: 6.5rem !important; } .ml-xl-65, .mx-xl-65 { margin-left: 6.5rem !important; } .m-xl-70 { margin: 7rem !important; } .mt-xl-70, .my-xl-70 { margin-top: 7rem !important; } .mr-xl-70, .mx-xl-70 { margin-right: 7rem !important; } .mb-xl-70, .my-xl-70 { margin-bottom: 7rem !important; } .ml-xl-70, .mx-xl-70 { margin-left: 7rem !important; } .m-xl-75 { margin: 7.5rem !important; } .mt-xl-75, .my-xl-75 { margin-top: 7.5rem !important; } .mr-xl-75, .mx-xl-75 { margin-right: 7.5rem !important; } .mb-xl-75, .my-xl-75 { margin-bottom: 7.5rem !important; } .ml-xl-75, .mx-xl-75 { margin-left: 7.5rem !important; } .m-xl-80 { margin: 8rem !important; } .mt-xl-80, .my-xl-80 { margin-top: 8rem !important; } .mr-xl-80, .mx-xl-80 { margin-right: 8rem !important; } .mb-xl-80, .my-xl-80 { margin-bottom: 8rem !important; } .ml-xl-80, .mx-xl-80 { margin-left: 8rem !important; } .m-xl-85 { margin: 8.5rem !important; } .mt-xl-85, .my-xl-85 { margin-top: 8.5rem !important; } .mr-xl-85, .mx-xl-85 { margin-right: 8.5rem !important; } .mb-xl-85, .my-xl-85 { margin-bottom: 8.5rem !important; } .ml-xl-85, .mx-xl-85 { margin-left: 8.5rem !important; } .m-xl-90 { margin: 9rem !important; } .mt-xl-90, .my-xl-90 { margin-top: 9rem !important; } .mr-xl-90, .mx-xl-90 { margin-right: 9rem !important; } .mb-xl-90, .my-xl-90 { margin-bottom: 9rem !important; } .ml-xl-90, .mx-xl-90 { margin-left: 9rem !important; } .m-xl-95 { margin: 9.5rem !important; } .mt-xl-95, .my-xl-95 { margin-top: 9.5rem !important; } .mr-xl-95, .mx-xl-95 { margin-right: 9.5rem !important; } .mb-xl-95, .my-xl-95 { margin-bottom: 9.5rem !important; } .ml-xl-95, .mx-xl-95 { margin-left: 9.5rem !important; } .m-xl-100 { margin: 10rem !important; } .mt-xl-100, .my-xl-100 { margin-top: 10rem !important; } .mr-xl-100, .mx-xl-100 { margin-right: 10rem !important; } .mb-xl-100, .my-xl-100 { margin-bottom: 10rem !important; } .ml-xl-100, .mx-xl-100 { margin-left: 10rem !important; } .p-xl-0 { padding: 0 !important; } .pt-xl-0, .py-xl-0 { padding-top: 0 !important; } .pr-xl-0, .px-xl-0 { padding-right: 0 !important; } .pb-xl-0, .py-xl-0 { padding-bottom: 0 !important; } .pl-xl-0, .px-xl-0 { padding-left: 0 !important; } .p-xl-1 { padding: 0.25rem !important; } .pt-xl-1, .py-xl-1 { padding-top: 0.25rem !important; } .pr-xl-1, .px-xl-1 { padding-right: 0.25rem !important; } .pb-xl-1, .py-xl-1 { padding-bottom: 0.25rem !important; } .pl-xl-1, .px-xl-1 { padding-left: 0.25rem !important; } .p-xl-2 { padding: 0.5rem !important; } .pt-xl-2, .py-xl-2 { padding-top: 0.5rem !important; } .pr-xl-2, .px-xl-2 { padding-right: 0.5rem !important; } .pb-xl-2, .py-xl-2 { padding-bottom: 0.5rem !important; } .pl-xl-2, .px-xl-2 { padding-left: 0.5rem !important; } .p-xl-3 { padding: 1rem !important; } .pt-xl-3, .py-xl-3 { padding-top: 1rem !important; } .pr-xl-3, .px-xl-3 { padding-right: 1rem !important; } .pb-xl-3, .py-xl-3 { padding-bottom: 1rem !important; } .pl-xl-3, .px-xl-3 { padding-left: 1rem !important; } .p-xl-4 { padding: 1.5rem !important; } .pt-xl-4, .py-xl-4 { padding-top: 1.5rem !important; } .pr-xl-4, .px-xl-4 { padding-right: 1.5rem !important; } .pb-xl-4, .py-xl-4 { padding-bottom: 1.5rem !important; } .pl-xl-4, .px-xl-4 { padding-left: 1.5rem !important; } .p-xl-5 { padding: 0.5rem !important; } .pt-xl-5, .py-xl-5 { padding-top: 0.5rem !important; } .pr-xl-5, .px-xl-5 { padding-right: 0.5rem !important; } .pb-xl-5, .py-xl-5 { padding-bottom: 0.5rem !important; } .pl-xl-5, .px-xl-5 { padding-left: 0.5rem !important; } .p-xl-10 { padding: 1rem !important; } .pt-xl-10, .py-xl-10 { padding-top: 1rem !important; } .pr-xl-10, .px-xl-10 { padding-right: 1rem !important; } .pb-xl-10, .py-xl-10 { padding-bottom: 1rem !important; } .pl-xl-10, .px-xl-10 { padding-left: 1rem !important; } .p-xl-15 { padding: 1.5rem !important; } .pt-xl-15, .py-xl-15 { padding-top: 1.5rem !important; } .pr-xl-15, .px-xl-15 { padding-right: 1.5rem !important; } .pb-xl-15, .py-xl-15 { padding-bottom: 1.5rem !important; } .pl-xl-15, .px-xl-15 { padding-left: 1.5rem !important; } .p-xl-20 { padding: 2rem !important; } .pt-xl-20, .py-xl-20 { padding-top: 2rem !important; } .pr-xl-20, .px-xl-20 { padding-right: 2rem !important; } .pb-xl-20, .py-xl-20 { padding-bottom: 2rem !important; } .pl-xl-20, .px-xl-20 { padding-left: 2rem !important; } .p-xl-25 { padding: 2.5rem !important; } .pt-xl-25, .py-xl-25 { padding-top: 2.5rem !important; } .pr-xl-25, .px-xl-25 { padding-right: 2.5rem !important; } .pb-xl-25, .py-xl-25 { padding-bottom: 2.5rem !important; } .pl-xl-25, .px-xl-25 { padding-left: 2.5rem !important; } .p-xl-30 { padding: 3rem !important; } .pt-xl-30, .py-xl-30 { padding-top: 3rem !important; } .pr-xl-30, .px-xl-30 { padding-right: 3rem !important; } .pb-xl-30, .py-xl-30 { padding-bottom: 3rem !important; } .pl-xl-30, .px-xl-30 { padding-left: 3rem !important; } .p-xl-35 { padding: 3.5rem !important; } .pt-xl-35, .py-xl-35 { padding-top: 3.5rem !important; } .pr-xl-35, .px-xl-35 { padding-right: 3.5rem !important; } .pb-xl-35, .py-xl-35 { padding-bottom: 3.5rem !important; } .pl-xl-35, .px-xl-35 { padding-left: 3.5rem !important; } .p-xl-40 { padding: 4rem !important; } .pt-xl-40, .py-xl-40 { padding-top: 4rem !important; } .pr-xl-40, .px-xl-40 { padding-right: 4rem !important; } .pb-xl-40, .py-xl-40 { padding-bottom: 4rem !important; } .pl-xl-40, .px-xl-40 { padding-left: 4rem !important; } .p-xl-45 { padding: 4.5rem !important; } .pt-xl-45, .py-xl-45 { padding-top: 4.5rem !important; } .pr-xl-45, .px-xl-45 { padding-right: 4.5rem !important; } .pb-xl-45, .py-xl-45 { padding-bottom: 4.5rem !important; } .pl-xl-45, .px-xl-45 { padding-left: 4.5rem !important; } .p-xl-50 { padding: 5rem !important; } .pt-xl-50, .py-xl-50 { padding-top: 5rem !important; } .pr-xl-50, .px-xl-50 { padding-right: 5rem !important; } .pb-xl-50, .py-xl-50 { padding-bottom: 5rem !important; } .pl-xl-50, .px-xl-50 { padding-left: 5rem !important; } .p-xl-55 { padding: 5.5rem !important; } .pt-xl-55, .py-xl-55 { padding-top: 5.5rem !important; } .pr-xl-55, .px-xl-55 { padding-right: 5.5rem !important; } .pb-xl-55, .py-xl-55 { padding-bottom: 5.5rem !important; } .pl-xl-55, .px-xl-55 { padding-left: 5.5rem !important; } .p-xl-60 { padding: 6rem !important; } .pt-xl-60, .py-xl-60 { padding-top: 6rem !important; } .pr-xl-60, .px-xl-60 { padding-right: 6rem !important; } .pb-xl-60, .py-xl-60 { padding-bottom: 6rem !important; } .pl-xl-60, .px-xl-60 { padding-left: 6rem !important; } .p-xl-65 { padding: 6.5rem !important; } .pt-xl-65, .py-xl-65 { padding-top: 6.5rem !important; } .pr-xl-65, .px-xl-65 { padding-right: 6.5rem !important; } .pb-xl-65, .py-xl-65 { padding-bottom: 6.5rem !important; } .pl-xl-65, .px-xl-65 { padding-left: 6.5rem !important; } .p-xl-70 { padding: 7rem !important; } .pt-xl-70, .py-xl-70 { padding-top: 7rem !important; } .pr-xl-70, .px-xl-70 { padding-right: 7rem !important; } .pb-xl-70, .py-xl-70 { padding-bottom: 7rem !important; } .pl-xl-70, .px-xl-70 { padding-left: 7rem !important; } .p-xl-75 { padding: 7.5rem !important; } .pt-xl-75, .py-xl-75 { padding-top: 7.5rem !important; } .pr-xl-75, .px-xl-75 { padding-right: 7.5rem !important; } .pb-xl-75, .py-xl-75 { padding-bottom: 7.5rem !important; } .pl-xl-75, .px-xl-75 { padding-left: 7.5rem !important; } .p-xl-80 { padding: 8rem !important; } .pt-xl-80, .py-xl-80 { padding-top: 8rem !important; } .pr-xl-80, .px-xl-80 { padding-right: 8rem !important; } .pb-xl-80, .py-xl-80 { padding-bottom: 8rem !important; } .pl-xl-80, .px-xl-80 { padding-left: 8rem !important; } .p-xl-85 { padding: 8.5rem !important; } .pt-xl-85, .py-xl-85 { padding-top: 8.5rem !important; } .pr-xl-85, .px-xl-85 { padding-right: 8.5rem !important; } .pb-xl-85, .py-xl-85 { padding-bottom: 8.5rem !important; } .pl-xl-85, .px-xl-85 { padding-left: 8.5rem !important; } .p-xl-90 { padding: 9rem !important; } .pt-xl-90, .py-xl-90 { padding-top: 9rem !important; } .pr-xl-90, .px-xl-90 { padding-right: 9rem !important; } .pb-xl-90, .py-xl-90 { padding-bottom: 9rem !important; } .pl-xl-90, .px-xl-90 { padding-left: 9rem !important; } .p-xl-95 { padding: 9.5rem !important; } .pt-xl-95, .py-xl-95 { padding-top: 9.5rem !important; } .pr-xl-95, .px-xl-95 { padding-right: 9.5rem !important; } .pb-xl-95, .py-xl-95 { padding-bottom: 9.5rem !important; } .pl-xl-95, .px-xl-95 { padding-left: 9.5rem !important; } .p-xl-100 { padding: 10rem !important; } .pt-xl-100, .py-xl-100 { padding-top: 10rem !important; } .pr-xl-100, .px-xl-100 { padding-right: 10rem !important; } .pb-xl-100, .py-xl-100 { padding-bottom: 10rem !important; } .pl-xl-100, .px-xl-100 { padding-left: 10rem !important; } .m-xl-n1 { margin: -0.25rem !important; } .mt-xl-n1, .my-xl-n1 { margin-top: -0.25rem !important; } .mr-xl-n1, .mx-xl-n1 { margin-right: -0.25rem !important; } .mb-xl-n1, .my-xl-n1 { margin-bottom: -0.25rem !important; } .ml-xl-n1, .mx-xl-n1 { margin-left: -0.25rem !important; } .m-xl-n2 { margin: -0.5rem !important; } .mt-xl-n2, .my-xl-n2 { margin-top: -0.5rem !important; } .mr-xl-n2, .mx-xl-n2 { margin-right: -0.5rem !important; } .mb-xl-n2, .my-xl-n2 { margin-bottom: -0.5rem !important; } .ml-xl-n2, .mx-xl-n2 { margin-left: -0.5rem !important; } .m-xl-n3 { margin: -1rem !important; } .mt-xl-n3, .my-xl-n3 { margin-top: -1rem !important; } .mr-xl-n3, .mx-xl-n3 { margin-right: -1rem !important; } .mb-xl-n3, .my-xl-n3 { margin-bottom: -1rem !important; } .ml-xl-n3, .mx-xl-n3 { margin-left: -1rem !important; } .m-xl-n4 { margin: -1.5rem !important; } .mt-xl-n4, .my-xl-n4 { margin-top: -1.5rem !important; } .mr-xl-n4, .mx-xl-n4 { margin-right: -1.5rem !important; } .mb-xl-n4, .my-xl-n4 { margin-bottom: -1.5rem !important; } .ml-xl-n4, .mx-xl-n4 { margin-left: -1.5rem !important; } .m-xl-n5 { margin: -0.5rem !important; } .mt-xl-n5, .my-xl-n5 { margin-top: -0.5rem !important; } .mr-xl-n5, .mx-xl-n5 { margin-right: -0.5rem !important; } .mb-xl-n5, .my-xl-n5 { margin-bottom: -0.5rem !important; } .ml-xl-n5, .mx-xl-n5 { margin-left: -0.5rem !important; } .m-xl-n10 { margin: -1rem !important; } .mt-xl-n10, .my-xl-n10 { margin-top: -1rem !important; } .mr-xl-n10, .mx-xl-n10 { margin-right: -1rem !important; } .mb-xl-n10, .my-xl-n10 { margin-bottom: -1rem !important; } .ml-xl-n10, .mx-xl-n10 { margin-left: -1rem !important; } .m-xl-n15 { margin: -1.5rem !important; } .mt-xl-n15, .my-xl-n15 { margin-top: -1.5rem !important; } .mr-xl-n15, .mx-xl-n15 { margin-right: -1.5rem !important; } .mb-xl-n15, .my-xl-n15 { margin-bottom: -1.5rem !important; } .ml-xl-n15, .mx-xl-n15 { margin-left: -1.5rem !important; } .m-xl-n20 { margin: -2rem !important; } .mt-xl-n20, .my-xl-n20 { margin-top: -2rem !important; } .mr-xl-n20, .mx-xl-n20 { margin-right: -2rem !important; } .mb-xl-n20, .my-xl-n20 { margin-bottom: -2rem !important; } .ml-xl-n20, .mx-xl-n20 { margin-left: -2rem !important; } .m-xl-n25 { margin: -2.5rem !important; } .mt-xl-n25, .my-xl-n25 { margin-top: -2.5rem !important; } .mr-xl-n25, .mx-xl-n25 { margin-right: -2.5rem !important; } .mb-xl-n25, .my-xl-n25 { margin-bottom: -2.5rem !important; } .ml-xl-n25, .mx-xl-n25 { margin-left: -2.5rem !important; } .m-xl-n30 { margin: -3rem !important; } .mt-xl-n30, .my-xl-n30 { margin-top: -3rem !important; } .mr-xl-n30, .mx-xl-n30 { margin-right: -3rem !important; } .mb-xl-n30, .my-xl-n30 { margin-bottom: -3rem !important; } .ml-xl-n30, .mx-xl-n30 { margin-left: -3rem !important; } .m-xl-n35 { margin: -3.5rem !important; } .mt-xl-n35, .my-xl-n35 { margin-top: -3.5rem !important; } .mr-xl-n35, .mx-xl-n35 { margin-right: -3.5rem !important; } .mb-xl-n35, .my-xl-n35 { margin-bottom: -3.5rem !important; } .ml-xl-n35, .mx-xl-n35 { margin-left: -3.5rem !important; } .m-xl-n40 { margin: -4rem !important; } .mt-xl-n40, .my-xl-n40 { margin-top: -4rem !important; } .mr-xl-n40, .mx-xl-n40 { margin-right: -4rem !important; } .mb-xl-n40, .my-xl-n40 { margin-bottom: -4rem !important; } .ml-xl-n40, .mx-xl-n40 { margin-left: -4rem !important; } .m-xl-n45 { margin: -4.5rem !important; } .mt-xl-n45, .my-xl-n45 { margin-top: -4.5rem !important; } .mr-xl-n45, .mx-xl-n45 { margin-right: -4.5rem !important; } .mb-xl-n45, .my-xl-n45 { margin-bottom: -4.5rem !important; } .ml-xl-n45, .mx-xl-n45 { margin-left: -4.5rem !important; } .m-xl-n50 { margin: -5rem !important; } .mt-xl-n50, .my-xl-n50 { margin-top: -5rem !important; } .mr-xl-n50, .mx-xl-n50 { margin-right: -5rem !important; } .mb-xl-n50, .my-xl-n50 { margin-bottom: -5rem !important; } .ml-xl-n50, .mx-xl-n50 { margin-left: -5rem !important; } .m-xl-n55 { margin: -5.5rem !important; } .mt-xl-n55, .my-xl-n55 { margin-top: -5.5rem !important; } .mr-xl-n55, .mx-xl-n55 { margin-right: -5.5rem !important; } .mb-xl-n55, .my-xl-n55 { margin-bottom: -5.5rem !important; } .ml-xl-n55, .mx-xl-n55 { margin-left: -5.5rem !important; } .m-xl-n60 { margin: -6rem !important; } .mt-xl-n60, .my-xl-n60 { margin-top: -6rem !important; } .mr-xl-n60, .mx-xl-n60 { margin-right: -6rem !important; } .mb-xl-n60, .my-xl-n60 { margin-bottom: -6rem !important; } .ml-xl-n60, .mx-xl-n60 { margin-left: -6rem !important; } .m-xl-n65 { margin: -6.5rem !important; } .mt-xl-n65, .my-xl-n65 { margin-top: -6.5rem !important; } .mr-xl-n65, .mx-xl-n65 { margin-right: -6.5rem !important; } .mb-xl-n65, .my-xl-n65 { margin-bottom: -6.5rem !important; } .ml-xl-n65, .mx-xl-n65 { margin-left: -6.5rem !important; } .m-xl-n70 { margin: -7rem !important; } .mt-xl-n70, .my-xl-n70 { margin-top: -7rem !important; } .mr-xl-n70, .mx-xl-n70 { margin-right: -7rem !important; } .mb-xl-n70, .my-xl-n70 { margin-bottom: -7rem !important; } .ml-xl-n70, .mx-xl-n70 { margin-left: -7rem !important; } .m-xl-n75 { margin: -7.5rem !important; } .mt-xl-n75, .my-xl-n75 { margin-top: -7.5rem !important; } .mr-xl-n75, .mx-xl-n75 { margin-right: -7.5rem !important; } .mb-xl-n75, .my-xl-n75 { margin-bottom: -7.5rem !important; } .ml-xl-n75, .mx-xl-n75 { margin-left: -7.5rem !important; } .m-xl-n80 { margin: -8rem !important; } .mt-xl-n80, .my-xl-n80 { margin-top: -8rem !important; } .mr-xl-n80, .mx-xl-n80 { margin-right: -8rem !important; } .mb-xl-n80, .my-xl-n80 { margin-bottom: -8rem !important; } .ml-xl-n80, .mx-xl-n80 { margin-left: -8rem !important; } .m-xl-n85 { margin: -8.5rem !important; } .mt-xl-n85, .my-xl-n85 { margin-top: -8.5rem !important; } .mr-xl-n85, .mx-xl-n85 { margin-right: -8.5rem !important; } .mb-xl-n85, .my-xl-n85 { margin-bottom: -8.5rem !important; } .ml-xl-n85, .mx-xl-n85 { margin-left: -8.5rem !important; } .m-xl-n90 { margin: -9rem !important; } .mt-xl-n90, .my-xl-n90 { margin-top: -9rem !important; } .mr-xl-n90, .mx-xl-n90 { margin-right: -9rem !important; } .mb-xl-n90, .my-xl-n90 { margin-bottom: -9rem !important; } .ml-xl-n90, .mx-xl-n90 { margin-left: -9rem !important; } .m-xl-n95 { margin: -9.5rem !important; } .mt-xl-n95, .my-xl-n95 { margin-top: -9.5rem !important; } .mr-xl-n95, .mx-xl-n95 { margin-right: -9.5rem !important; } .mb-xl-n95, .my-xl-n95 { margin-bottom: -9.5rem !important; } .ml-xl-n95, .mx-xl-n95 { margin-left: -9.5rem !important; } .m-xl-n100 { margin: -10rem !important; } .mt-xl-n100, .my-xl-n100 { margin-top: -10rem !important; } .mr-xl-n100, .mx-xl-n100 { margin-right: -10rem !important; } .mb-xl-n100, .my-xl-n100 { margin-bottom: -10rem !important; } .ml-xl-n100, .mx-xl-n100 { margin-left: -10rem !important; } .m-xl-auto { margin: auto !important; } .mt-xl-auto, .my-xl-auto { margin-top: auto !important; } .mr-xl-auto, .mx-xl-auto { margin-right: auto !important; } .mb-xl-auto, .my-xl-auto { margin-bottom: auto !important; } .ml-xl-auto, .mx-xl-auto { margin-left: auto !important; } } .d-none { display: none !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-block { display: block !important; } .d-table { display: table !important; } .d-table-row { display: table-row !important; } .d-table-cell { display: table-cell !important; } .d-flex { display: flex !important; } .d-inline-flex { display: inline-flex !important; } @media (min-width: 576px) { .d-sm-none { display: none !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-block { display: block !important; } .d-sm-table { display: table !important; } .d-sm-table-row { display: table-row !important; } .d-sm-table-cell { display: table-cell !important; } .d-sm-flex { display: flex !important; } .d-sm-inline-flex { display: inline-flex !important; } } @media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-block { display: block !important; } .d-md-table { display: table !important; } .d-md-table-row { display: table-row !important; } .d-md-table-cell { display: table-cell !important; } .d-md-flex { display: flex !important; } .d-md-inline-flex { display: inline-flex !important; } } @media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-block { display: block !important; } .d-lg-table { display: table !important; } .d-lg-table-row { display: table-row !important; } .d-lg-table-cell { display: table-cell !important; } .d-lg-flex { display: flex !important; } .d-lg-inline-flex { display: inline-flex !important; } } @media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-block { display: block !important; } .d-xl-table { display: table !important; } .d-xl-table-row { display: table-row !important; } .d-xl-table-cell { display: table-cell !important; } .d-xl-flex { display: flex !important; } .d-xl-inline-flex { display: inline-flex !important; } } @media print { .d-print-none { display: none !important; } .d-print-inline { display: inline !important; } .d-print-inline-block { display: inline-block !important; } .d-print-block { display: block !important; } .d-print-table { display: table !important; } .d-print-table-row { display: table-row !important; } .d-print-table-cell { display: table-cell !important; } .d-print-flex { display: flex !important; } .d-print-inline-flex { display: inline-flex !important; } } .flex-row { flex-direction: row !important; } .flex-column { flex-direction: column !important; } .flex-row-reverse { flex-direction: row-reverse !important; } .flex-column-reverse { flex-direction: column-reverse !important; } .flex-wrap { flex-wrap: wrap !important; } .flex-nowrap { flex-wrap: nowrap !important; } .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-fill { flex: 1 1 auto !important; } .flex-grow-0 { flex-grow: 0 !important; } .flex-grow-1 { flex-grow: 1 !important; } .flex-shrink-0 { flex-shrink: 0 !important; } .flex-shrink-1 { flex-shrink: 1 !important; } .justify-content-start { justify-content: flex-start !important; } .justify-content-end { justify-content: flex-end !important; } .justify-content-center { justify-content: center !important; } .justify-content-between { justify-content: space-between !important; } .justify-content-around { justify-content: space-around !important; } .align-items-start { align-items: flex-start !important; } .align-items-end { align-items: flex-end !important; } .align-items-center { align-items: center !important; } .align-items-baseline { align-items: baseline !important; } .align-items-stretch { align-items: stretch !important; } .align-content-start { align-content: flex-start !important; } .align-content-end { align-content: flex-end !important; } .align-content-center { align-content: center !important; } .align-content-between { align-content: space-between !important; } .align-content-around { align-content: space-around !important; } .align-content-stretch { align-content: stretch !important; } .align-self-auto { align-self: auto !important; } .align-self-start { align-self: flex-start !important; } .align-self-end { align-self: flex-end !important; } .align-self-center { align-self: center !important; } .align-self-baseline { align-self: baseline !important; } .align-self-stretch { align-self: stretch !important; } @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; } .flex-sm-column { flex-direction: column !important; } .flex-sm-row-reverse { flex-direction: row-reverse !important; } .flex-sm-column-reverse { flex-direction: column-reverse !important; } .flex-sm-wrap { flex-wrap: wrap !important; } .flex-sm-nowrap { flex-wrap: nowrap !important; } .flex-sm-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-sm-fill { flex: 1 1 auto !important; } .flex-sm-grow-0 { flex-grow: 0 !important; } .flex-sm-grow-1 { flex-grow: 1 !important; } .flex-sm-shrink-0 { flex-shrink: 0 !important; } .flex-sm-shrink-1 { flex-shrink: 1 !important; } .justify-content-sm-start { justify-content: flex-start !important; } .justify-content-sm-end { justify-content: flex-end !important; } .justify-content-sm-center { justify-content: center !important; } .justify-content-sm-between { justify-content: space-between !important; } .justify-content-sm-around { justify-content: space-around !important; } .align-items-sm-start { align-items: flex-start !important; } .align-items-sm-end { align-items: flex-end !important; } .align-items-sm-center { align-items: center !important; } .align-items-sm-baseline { align-items: baseline !important; } .align-items-sm-stretch { align-items: stretch !important; } .align-content-sm-start { align-content: flex-start !important; } .align-content-sm-end { align-content: flex-end !important; } .align-content-sm-center { align-content: center !important; } .align-content-sm-between { align-content: space-between !important; } .align-content-sm-around { align-content: space-around !important; } .align-content-sm-stretch { align-content: stretch !important; } .align-self-sm-auto { align-self: auto !important; } .align-self-sm-start { align-self: flex-start !important; } .align-self-sm-end { align-self: flex-end !important; } .align-self-sm-center { align-self: center !important; } .align-self-sm-baseline { align-self: baseline !important; } .align-self-sm-stretch { align-self: stretch !important; } } @media (min-width: 768px) { .flex-md-row { flex-direction: row !important; } .flex-md-column { flex-direction: column !important; } .flex-md-row-reverse { flex-direction: row-reverse !important; } .flex-md-column-reverse { flex-direction: column-reverse !important; } .flex-md-wrap { flex-wrap: wrap !important; } .flex-md-nowrap { flex-wrap: nowrap !important; } .flex-md-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-md-fill { flex: 1 1 auto !important; } .flex-md-grow-0 { flex-grow: 0 !important; } .flex-md-grow-1 { flex-grow: 1 !important; } .flex-md-shrink-0 { flex-shrink: 0 !important; } .flex-md-shrink-1 { flex-shrink: 1 !important; } .justify-content-md-start { justify-content: flex-start !important; } .justify-content-md-end { justify-content: flex-end !important; } .justify-content-md-center { justify-content: center !important; } .justify-content-md-between { justify-content: space-between !important; } .justify-content-md-around { justify-content: space-around !important; } .align-items-md-start { align-items: flex-start !important; } .align-items-md-end { align-items: flex-end !important; } .align-items-md-center { align-items: center !important; } .align-items-md-baseline { align-items: baseline !important; } .align-items-md-stretch { align-items: stretch !important; } .align-content-md-start { align-content: flex-start !important; } .align-content-md-end { align-content: flex-end !important; } .align-content-md-center { align-content: center !important; } .align-content-md-between { align-content: space-between !important; } .align-content-md-around { align-content: space-around !important; } .align-content-md-stretch { align-content: stretch !important; } .align-self-md-auto { align-self: auto !important; } .align-self-md-start { align-self: flex-start !important; } .align-self-md-end { align-self: flex-end !important; } .align-self-md-center { align-self: center !important; } .align-self-md-baseline { align-self: baseline !important; } .align-self-md-stretch { align-self: stretch !important; } } @media (min-width: 992px) { .flex-lg-row { flex-direction: row !important; } .flex-lg-column { flex-direction: column !important; } .flex-lg-row-reverse { flex-direction: row-reverse !important; } .flex-lg-column-reverse { flex-direction: column-reverse !important; } .flex-lg-wrap { flex-wrap: wrap !important; } .flex-lg-nowrap { flex-wrap: nowrap !important; } .flex-lg-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-lg-fill { flex: 1 1 auto !important; } .flex-lg-grow-0 { flex-grow: 0 !important; } .flex-lg-grow-1 { flex-grow: 1 !important; } .flex-lg-shrink-0 { flex-shrink: 0 !important; } .flex-lg-shrink-1 { flex-shrink: 1 !important; } .justify-content-lg-start { justify-content: flex-start !important; } .justify-content-lg-end { justify-content: flex-end !important; } .justify-content-lg-center { justify-content: center !important; } .justify-content-lg-between { justify-content: space-between !important; } .justify-content-lg-around { justify-content: space-around !important; } .align-items-lg-start { align-items: flex-start !important; } .align-items-lg-end { align-items: flex-end !important; } .align-items-lg-center { align-items: center !important; } .align-items-lg-baseline { align-items: baseline !important; } .align-items-lg-stretch { align-items: stretch !important; } .align-content-lg-start { align-content: flex-start !important; } .align-content-lg-end { align-content: flex-end !important; } .align-content-lg-center { align-content: center !important; } .align-content-lg-between { align-content: space-between !important; } .align-content-lg-around { align-content: space-around !important; } .align-content-lg-stretch { align-content: stretch !important; } .align-self-lg-auto { align-self: auto !important; } .align-self-lg-start { align-self: flex-start !important; } .align-self-lg-end { align-self: flex-end !important; } .align-self-lg-center { align-self: center !important; } .align-self-lg-baseline { align-self: baseline !important; } .align-self-lg-stretch { align-self: stretch !important; } } @media (min-width: 1200px) { .flex-xl-row { flex-direction: row !important; } .flex-xl-column { flex-direction: column !important; } .flex-xl-row-reverse { flex-direction: row-reverse !important; } .flex-xl-column-reverse { flex-direction: column-reverse !important; } .flex-xl-wrap { flex-wrap: wrap !important; } .flex-xl-nowrap { flex-wrap: nowrap !important; } .flex-xl-wrap-reverse { flex-wrap: wrap-reverse !important; } .flex-xl-fill { flex: 1 1 auto !important; } .flex-xl-grow-0 { flex-grow: 0 !important; } .flex-xl-grow-1 { flex-grow: 1 !important; } .flex-xl-shrink-0 { flex-shrink: 0 !important; } .flex-xl-shrink-1 { flex-shrink: 1 !important; } .justify-content-xl-start { justify-content: flex-start !important; } .justify-content-xl-end { justify-content: flex-end !important; } .justify-content-xl-center { justify-content: center !important; } .justify-content-xl-between { justify-content: space-between !important; } .justify-content-xl-around { justify-content: space-around !important; } .align-items-xl-start { align-items: flex-start !important; } .align-items-xl-end { align-items: flex-end !important; } .align-items-xl-center { align-items: center !important; } .align-items-xl-baseline { align-items: baseline !important; } .align-items-xl-stretch { align-items: stretch !important; } .align-content-xl-start { align-content: flex-start !important; } .align-content-xl-end { align-content: flex-end !important; } .align-content-xl-center { align-content: center !important; } .align-content-xl-between { align-content: space-between !important; } .align-content-xl-around { align-content: space-around !important; } .align-content-xl-stretch { align-content: stretch !important; } .align-self-xl-auto { align-self: auto !important; } .align-self-xl-start { align-self: flex-start !important; } .align-self-xl-end { align-self: flex-end !important; } .align-self-xl-center { align-self: center !important; } .align-self-xl-baseline { align-self: baseline !important; } .align-self-xl-stretch { align-self: stretch !important; } } .nav { display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none; } .nav-link { display: block; padding: 0.5rem 1rem; } .nav-link:hover, .nav-link:focus { text-decoration: none; } .nav-link.disabled { color: #6c757d; pointer-events: none; cursor: default; } .nav-tabs { border-bottom: 1px solid #232323; } .nav-tabs .nav-link { margin-bottom: -1px; background-color: transparent; border: 1px solid transparent; border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; } .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { isolation: isolate; border-color: #3a3a3a #3a3a3a #232323; } .nav-tabs .nav-link.disabled { color: #6c757d; background-color: transparent; border-color: transparent; } .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: #495057; background-color: #fff; border-color: #232323 #232323 #fff; } .nav-tabs .dropdown-menu { margin-top: -1px; border-top-left-radius: 0; border-top-right-radius: 0; } .nav-pills .nav-link { background: none; border: 0; border-radius: 0.25rem; } .nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #fff; background-color: #0DCAF0; } .nav-fill > .nav-link, .nav-fill .nav-item { flex: 1 1 auto; text-align: center; } .nav-justified > .nav-link, .nav-justified .nav-item { flex-basis: 0; flex-grow: 1; text-align: center; } .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } /*rtl:begin:ignore*/ /*rtl:end:ignore*/ .v-tooltip { display: block !important; z-index: 10000; } .v-tooltip .tooltip-inner { background: black; color: white; border-radius: 16px; padding: 5px 10px 4px; } .v-tooltip .tooltip-arrow { width: 0; height: 0; border-style: solid; position: absolute; margin: 5px; border-color: black; z-index: 1; } .v-tooltip[x-placement^=top] { margin-bottom: 5px; } .v-tooltip[x-placement^=top] .tooltip-arrow { border-width: 5px 5px 0 5px; border-left-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; bottom: -5px; left: calc(50% - 5px); margin-top: 0; margin-bottom: 0; } .v-tooltip[x-placement^=bottom] { margin-top: 5px; } .v-tooltip[x-placement^=bottom] .tooltip-arrow { border-width: 0 5px 5px 5px; border-left-color: transparent !important; border-right-color: transparent !important; border-top-color: transparent !important; top: -5px; left: calc(50% - 5px); margin-top: 0; margin-bottom: 0; } .v-tooltip[x-placement^=right] { margin-left: 5px; } .v-tooltip[x-placement^=right] .tooltip-arrow { border-width: 5px 5px 5px 0; border-left-color: transparent !important; border-top-color: transparent !important; border-bottom-color: transparent !important; left: -5px; top: calc(50% - 5px); margin-left: 0; margin-right: 0; } .v-tooltip[x-placement^=left] { margin-right: 5px; } .v-tooltip[x-placement^=left] .tooltip-arrow { border-width: 5px 0 5px 5px; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; right: -5px; top: calc(50% - 5px); margin-left: 0; margin-right: 0; } .v-tooltip.popover .popover-inner { background: #f9f9f9; color: black; padding: 24px; border-radius: 5px; box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1); } .v-tooltip.popover .popover-arrow { border-color: #f9f9f9; } .v-tooltip[aria-hidden=true] { visibility: hidden; opacity: 0; transition: opacity 0.15s, visibility 0.15s; } .v-tooltip[aria-hidden=false] { visibility: visible; opacity: 1; transition: opacity 0.15s; } :root { --container-gap:20px; --lima: #5ce02e; --cod-gray: #1c1c1c; --dove-gray: #666666; } @media (min-width: 768px) { :root { --container-gap:30px; } } html { font-size: 62.5%; box-sizing: border-box; -ms-overflow-style: scrollbar; } html, body { background: var(--black-400); position: relative; } body { color: var(--gray); font: 300 14px/1.4 "Roboto", sans-serif; -webkit-font-smoothing: antialised; -webkit-overflow-scrolling: touch; } [dir=rtl] body { font-family: "Roboto", "Segoe UI", Tahoma, sans-serif; } h1, h2, h3, h4, h5, h6 { margin: 0; letter-spacing: 0.05em; } h1, .h1 { font-size: calc(1.845rem + 4.4625vw); color: var(--white); line-height: 1.15; font-weight: 900; } @media (min-width: 1200px) { h1, .h1 { font-size: 7.2rem; } } h2, .h2 { font-size: calc(1.765rem + 3.8625vw); color: var(--white); font-weight: 900; } @media (min-width: 1200px) { h2, .h2 { font-size: 6.4rem; } } h3, .h3 { font-size: calc(1.305rem + 0.4125vw); font-weight: 700; } @media (min-width: 1200px) { h3, .h3 { font-size: 1.8rem; } } h4 { font-weight: 700; } h5 { font-weight: 700; } h6 { font-weight: 700; } @media (min-width: 768px) { body { font-size: 16px; } /*h1, .h1 { font-size: 48px; color: var(--white); }*/ /*h2, .h2 { font-size: 36px; color: var(--white); }*/ } @media (min-width: 992px) { body { font-size: 18px; } /*h1, .h1 { font-size: 64px; color: var(--white); }*/ /*h2, .h2 { font-size: 48px; color: var(--white); }*/ /*h3, .h3 { font-size: 24px; }*/ } p { margin: 0 0 2.75em; } a { color: var(--green); text-decoration: underline; } a:hover { text-decoration: none; } a:active, a:hover { outline: 0; } b, strong { font-weight: 700; } i, em { font-style: italic; } img, picture { border: none; display: block; max-width: 100%; } img[data-src], img[data-srcset] { display: block; min-height: 1px; } td, th { padding: 0; text-align: left; vertical-align: top; } hr { border: none; border-top: 1px solid currentColor; box-sizing: content-box; height: 0; margin-bottom: 20px; margin-top: 0; } ol, ul { margin: 0; padding: 0; } button { font-family: inherit; cursor: pointer; } button:focus { outline: none; } big { font-size: 1.3em; } small { font-size: 0.7em; } section { position: relative; } main { border-top: 1px solid transparent; } /* Form elements */ ::-webkit-input-placeholder { color: var(--gray-100); font-weight: inherit; } ::-moz-placeholder { color: var(--gray-100); font-weight: inherit; } :-moz-placeholder { color: var(--gray-100); font-weight: inherit; } :-ms-input-placeholder { color: var(--gray-100); font-weight: inherit; } label { font-size: 16px; line-height: 1.25; display: block; } input, select, textarea { background-color: transparent; border: 1px solid transparent; border-bottom-color: var(--gray-100); color: var(--white); font: 400 20px/1 "Roboto", sans-serif; letter-spacing: 0.05em; padding: 7px; text-overflow: ellipsis; width: 100%; } input:focus, select:focus, textarea:focus { outline: none; border-bottom-color: var(--green); } textarea { resize: none; background: var(--black-200); min-height: 70px; border: 1px solid var(--gray-300); font-size: 16px; line-height: 1.2; } .input-dotted { border-bottom-style: dotted; } .input-box { background: var(--black-200); border: 1px solid var(--gray-300); border-radius: 5px; } .error input, .error select, .error textarea { border-bottom-color: var(--red); color: var(--red); } .success input, .success select, .success textarea { border-bottom-color: var(--green); color: var(--green); } [type=radio], [type=checkbox] { position: absolute; left: -9999px; height: auto; width: auto; } [type=radio]:disabled + label:after, [type=checkbox]:disabled + label:after { visibility: hidden; } .radio, .checkbox { padding: 10px 0; } .radio [type=radio] + label, .checkbox [type=checkbox] + label { position: relative; margin: 0; padding: 2px 0 2px 40px; font-size: 12px; line-height: 16px; color: var(--gray); display: inline-block; vertical-align: top; cursor: pointer; } .radio [type=radio] + label a, .checkbox [type=checkbox] + label a { font-size: inherit; } .radio [type=radio] + label:before, .radio [type=radio] + label:after, .checkbox [type=checkbox] + label:before, .checkbox [type=checkbox] + label:after { content: ""; position: absolute; } .radio [type=radio] + label:before, .checkbox [type=checkbox] + label:before { width: 20px; height: 20px; top: 0; left: 0; border: 1px solid var(--gray-100); } .radio [type=radio] + label:after, .checkbox [type=checkbox] + label:after { opacity: 0; transition: all 0.3s; } .radio [type=radio]:checked + label:after, .checkbox [type=checkbox]:checked + label:after { opacity: 1; } .checkbox [type=checkbox] + label:before, .radio [type=radio] + label:before { border-radius: 100%; } .checkbox [type=checkbox] + label:after, .radio [type=radio] + label:after { background: url("data:image/svg+xml,%3Csvg width='10' height='8' viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.77752 0.791369C9.54873 0.562619 9.17771 0.56262 8.94892 0.791409L3.77474 5.96559L1.05103 3.24188C0.822246 3.01309 0.45123 3.01309 0.222402 3.24188C-0.00642576 3.47067 -0.00642576 3.84168 0.222402 4.07051L3.36041 7.20852C3.47482 7.32293 3.62478 7.38012 3.77471 7.38012C3.92463 7.38012 4.07463 7.32289 4.189 7.20852L9.77752 1.62C10.0063 1.39121 10.0063 1.0202 9.77752 0.791369Z' fill='%235CE02E'/%3E%3C/svg%3E%0A") no-repeat 50% 50%; background-size: 10px 8px; left: 0; top: 0; width: 20px; height: 20px; } .checkbox [type=checkbox]:checked + label:before, .radio [type=radio]:checked + label:before { border-color: var(--green); } /* Inside labels Autofill settings */ :-webkit-autofill, :-webkit-autofill:hover, :-webkit-autofill:focus { -webkit-text-fill-color: var(--white); -webkit-box-shadow: 0 0 0px 1000px var(--black-300) inset; -webkit-transition: background-color 5000s ease-in-out 0s; transition: background-color 5000s ease-in-out 0s; font-size: 20px; border-color: var(--black-300) var(--black-300) var(--gray) var(--black-300); } /* Inside labels Autofill settings */ .label-inside :-webkit-autofill, .label-inside :-webkit-autofill:hover, .label-inside :-webkit-autofill:focus { -webkit-text-fill-color: var(--white); -webkit-box-shadow: 0 0 0px 1000px transparent inset; -webkit-transition: background-color 5000s ease-in-out 0s; transition: background-color 5000s ease-in-out 0s; font-size: 20px; } .label-inside ::-webkit-input-placeholder { color: transparent; } .label-inside ::-moz-placeholder { color: transparent; } .label-inside :-moz-placeholder { color: transparent; } .label-inside :-ms-input-placeholder { color: transparent; } /* Inside labels */ .label-inside .form_label { position: relative; line-height: 20px; } .label-inside .form_label:before { content: "."; color: transparent; pointer-events: none; } .label-inside label { font-size: 20px; line-height: 1; font-weight: 400; letter-spacing: 0.05em; color: var(--white); position: absolute; left: 0; top: 0; transform: translate(5px, 30px); transition: all 0.15s; pointer-events: none; white-space: nowrap; max-width: 100%; text-overflow: ellipsis; overflow: hidden; } .label-inside.success label { color: var(--green); } .label-inside.error label { color: var(--red); } .label-inside.s-focus label { transform: translate(0, 0); font-size: 16px; color: var(--gray); } /* Responsive images */ .image-wrapper { position: relative; padding-bottom: 100%; } .image-wrapper img { position: absolute; left: 50%; transform: translateX(-50%); top: 0; } /* Responsive iframe */ .responsive-iframe { padding-bottom: 56.25%; position: relative; } .responsive-iframe iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } /* Clearfix */ .clr { clear: both; } .cf { display: block; } .cf:after { clear: both; content: "."; display: block; font-size: 0; height: 0; line-height: 0; visibility: hidden; } .app h1:last-child, .app h2:last-child, .app h3:last-child, .app p:last-child, .app ol:last-child, .app ul:last-child, .app table:last-child { margin-bottom: 0; } .container { width: 100%; max-width: 1300px; padding: 0 var(--container-gap); position: relative; } .container-max-md { max-width: 620px; } .container-max-lg { max-width: 830px; } .container-max-xxl { max-width: 1560px; } /*@include media-breakpoint-up(md) { .container { padding: 0 30px; } }*/ @media (min-width: 1440px) { .d-xxl-none { display: none !important; } .d-xxl-block { display: block !important; } } .overflow-hidden { overflow: hidden; } /* Background */ .bg { background-position: 50%; background-repeat: no-repeat; background-size: cover; } .bg-contain { background-position: 50%; background-repeat: no-repeat; background-size: contain; } .bg-contain img { width: 100%; } .bg-cod-gray { background-color: var(--cod-gray) !important; } .bg-black { background-color: var(--black); } .bg-black-100 { background-color: var(--black-100); } .bg-black-200 { background-color: var(--black-200); } .bg-black-300 { background-color: var(--black-300); } .bg-black-400 { background-color: var(--black-400); } .bg-black-500 { background-color: var(--black-500); } .bg-gray-300 { background-color: var(--gray-300); } .bg-green-100 { background-color: rgba(var(--green-rgb), 0.05); } .bg-blue-100 { background-color: var(--blue-100); } .bg-orange-100 { background-color: var(--orange-100); } .gifts-page .bg-dark-gray { background: #1A1A1A !important; } .gifts-page .bg-transparent { background: transparent !important; } .gifts-page .bg-green-hero-btn { background: rgba(54, 192, 6, 0.06) !important; border: 1.5px solid rgba(54, 192, 6, 0.48) !important; } .gifts-page .bg-green-badge { background: #36C006 !important; } .gifts-page .bg-green-deposit-btn { background: rgba(54, 192, 6, 0.06) !important; border: 1.5px solid rgba(54, 192, 6, 0.48) !important; } .gifts-page .bg-black-111 { background: #111111 !important; } .bg-top { background-position: 50% 0; } .bg-cover img { -o-object-fit: cover; object-fit: cover; height: 100%; width: 100%; } .image-cover img { -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .image-contain img { -o-object-fit: contain; object-fit: contain; width: 100%; height: 100%; } .image-fill img { -o-object-fit: fill; object-fit: fill; width: 100%; height: 100%; } .rounded-xs { border-radius: 0.3125rem; } .rounded { border-radius: 1.2rem; } .rounded-x2 { border-radius: 2.4rem; } @media (min-width: 768px) { .rounded-md { border-radius: 1.2rem; } } /* Position */ .tp_orders_mobile_item .close:before, .tp_tab, .tp_mobile > .tp_panel, .tp_popup_order_line.radio label, .tp_orders_container .tp_orders_table_hover .td:first-child:before, .tp_orders_container .tp_orders_table_hover .td:last-child:before, .tp_chart_canvas, .tp, .intro_5:after, .intro_5 .container:before, .intro_5:before, .hero_7:before, .popup .bg-green-popup:before, .popup .bg-red-popup:before, .timer_item:before, .timer_item:after, .cover { position: absolute; inset: 0; } .relative { position: relative; } .l-auto { left: auto; } .b-auto { bottom: auto; } @media (min-width: 768px) { .l-md-auto { left: auto; } .r-md-auto { right: auto; } } /* Fade */ .fade-0 { opacity: 0%; } .fade-15 { opacity: 15%; } .fade-50 { opacity: 50%; } /* Icons */ .icon { display: inline-block; fill: var(--white); height: 20px; transition: fill 0.15s; vertical-align: top; width: 20px; } @media (min-width: 768px) { .icon { height: 30px; width: 30px; } } .icon-white { fill: var(--white); stroke: var(--white); } .icon-green { fill: var(--green); stroke: var(--green); } .icon-red { fill: var(--red); stroke: var(--red); } .icon-gray { fill: var(--gray); stroke: var(--gray); } .icon-gray-100 { fill: var(--gray-100); stroke: var(--gray-100); } .icon-black-100 { fill: var(--black-100); stroke: var(--black-100); } .icon-dark-gray { fill: var(--gray-200); stroke: var(--gray-200); } .icon-no-stroke { stroke: none !important; } .icon-w-90 { height: 96px; width: 96px; flex: 0 0 96px; } .icon-w-60 { height: 60px; width: 60px; flex: 0 0 60px; } .icon-w-50 { height: 50px; width: 50px; flex: 0 0 50px; } .icon-w-40 { height: 40px; width: 40px; flex: 0 0 40px; } .icon-w-30 { height: 30px; width: 30px; flex: 0 0 30px; } .icon-w-25 { height: 25px; width: 25px; flex: 0 0 25px; } .icon-w-20 { height: 20px; width: 20px; flex: 0 0 20px; } .icon-w-16 { height: 16px; width: 16px; flex: 0 0 16px; } .icon-w-14 { height: 14px; width: 14px; flex: 0 0 14px; } .icon-w-10 { height: 10px; width: 10px; flex: 0 0 10px; } .icon-arrow-long { width: 107px; height: 10px; } /***********/ /* Buttons */ /***********/ .btn { align-items: center; border-radius: 5px; border: 1px solid transparent; color: var(--white); cursor: pointer; display: inline-flex; font-size: 18px; font-weight: 700; letter-spacing: 0; line-height: 20px; outline: none; padding: 19px 25px; position: relative; text-align: center; text-decoration: none; text-transform: uppercase; transition: background-color 0.15s, color 0.15s, border-color 0.15s; vertical-align: top; justify-content: center; } .btn:hover { text-decoration: none; } .btn .icon, .btn .icon-border { float: left; } .btn .icon-border { display: inline-block; vertical-align: top; border-right-width: 1px; border-right-style: solid; border-color: inherit; margin-right: 15px; margin-top: -19px; margin-bottom: -19px; height: 58px; } .btn .icon:not([class*=icon-w]) { width: 30px; height: 30px; } .btn .icon-right { float: right; margin-left: 10px; } .btn-primary, .tabulator .tabulator-footer .tabulator-paginator button { background-color: var(--black-300); border-color: rgba(var(--white-rgb), 0.4); } .btn-primary .icon, .tabulator .tabulator-footer .tabulator-paginator button .icon { fill: var(--gray); stroke: var(--white); } .btn-primary:hover, .tabulator .tabulator-footer .tabulator-paginator button:hover { background-color: transparent; border-color: rgba(var(--white-rgb), 1); } .btn-primary:active, .tabulator .tabulator-footer .tabulator-paginator button:active { background-color: transparent; border-color: var(--green); color: var(--green); } .btn-secondary { background-color: rgba(var(--green-rgb), 0.05); border-color: rgba(var(--green-rgb), 0.3); color: var(--green); } .btn-secondary .icon { fill: var(--green); stroke: var(--white); } .btn-secondary:hover { background-color: rgba(var(--green-rgb), 0.1); border-color: var(--green); } .btn-secondary:active { border-color: var(--green); color: var(--green); background-color: transparent; } .btn-red { background: rgba(var(--red-rgb), 0.05); border: 1px solid rgba(var(--red-rgb), 0.3); color: var(--red); } .btn-red .icon { fill: var(--red); } .btn-red:hover { background: rgba(var(--red-rgb), 0.1); border-color: var(--red); } .btn-red:active { border-color: var(--red); color: var(--red); background-color: transparent; } .btn-black { background: var(--black-100); color: var(--white); } .btn-black .icon { fill: var(--white); stroke: var(--white); } .btn-black:hover { background: var(--black-500); color: var(--white); } .btn-black:active { background: var(--black-500); color: var(--gray); } .btn-gray { background: var(--gray-300); border: 1px solid var(--gray-300); color: var(--gray); border-radius: 12px; } .btn-gray .icon { fill: var(--white); } .btn-gray:hover { background: var(--black-100); border-color: var(--black-100); color: var(--gray); } .btn-gray:active { background: var(--black-200); border-color: var(--black-200); color: var(--gray); } .btn-dark { background: var(--black-500); border-color: var(--black-500); color: var(--white); } .btn-dark:hover { background: var(--black-100); border-color: var(--black-100); color: var(--white); } .btn-dark:active { background: var(--black-100); border-color: var(--black-100); color: var(--gray); } .btn-secondary-round { border: 1px solid var(--green); border-radius: 30px; background: rgba(var(--green-rgb), 0.07); padding-top: 14px; padding-bottom: 14px; } .btn-secondary-round:hover { background: rgba(var(--green-rgb), 0.15); } .btn-red-round { border: 1px solid var(--red); border-radius: 30px; background: rgba(var(--red-rgb), 0.07); padding-top: 14px; padding-bottom: 14px; } .btn-red-round:hover { background: rgba(var(--red-rgb), 0.15); } .btn-primary-round { border: 1px solid var(--gray-200); border-radius: 30px; background: rgba(var(--black-200-rgb), 1); padding-top: 14px; padding-bottom: 14px; /*&:hover { background: rgba(var(--black-200-rgb), 0.15); }*/ } .btn-primary-round:hover { background-color: transparent; border-color: rgba(var(--white-rgb), 1); } .btn-primary-round:active { background-color: transparent; border-color: var(--green); color: var(--green); } .btn-link { color: var(--green); text-transform: none; } .btn-link .icon { width: 16px; height: 16px; } .btn-link strong { border-bottom: 1px dashed currentColor; } .btn-link-primary { background-color: var(--black-300); border-color: transparent; font-size: 14px; text-transform: none; font-weight: normal; color: var(--green); padding-top: 17px; padding-bottom: 17px; line-height: 24px; } .btn-link-primary .icon { fill: var(--white); stroke: var(--white); } .btn-link-primary:hover { background-color: transparent; border-color: rgba(var(--white-rgb), 1); } .btn-link-primary:active { background-color: transparent; border-color: var(--green); color: var(--green); } .btn-link-secondary { font-size: 1.6rem; text-decoration: underline; text-decoration-style: dashed; text-decoration-thickness: 1px; font-weight: 400; text-transform: none; text-underline-offset: 0.5em; } .btn-disabled, .btn:disabled { pointer-events: none; opacity: 0.65; } .btn-progress { background-color: transparent; border-color: rgba(var(--green-rgb), 0.5); } .btn-progress .progress { background: rgba(var(--green-rgb), 0.5); border-radius: 3px; bottom: 0; left: 0; opacity: 0; position: absolute; top: 0; transform: none; transition: all 0.25s; transition: all 0.2s; } .btn-progress .progress[style] { opacity: 1; } .btn-progress span:last-child { position: relative; } .btn-xs { font-size: 12px; padding-top: 9px; padding-bottom: 9px; } .btn-md { font-size: 14px; padding-top: 14px; padding-bottom: 14px; } .btn-md .icon-border { margin-top: -14px; margin-bottom: -14px; height: 48px; } .btn-icon { padding: 0; } .btn-icon-md .icon { width: 48px; height: 48px; } .btn-icon-xl .icon { width: 58px; height: 58px; } @media (min-width: 768px) { .btn-md-default { font-size: 18px; padding-top: 19px; padding-bottom: 19px; } } @media (min-width: 992px) { .btn-lg-default { font-size: 18px; padding-top: 19px; padding-bottom: 19px; } } @media (min-width: 1200px) { .btn-xl-default { font-size: 18px; padding-top: 19px; padding-bottom: 19px; } } .btn-reset, .flickity_carousel .flickity-prev-next-button, .tns-controls button, .tns-nav button, .btn-link { padding: 0; border: none; box-shadow: none; background: transparent; } .btn-back { height: 60px; margin-right: auto; min-width: 34px; position: relative; text-decoration: none; width: 30px; width: auto; } .btn-back .icon { height: 16px; margin-left: 9px; stroke-width: 3px; stroke: var(--gray-100); transform: rotate(90deg); width: 16px; } .btn-back:before { background: rgba(var(--white-rgb), 0.1); border-radius: 10px; content: ""; height: 60px; left: 0; position: absolute; top: 50%; transform: translateY(-50%); width: 34px; } .btn-back:hover .icon { stroke: var(--white); } .btn-share { border-radius: 50%; position: relative; /* Подтверждение, что ссылка ушла в буфер: показывается там, где системного окна «поделиться» нет, то есть на десктопе. Текст приходит из шаблона уже переведённым. */ } .btn-share:hover { background-color: var(--black-100); } .btn-share.is-copied:after { content: attr(data-share-copied); position: absolute; right: 0; bottom: 100%; z-index: 3; padding: 6px 10px; border-radius: 4px; white-space: nowrap; font-size: 12px; background: var(--black-300); color: var(--white); } .btn-favorites { border-radius: 100%; width: 40px; height: 40px; background: var(--black-200); } .btn-favorites .icon { width: 16px; height: 16px; fill: none; stroke: var(--gray-100); } .btn-favorites.active .icon { fill: var(--red); stroke: var(--red); } /* Badge */ .badge { background-color: var(--black-100); border-radius: 50px; border: 1px solid transparent; color: var(--gray-100); font-size: 12px; font-weight: 400; line-height: 1.4; overflow: hidden; padding: 5px 10px; position: relative; text-align: center; text-decoration: none; text-transform: uppercase; white-space: nowrap; text-overflow: ellipsis; } .badge-square { border-radius: 5px; } .badge-bold { font-weight: 900; } .badge-white { border-color: transparent; background: var(--white); color: var(--black-400); } .badge-success { border-color: transparent; background-color: var(--green); color: var(--black); } .badge-error { border-color: transparent; background-color: var(--red); color: var(--black); } .badge-warning { border-color: transparent; background-color: var(--yellow); color: var(--black); } .badge-red { border-color: transparent; background: rgba(var(--red-rgb), 0.1); color: #e8446e; } .badge-info { border-color: transparent; background: rgba(var(--blue), 0.1); color: var(--blue); } .badge-process { border-color: transparent; color: var(--gray-100); background: var(--gray-300); } .badge-process:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 50%; border-radius: 5px; background: rgba(102, 102, 102, 0.1); } .badge-link { color: var(--white); } .badge-outline.badge-success { border-color: rgba(var(--green-rgb), 0.6); color: rgba(var(--green-rgb), 0.6); background: transparent; } .badge-outline.badge-error { border-color: rgba(var(--red-rgb), 0.8); color: rgba(var(--red-rgb), 0.8); background: transparent; } .badge-outline.badge-warning { border-color: rgba(var(--yellow-rgb), 0.8); color: rgba(var(--yellow-rgb), 0.8); background: transparent; } .badge-outline.badge-info { border-color: rgba(var(--blue-rgb), 0.8); color: rgba(var(--blue-rgb), 0.8); background: transparent; } .badge-outline.badge-secondary { border-color: rgba(var(--white-rgb), 0.5); color: var(--e2); background: transparent; } .badge .icon { width: 20px; height: 20px; margin: -2px 0 -2px 20px; fill: var(--gray); } button.badge:hover, a.badge:hover { border-color: var(--white); color: var(--white); background-color: transparent; } button.badge:hover .icon, a.badge:hover .icon { fill: var(--white); } @media (min-width: 768px) { .badge-lg { padding: 11px 15px; font-size: 14px; } } /* Alignment */ .flex-center, .trigger_icon { display: flex; align-items: center; justify-content: center; } /* Text */ .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } @media (min-width: 768px) { .text-md-left { text-align: left; } .text-md-right { text-align: right; } } @media (min-width: 992px) { .text-lg-left { text-align: left; } .text-lg-right { text-align: right; } } @media (min-width: 1200px) { .text-xl-left { text-align: left; } .text-xl-right { text-align: right; } } .text-nowrap { white-space: nowrap; } .text-ellipsis { white-space: nowrap; max-width: 100%; text-overflow: ellipsis; overflow: hidden; } .text-uppercase { text-transform: uppercase; } .text-normal { text-transform: none; } /* Font weight */ .fw-100 { font-weight: 100; } .fw-300 { font-weight: 300; } .fw-400 { font-weight: 400; } .fw-500 { font-weight: 500; } .fw-700 { font-weight: 700; } .fw-900 { font-weight: 900; } /* Width/height */ .h-20 { height: 20px; } .h-30 { height: 30px; } .h-100 { height: 100%; } .w-100 { width: 100%; } .w-50 { width: 50%; } .gifts-page .w-24 { width: 24px !important; } .gifts-page .h-24 { height: 24px !important; } .gifts-page .w-32 { width: 32px !important; } .gifts-page .h-32 { height: 32px !important; } .gifts-page .w-64 { width: 64px !important; } .gifts-page .h-64 { height: 64px !important; } .gifts-page .w-96 { width: 96px !important; } .gifts-page .h-96 { height: 96px !important; } .gifts-page .w-auto { width: auto !important; } .gifts-page .h-auto { height: auto !important; } .gifts-page .w-fit { width: -moz-fit-content !important; width: fit-content !important; } .mw-1200 { max-width: 1200px; } .gifts-page .max-w-1146 { max-width: 1146px !important; } .gifts-page .max-w-80 { max-width: 80% !important; } .gifts-page .max-h-80 { max-height: 80% !important; } .mw-100 { max-width: 100%; } .mw-160 { min-width: 160px; } .mw-0 { min-width: 0; } .mh-100 { min-height: 100vh; } @media (min-width: 768px) { .w-md-50 { width: 50%; } } /* Gap */ .gx-5 { -moz-column-gap: 5px; column-gap: 5px; } .gx-10 { -moz-column-gap: 10px; column-gap: 10px; } .gy-5 { row-gap: 5px; } .gy-10 { row-gap: 10px; } .gifts-page .gap-10 { gap: 10px !important; } .gifts-page .gap-12 { gap: 12px !important; } .gifts-page .gap-24 { gap: 24px !important; } .gifts-page .gap-32 { gap: 32px !important; } .gifts-page .gap-48 { gap: 48px !important; } .gifts-page .gap-64 { gap: 64px !important; } .gifts-page .gap-96 { gap: 96px !important; } /* Font size */ .f-10 { font-size: 1rem; } .f-11 { font-size: 1.1rem; } .f-12 { font-size: 1.2rem; } .f-13 { font-size: 1.3rem; } .f-14 { font-size: 1.4rem; } .f-16 { font-size: 1.6rem; } .f-18 { font-size: calc(1.305rem + 0.4125vw); } @media (min-width: 1200px) { .f-18 { font-size: 1.8rem; } } .f-20 { font-size: 2rem; } .f-24 { font-size: calc(1.365rem + 0.8625vw); } @media (min-width: 1200px) { .f-24 { font-size: 2.4rem; } } .f-26 { font-size: calc(1.385rem + 1.0125vw); } @media (min-width: 1200px) { .f-26 { font-size: 2.6rem; } } .f-28 { font-size: calc(1.405rem + 1.1625vw); } @media (min-width: 1200px) { .f-28 { font-size: 2.8rem; } } .f-32 { font-size: calc(1.445rem + 1.4625vw); } @media (min-width: 1200px) { .f-32 { font-size: 3.2rem; } } .f-36 { font-size: calc(1.485rem + 1.7625vw); } @media (min-width: 1200px) { .f-36 { font-size: 3.6rem; } } .f-40 { font-size: calc(1.605rem + 2.6625vw); } @media (min-width: 1200px) { .f-40 { font-size: 4.8rem; } } .f-48 { font-size: calc(1.605rem + 2.6625vw); } @media (min-width: 1200px) { .f-48 { font-size: 4.8rem; } } .f-64 { font-size: calc(1.765rem + 3.8625vw); } @media (min-width: 1200px) { .f-64 { font-size: 6.4rem; } } .f-72 { font-size: calc(1.845rem + 4.4625vw); } @media (min-width: 1200px) { .f-72 { font-size: 7.2rem; } } .f-96 { font-size: calc(2.085rem + 6.2625vw); } @media (min-width: 1200px) { .f-96 { font-size: 9.6rem; } } .f-128 { font-size: calc(2.405rem + 8.6625vw); } @media (min-width: 1200px) { .f-128 { font-size: 12.8rem; } } /* Border */ .border-green { border-color: rgba(var(--green-rgb), 0.2); } .border-red { border-color: rgba(var(--red-rgb), 0.3); } .border-gray { border-color: var(--gray-100); } .border-black-100 { border-color: var(--black-100); } .border-dark-gray { border-color: var(--gray-200); } .border-strong-gray { border-color: var(--black-200); } .border-cyan { border-color: #00B67A; } .border { border-width: 1px; border-style: solid; } .border-dashed { --bg-size: 8px; --bg-color: var(--black-400); background-image: linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%); background-repeat: repeat-x, repeat-x, repeat-y, repeat-y; background-position: 19% top, 19% bottom, left 9%, right 9%; background-size: 50px var(--bg-size), 50px var(--bg-size), var(--bg-size) 50px, var(--bg-size) 50px; } /* Border-radius */ .br-5 { border-radius: 5px; } .br-10 { border-radius: 10px; } .br-20 { border-radius: 20px; } .br-24 { border-radius: 24px; } .br-30 { border-radius: 30px; } .gifts-page .br-6 { border-radius: 6px !important; } .gifts-page .br-8 { border-radius: 8px !important; } .gifts-page .br-12 { border-radius: 12px !important; } .round { border-radius: 50%; } /* Color */ .color-cod-gray { color: var(--cod-gray) !important; } /* Color */ .color-lima { color: var(--lima) !important; } /* Color */ .color-green { color: var(--green) !important; } .color-light-green { color: var(--light-green) !important; } .color-red { color: var(--red) !important; } .color-white { color: var(--white); } .color-white-064 { color: rgba(255, 255, 255, 0.64); } .color-light-gray { color: var(--gray); } .color-gray { color: var(--gray-100); } .color-dark-gray { color: var(--gray-200); } .color-yellow { color: var(--yellow) !important; } .color-yellow-light { color: var(--yellow) !important; } .color-blue { color: var(--blue) !important; } .color-blue-100 { color: var(--blue-100) !important; } .color-orange { color: var(--orange) !important; } .color-orange-100 { color: var(--orange-100) !important; } .color-black { color: var(--black) !important; } .gifts-page .color-white-e2 { color: #E2E2E2 !important; } .gifts-page .color-green-36c006 { color: #36C006 !important; } .gifts-page .color-gray-9d { color: #9D9D9D !important; } .gifts-page .color-black-0e { color: #0E0E0E !important; } /* Search */ .search { position: relative; } .search input { height: 44px; border: 1px solid var(--gray-300); color: var(--gray-100); letter-spacing: 0.05em; border-radius: 21px; padding: 11px 10px 11px 55px; width: 100%; background: transparent; } .search input:hover { border-color: var(--gray-100); } .search input:focus { border-color: var(--white); } .search button { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; border: none; box-shadow: none; cursor: pointer; width: 44px; height: 44px; padding: 0; position: absolute; left: 0; top: 0; } .search button .icon { fill: var(--gray-100); width: 20px; height: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .__panel { -ms-overflow-style: none; scrollbar-width: none; margin-right: 0 !important; } .__panel::-webkit-scrollbar { display: none; } /* Selectbox */ .selectbox { position: relative; } .selectbox select { height: 40px; background: transparent; color: var(--white); font-size: 20px; line-height: 1; padding: 6px 0; outline: none; border-color: transparent; letter-spacing: 0.04em; } .selectbox label { font-size: 16px; color: var(--gray); line-height: 1.25; display: block; position: relative; z-index: 10; } .select2-container { vertical-align: top; } .select2-container { position: relative; } .select2.select2-container:before, .select2-container .select2-dropdown:before { content: ""; position: absolute; left: -20px; right: -20px; top: -40px; bottom: 0; background: var(--black-200); opacity: 0; } .select2.select2-container:before { bottom: -12px; } .select2-container .select2-dropdown:before { top: 0; bottom: 0; } .select2-container .selection { position: relative; } .select2-container, .select2-container * { outline: none; } .select2-container .select2-selection--single { background: transparent; border-color: transparent; border-bottom: 1px solid var(--gray-100); border-radius: 0; height: auto; position: relative; } .select2-container .select2-selection--single .select2-selection__rendered { color: var(--white); font-size: 20px; line-height: 20px; font-weight: 400; padding: 7px 20px 8px 7px; outline: none; background: transparent; border: none; cursor: pointer; } .select2-container .select2-selection--single .select2-selection__rendered:before { content: "."; width: 1px; overflow: hidden; display: inline-block; margin-left: -1px; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--white); } .select2-container .select2-selection--single .select2-selection__arrow { width: 19px; height: 20px; right: 0; top: 10px; pointer-events: none; position: absolute; } .select2-container .select2-selection--single .select2-selection__arrow b { display: none; } .select2-container .select2-selection--single .select2-selection__arrow:before, .select2-container .select2-selection--single .select2-selection__arrow:after { background: var(--gray-100); content: ""; height: 3px; position: absolute; top: 8px; transition: all 0.3s; width: 12px; } .select2-container .select2-selection--single .select2-selection__arrow:before { left: 0; transform: rotate(45deg); } .select2-container .select2-selection--single .select2-selection__arrow:after { right: 0; transform: rotate(-45deg); } .select2-container.select2-container--open .select2-selection--single .select2-selection__arrow:before { transform: rotate(-45deg); } .select2-container.select2-container--open .select2-selection--single .select2-selection__arrow:after { transform: rotate(45deg); } .select2-container--default .select2-results__option--selected { background-color: transparent; } .select2-container .select2-dropdown { background: var(--black-200); border-radius: 5px; border: none; } .select2-container .select2-results { position: relative; padding: 15px 0; } .select2-container .select2-results__option { padding: 5px 6px; margin-bottom: 0; } .select2-container .select2-results__option[aria-selected] { font-weight: 400; color: var(--gray-100); font-size: 16px; line-height: 1.2; } .select2-container .select2-results__option[aria-selected=true], .select2-container .select2-results__option--highlighted[aria-selected] { background: transparent; } .select2-container .select2-results__option[aria-selected=true], .select2-container .select2-results__option--highlighted[aria-selected] { color: var(--white); } .select2-results ul::-webkit-scrollbar { background-color: var(--black-200); width: 7px; } .select2-results ul::-webkit-scrollbar-thumb { background-color: var(--gray-200); border-radius: 2em; } .select2-container.select2-container--open .select2-selection--multiple, .select2-container.select2-container--open .select2-selection--single { border-bottom-color: var(--green); } .select2-container.select2-container--open:before, .select2-container.select2-container--open .select2-dropdown:before { opacity: 1; } .select2-container.select2-container--open.select2-container--below:before { border-radius: 5px 5px 0 0; } .select2-container.select2-container--open .select2-dropdown--below:before { border-radius: 0 0 5px 5px; } .select2-container.select2-container--open.select2-container--above:before { bottom: -15px; border-radius: 0 0 5px 5px; } .select2-container.select2-container--open .select2-dropdown--above:before { border-radius: 5px 5px 0 0; } .select2-container--default.select2-container--disabled .select2-selection--single { background: transparent; opacity: 0.5; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered { opacity: 0.5; cursor: default; } .select2-container--default .select2-search--dropdown { position: absolute; left: 0; right: 0; padding: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border-color: transparent; background-color: var(--black-200); font-size: 16px; letter-spacing: 0; } .select2-dropdown--below .select2-search--dropdown { bottom: 100%; margin-bottom: 1px; } .select2-dropdown--above .select2-search--dropdown { top: 100%; margin-top: -1px; } /*rtl:begin:ignore*/ .select2-container--open .select2-dropdown { position: relative; left: 0; right: auto; } .select2-container--default[dir=rtl] .select2-selection--single .select2-selection__arrow { right: auto; left: 0; } .select2-container[dir=rtl] .select2-selection--single .select2-selection__rendered { padding-left: 20px; padding-right: 5px; } /*rtl:end:ignore*/ @media (min-width: 768px) { .select2.select2-container:before, .select2-container .select2-dropdown:before { left: -15px; right: -15px; top: -35px; } .select2-container .select2-dropdown:before { top: 0; bottom: 0; } .select2.select2-container--lg:before { left: -20px; right: -20px; top: -40px; bottom: -20px; } .select2-container--lg .select2-dropdown:before { left: -20px; right: -20px; } } @media (min-width: 992px) { .select2.select2-container--lg:before { left: -50px; right: -50px; top: -60px; bottom: -20px; } .select2-container--lg .select2-dropdown:before { left: -50px; right: -50px; bottom: -30px; } } @media (min-width: 1440px) { .select2-container .select2-selection--single .select2-selection__rendered { font-size: 20px; } .select2-container .select2-results__option[aria-selected] { font-size: 20px; } } /* Vue selectbox */ .v-select { margin-left: -20px; margin-right: -20px; } .v-select:before { content: ""; position: absolute; left: 0; right: 0; top: -40px; background: var(--black-200); border-radius: 5px 5px 0 0; bottom: 0; opacity: 0; visibility: hidden; } .v-select .vs__dropdown-toggle { background: inherit; border: none; border-radius: 0; padding: 4px 20px; position: relative; } .v-select .vs__dropdown-toggle:after { content: ""; position: absolute; bottom: 0; left: 20px; right: 20px; border-bottom: 1px solid var(--gray-100); } .v-select .vs__selected { color: var(--white); font-size: 16px; line-height: 20px; font-weight: 400; border: none; margin: 0 5px 0 0; padding: 3px 10px; align-self: center; white-space: nowrap; overflow: hidden; max-width: 90%; text-overflow: ellipsis; display: block; background-color: var(--black-100); } .v-select .vs__deselect { fill: var(--gray-100); } .v-select .vs__deselect:hover { fill: var(--white); } .v-select .vs__selected-options { padding: 0; max-width: calc(100% - 25px); } .v-select .vs__open-indicator { fill: var(--gray-100); } .v-select .vs__search, .v-select .vs__search:focus { margin: 0; border: none; margin: 0; line-height: 30px; font-size: 20px; } .v-select .vs__actions { padding-right: 5px; } .v-select.vs--single .vs__selected { font-size: 20px; padding: 0 5px; margin: 0 1px; background-color: transparent; } .v-select.vs--open:before { opacity: 1; visibility: visible; } .v-select.vs--open .vs__dropdown-toggle { border-bottom-color: var(--green); } .v-select.vs--open .vs__selected { top: 5px; } .v-select.vs--open .vs__dropdown-toggle:after { border-color: var(--green); } ul.vs__dropdown-menu { padding: 15px 5px; background: var(--black-200); border: none; border-radius: 0 0 5px 5px; } ul.vs__dropdown-menu .vs__dropdown-option { font-size: 16px; line-height: 1.2; padding: 5px 21px; color: var(--gray-100); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; } ul.vs__dropdown-menu .vs__dropdown-option:hover, ul.vs__dropdown-menu .vs__dropdown-option--highlight { background: transparent; color: var(--white); } @media (min-width: 768px) { .v-select { margin-left: -15px; margin-right: -15px; } .v-select:before { top: -35px; } .v-select .vs__dropdown-toggle:after { left: 15px; right: 15px; } .v-select .vs__dropdown-toggle { padding-left: 15px; padding-right: 15px; } ul.vs__dropdown-menu { padding-left: 0; padding-right: 0; } .selectbox-lg .v-select { margin-left: -20px; margin-right: -20px; } .selectbox-lg .v-select .vs__dropdown-toggle { padding-left: 20px; padding-right: 20px; } .selectbox-lg .v-select .vs__dropdown-toggle:after { left: 20px; right: 20px; } .selectbox-lg .v-select:before { top: -40px; bottom: -20px; } .selectbox-lg .v-select .vs__dropdown-menu { margin-top: 1px; } } @media (min-width: 992px) { .selectbox-lg .v-select:before { top: -60px; bottom: -20px; } .selectbox-lg .v-select { margin-left: -50px; margin-right: -50px; } .selectbox-lg .v-select .vs__dropdown-toggle { padding-left: 50px; padding-right: 50px; } .selectbox-lg .v-select .vs__dropdown-toggle:after { left: 50px; right: 50px; } .selectbox-lg .v-select .vs__dropdown-menu { padding-left: 31px; padding-right: 31px; padding-bottom: 30px; } } @media (min-width: 1440px) { ul.vs__dropdown-menu .vs__dropdown-option { font-size: 20px; } } /* Vue multiselect */ .multiselect { font-weight: 400; } .multiselect:before { content: ""; position: absolute; left: -14px; right: -14px; bottom: 0; top: -35px; background: var(--black-200); border-radius: 5px 5px 0 0; visibility: hidden; } .multiselect .multiselect__tags { background: transparent; padding: 7px 20px 0 0; border-color: transparent transparent var(--gray) transparent; border-radius: 0; position: relative; } .multiselect .multiselect__input, .multiselect .multiselect__single, .multiselect .multiselect__placeholder { background: transparent; border-radius: 0; font-size: 20px; line-height: 1; color: var(--white); } .multiselect .multiselect__placeholder { padding-top: 0; padding-left: 5px; } .multiselect .multiselect__input { height: 20px; letter-spacing: 0.045em; } .multiselect .multiselect__input::-webkit-input-placeholder { color: var(--gray); font-weight: inherit; } .multiselect .multiselect__input::-moz-placeholder { color: var(--gray); font-weight: inherit; } .multiselect .multiselect__input:-moz-placeholder { color: var(--gray); font-weight: inherit; } .multiselect .multiselect__input:-ms-input-placeholder { color: var(--gray); font-weight: inherit; } .multiselect .multiselect__select:before, .multiselect .multiselect__select:after { background: var(--gray-100); content: ""; height: 3px; position: absolute; top: 18px; transition: all 0.3s; width: 12px; border: none; margin: 0; } .multiselect .multiselect__select:before { left: 20px; right: auto; transform: rotate(45deg); } .multiselect .multiselect__select:after { right: 0; transform: rotate(-45deg); } .multiselect.multiselect--active { z-index: unset; } .multiselect.multiselect--active:before { visibility: visible; } .multiselect.multiselect--active .multiselect__select { transform: none; } .multiselect.multiselect--active .multiselect__select:before { transform: rotate(-45deg); } .multiselect.multiselect--active .multiselect__select:after { transform: rotate(45deg); } .multiselect.multiselect--active .multiselect__tags { border-bottom-color: var(--green); } .multiselect .multiselect__content-wrapper { border-radius: 0; background: transparent; border-color: transparent; overflow: visible; max-height: 300px; z-index: 20; } .multiselect .multiselect__content-wrapper:before { content: ""; position: absolute; left: -15px; right: -15px; top: 0; bottom: 0; border-radius: 0 0 5px 5px; background: var(--black-200); } .multiselect .multiselect__content-wrapper ul { max-height: inherit; overflow: auto; padding: 15px 0; } .multiselect .multiselect__option { font-size: 16px; line-height: 1.2; color: var(--gray-100); padding: 5px; min-height: 0; } .multiselect .multiselect__option--selected, .multiselect .multiselect__option--selected.multiselect__option--highlight, .multiselect .multiselect__option--highlight { background: transparent; color: var(--white); } /* Vue slider */ .vue-slider .vue-slider-rail { height: 5px; background: transparent; } .vue-slider .vue-slider-rail:before { content: ""; position: absolute; left: 0; right: 0; top: 2px; height: 1px; background: var(--gray-200); } .vue-slider .vue-slider-process { background: var(--green); } .vue-slider .vue-slider-dot { background: var(--green); border-radius: 8px; } .vue-slider .vue-slider-dot-handle { background: transparent; width: 1px; box-shadow: none; height: 7px; background: #437E2E; margin: 4px auto; position: relative; } .vue-slider .vue-slider-dot-handle:before, .vue-slider .vue-slider-dot-handle:after { content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: inherit; } .vue-slider .vue-slider-dot-handle:before { right: 3px; } .vue-slider .vue-slider-dot-handle:after { left: 3px; } .vue-slider .vue-slider-dot-tooltip-inner { border-color: var(--green); background-color: var(--green); } .vue-slider .vue-slider-dot-tooltip-inner-top::after { top: 95%; } /* Chevron */ .chevron { width: 20px; height: 20px; right: 0; top: 10px; pointer-events: none; position: absolute; } .chevron:before, .chevron:after { background: var(--gray-100); content: ""; height: 3px; position: absolute; top: 8px; transition: all 0.3s; width: 12px; } .chevron:before { left: 0; transform: rotate(45deg); } .chevron:after { right: 0; transform: rotate(-45deg); } .pointer { cursor: pointer; } /* Inputbox */ .inputbox_field_input, .inputbox input { color: var(--white); font-size: 1.8rem; line-height: 20px; font-weight: 400; padding: 10px 20px 9px 5px; outline: 0; background: 0 0; border: none; border-bottom: 1px solid var(--gray-100); cursor: pointer; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .inputbox label { font-size: 16px; color: var(--gray); line-height: 1.25; display: block; position: relative; z-index: 10; } .inputbox_field { position: relative; } .inputbox_field_mask { position: absolute; inset: 0; opacity: 0; } /* Inputbox: datepicker */ .inputbox_datepicker { position: relative; cursor: pointer; } .inputbox_datepicker:before { content: ""; position: absolute; left: -20px; right: -20px; top: -15px; bottom: -10px; background: var(--black-200); opacity: 0; border-radius: 5px 5px 0 0; } .inputbox-datepicker-open { z-index: 30; } .inputbox-datepicker-open, .inputbox-datepicker-open label, .inputbox-datepicker-open input, .inputbox-datepicker-open .inputbox_field_input, .inputbox-datepicker-open .inputbox_field, .inputbox-datepicker-open .inputbox_label { pointer-events: none !important; } .inputbox-datepicker-open:before { opacity: 1; } .inputbox-datepicker-open .inputbox_field_input, .inputbox-datepicker-open input { border-bottom-color: var(--green); } .inputbox-datepicker-open .chevron:before { transform: rotate(-45deg); } .inputbox-datepicker-open .chevron:after { transform: rotate(45deg); } @media (min-width: 768px) { .inputbox_datepicker:before { left: -15px; right: -15px; top: -15px; bottom: -14px; } } /* Inputbox: link */ .inputbox_link .inputbox_field_input, .inputbox_link input { font-size: 1.8rem; } .inputbox_link .icon { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; } @media (min-width: 1200px) { .inputbox_link { padding-bottom: 40px; } } /***************/ /* Dropdownbox */ /***************/ .dropdownbox { position: relative; font-size: 12px; line-height: 16px; font-weight: 400; display: inline-block; vertical-align: top; border: 1px solid var(--gray-300); border-radius: 5px; cursor: pointer; display: inline-block; vertical-align: top; } .dropdownbox:hover { border-color: var(--gray-100); } .dropdownbox .chevron { right: 5px; top: 7px; } .dropdownbox_label { padding: 8px 35px 8px 15px; white-space: nowrap; max-width: 140px; overflow: hidden; text-overflow: ellipsis; } .dropdownbox_list { position: absolute; left: -1px; right: -1px; top: 100%; background: var(--black-200); border-radius: 0 0 5px 5px; opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.15s ease-in-out; z-index: 50; } .dropdownbox_list ul { padding: 10px 0 20px; } .dropdownbox_list ul li { display: block; } .dropdownbox_list ul a { padding: 5px 18px; display: block; color: var(--gray-100); letter-spacing: 0.05em; text-decoration: none; } .dropdownbox_list ul a:hover { color: var(--white); } .dropdownbox-open, .dropdownbox-open:hover { background: var(--black-200); border-color: var(--black-200); } .dropdownbox-open .dropdownbox_list { opacity: 1; visibility: visible; transform: translateY(0); } .dropdownbox-open .chevron:before { transform: rotate(-45deg); } .dropdownbox-open .chevron:after { transform: rotate(45deg); } @media (min-width: 1200px) { .dropdownbox { font-size: 14px; } .dropdownbox_label { max-width: 170px; padding: 12px 45px 12px 18px; } .dropdownbox .chevron { right: 13px; top: 10px; } } /* Input spinner */ .input-spinner-trigger { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: var(--black-200); border-radius: 100%; border: 1px solid var(--gray-300); box-shadow: none; cursor: pointer; height: 50px; min-width: 50px; outline: none; padding: 0; position: relative; width: 50px; } .input-spinner-trigger .icon { width: 16px; height: 16px; fill: var(--gray-100); } .input-spinner-trigger:hover { background: var(--gray-200); } .input-spinner-trigger:hover .icon { fill: var(--gray); } .input-spinner-field { max-width: 240px; padding: 0 20px; position: relative; } .input-spinner-field input { border-radius: 30px; border: 1px solid var(--gray-300); font-size: 24px; font-weight: 100; line-height: 30px; padding-bottom: 14px; padding-top: 14px; text-align: center; } .input-spinner-field input:focus { border-color: var(--gray-300); } .input-spinner-description { color: var(--gray-100); font-size: 12px; left: 0; letter-spacing: 0; padding-top: 10px; position: absolute; right: 0; text-align: center; top: 100%; } .input-spinner-side-tipe .input-spinner-field { max-width: 200px; } .input-spinner-side-tipe .input-spinner-field input { padding-top: 4px; padding-bottom: 4px; font-size: 18px; font-weight: 400; } .input-spinner-side-tipe .input-spinner-trigger:first-child { border-radius: 50px 0 0 50px; order: 1; margin-left: auto; border-right: none; margin-left: 10px; } .input-spinner-side-tipe .input-spinner-trigger:last-child { border-radius: 0 50px 50px 0; order: 2; } /* Input switcher */ .input-switcher { position: relative; } .input-switcher [type=checkbox] + label { display: block; padding: 0; font-size: 16px; font-weight: 400; line-height: 20px; } .input-switcher [type=checkbox] + label:before, .input-switcher [type=checkbox] + label:after { border: none; top: 50%; left: auto; transform: translateY(-50%); transition: all 0.25s; } .input-switcher [type=checkbox] + label:before { background: var(--gray-300); height: 30px; width: 60px; border-radius: 30px; right: 0; } .input-switcher [type=checkbox] + label:after { background: var(--black-300); height: 20px; width: 20px; border-radius: 100%; right: 35px; opacity: 1; } .input-switcher [type=checkbox]:checked + label:after { right: 5px; } .input-switcher-left [type=checkbox] + label { padding-left: 70px; } .input-switcher-left [type=checkbox] + label:before, .input-switcher-left [type=checkbox] + label:after { left: 0; right: auto; } .input-switcher-left [type=checkbox] + label:after { left: 5px; } .input-switcher-left [type=checkbox]:checked + label:after { left: 35px; } .input-switcher.green [type=checkbox] + label:after { background-color: var(--green); } .input-switcher.green [type=checkbox]:checked + label:before { background-color: var(--green); } .input-switcher.green [type=checkbox]:checked + label:after { background-color: var(--black-300); } .input-switcher.red [type=checkbox] + label:after { background-color: var(--red); } .input-switcher.red [type=checkbox]:checked + label:before { background-color: var(--red); } .input-switcher.red [type=checkbox]:checked + label:after { background-color: var(--black-300); } .input-switcher.disabled [type=checkbox] + label:before { background-color: #FFF; opacity: 0.12; } .input-switcher.disabled [type=checkbox] + label:after { background-color: #FFF; opacity: 0.48; } /* Dots */ .dot { width: 6px; height: 6px; border-radius: 100%; background: var(--gray-300); margin-left: 4px; } .dot.green { background: var(--green); } .dot.red { background: var(--red); } .dot.white { background: var(--white); } /* Snackbar */ .snackbar { left: 0; pointer-events: none; position: fixed; right: 0; top: 0; z-index: 1000; } .snackbar_item { background-color: rgba(var(--gray-200-rgb), 0.9); border-radius: 10px; font-size: 12px; margin: 0 auto; max-width: 415px; pointer-events: all; position: relative; } .snackbar_item h5 { font-size: 14px; text-transform: uppercase; } .snackbar_item + .snackbar_item { margin-top: 3px; } .snackbar_item.success { background-color: rgba(var(--dark-green-rgb), 0.9); } .snackbar_item.error { background-color: rgba(var(--dark-red-rgb), 0.9); } .snackbar_item_trigger { line-height: 10px; padding: 10px; position: absolute; right: 0; top: 0; } .snackbar_item_trigger:hover { opacity: 0.75; } /* Tabulator */ .tabulator { background: transparent; } .tabulator .tabulator-header { background: var(--black-100); border-radius: 10px 10px 0px 0px; border-color: rgba(var(--gray-300-rgb), 0.5); } .tabulator .tabulator-header .tabulator-col { background: transparent; color: var(--gray-100); font-size: 14px; line-height: 20px; padding: 15px; font-weight: 700; border-color: rgba(var(--gray-300-rgb), 0.5); } .tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { background: var(--black-300); } .tabulator .tabulator-header .tabulator-col .tabulator-col-content { padding: 0; } .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-arrow { top: 7px; } .tabulator .tabulator-row .tabulator-cell { padding: 15px; border-color: rgba(var(--gray-300-rgb), 0.5); color: var(--white); font-size: 12px; } .tabulator .tabulator-row, .tabulator .tabulator-row:nth-child(even) { background: var(--black-200); border-color: rgba(var(--gray-300-rgb), 0.5); } .tabulator .tabulator-row .tabulator-cell .tabulator-data-tree-control { border-color: var(--gray-100); vertical-align: top; margin-top: 1px; } .tabulator .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand:after, .tabulator .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand { background: var(--gray-100); } .tabulator .tabulator-row.tabulator-selectable:hover { background: var(--black-200); } .tabulator .tabulator-footer { background: var(--black-300); border: none; padding: 20px; text-align: left; } .tabulator .tabulator-footer .tabulator-page-size, .tabulator .tabulator-footer .select2 { max-width: 60px; } .tabulator .tabulator-footer .select2-container .select2-selection--single .select2-selection__rendered:before { display: none; } .tabulator .tabulator-footer .select2-container .select2-dropdown:before, .tabulator .tabulator-footer .select2.select2-container:before { top: -5px; } .tabulator .tabulator-footer .select2-container .select2-selection--single .select2-selection__rendered { font-size: 16px; } .tabulator .tabulator-footer .select2 { margin-right: auto; } .tabulator .tabulator-footer .tabulator-paginator { display: flex; align-items: center; } .tabulator .tabulator-footer .tabulator-paginator label { font-weight: 400; font-size: 12px; margin-right: 20px; } .tabulator .tabulator-footer .tabulator-paginator button { color: var(--gray); margin: 0; border-radius: 0; padding: 7px; min-width: 32px; text-align: center; } .tabulator .tabulator-footer .tabulator-paginator button:disabled { pointer-events: none; } .tabulator .tabulator-footer .tabulator-paginator [data-page=first], .tabulator .tabulator-footer .tabulator-paginator [data-page=last] { display: none; } .tabulator .tabulator-footer .tabulator-paginator [data-page=prev], .tabulator .tabulator-footer .tabulator-paginator [data-page=next] { border-radius: 6px; padding-left: 15px; padding-right: 15px; } .tabulator .tabulator-footer .tabulator-pages { margin: 0 12px; } .tabulator .tabulator-footer .tabulator-pages button { margin-right: -1px; } .tabulator .tabulator-footer .tabulator-pages button:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; } .tabulator .tabulator-footer .tabulator-pages button:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .tabulator .tabulator-footer .tabulator-pages button:hover, .tabulator .tabulator-footer .tabulator-pages button.active { position: relative; z-index: 10; } .tabulator .tabulator-footer .tabulator-pages button:hover { background-color: var(--black-100); color: #fff; border-color: rgba(var(--white-rgb), 0.4); } .tabulator .tabulator-footer .tabulator-pages button.active { background-color: rgba(var(--green-rgb), 0.1); border-color: rgba(var(--green-rgb), 0.3); color: var(--green); pointer-events: none; } @media (max-width: 767.98px) { .tabulator .tabulator-footer .tabulator-paginator [data-page=prev] { margin-right: 10px; } .tabulator .tabulator-footer .tabulator-paginator .tabulator-pages { display: none; } } @media (min-width: 1200px) { .tabulator .tabulator-header .tabulator-col, .tabulator-row .tabulator-cell { padding: 15px; } } .lh-1 { line-height: 1; } .lh-23 { line-height: 23px; } /* ============================== ADDITIONAL UTILITY CLASSES (Scoped to gifts page) ============================== */ /* Line height utilities */ .gifts-page .line-height-1-1 { line-height: 1.1 !important; } .gifts-page .line-height-16 { line-height: 16px !important; } .gifts-page .line-height-24 { line-height: 24px !important; } .gifts-page .line-height-32 { line-height: 32px !important; } /* Text utilities */ .gifts-page .text-uppercase { text-transform: uppercase !important; } .gifts-page .text-decoration-none { text-decoration: none !important; } .gifts-page .text-decoration-underline { text-decoration: underline !important; } .gifts-page .letter-spacing-2-4 { letter-spacing: 2.4px !important; } .gifts-page .word-wrap-break { word-wrap: break-word !important; } /* Padding utilities */ .gifts-page .p-12 { padding: 12px !important; } .gifts-page .p-20 { padding: 20px !important; } .gifts-page .p-24 { padding: 24px !important; } .gifts-page .p-32 { padding: 32px !important; } .gifts-page .p-48 { padding: 48px !important; } .gifts-page .px-20 { padding-left: 20px !important; padding-right: 20px !important; } .gifts-page .px-24 { padding-left: 24px !important; padding-right: 24px !important; } .gifts-page .px-64 { padding-left: 64px !important; padding-right: 64px !important; } .gifts-page .py-16 { padding-top: 16px !important; padding-bottom: 16px !important; } .gifts-page .py-40 { padding-top: 40px !important; padding-bottom: 40px !important; } .gifts-page .py-128 { padding-top: 128px !important; padding-bottom: 128px !important; } .gifts-page .pl-8 { padding-left: 8px !important; } /* Responsive padding utilities */ @media (min-width: 768px) { .gifts-page .py-md-128 { padding-top: 128px !important; padding-bottom: 128px !important; } } /* Margin utilities */ .gifts-page .mt-32 { margin-top: 32px !important; } .gifts-page .mt-48 { margin-top: 48px !important; } .gifts-page .mb-32 { margin-bottom: 32px !important; } /* Position utilities */ .gifts-page .position-absolute { position: absolute !important; } .gifts-page .position-relative { position: relative !important; } .gifts-page .top-0 { top: 0px !important; } .gifts-page .end-0 { right: 0px !important; } .gifts-page .z-10 { z-index: 10 !important; } .gifts-page .overflow-hidden { overflow: hidden !important; } /* Flex utilities */ .gifts-page .flex-shrink-0 { flex-shrink: 0 !important; } .gifts-page .flex-1 { flex: 1 !important; } .gifts-page .flex-wrap { flex-wrap: wrap !important; } .gifts-page .justify-content-start { justify-content: start !important; } /* Object utilities */ .gifts-page .object-fit-contain { -o-object-fit: contain !important; object-fit: contain !important; } /* Cursor utilities */ .gifts-page .cursor-pointer { cursor: pointer !important; } /* Transition utilities */ .gifts-page .transition-all { transition: all 0.3s ease !important; } /* Border utilities */ .gifts-page .border-bottom-white { border-bottom: 1.5px solid #E2E2E2 !important; } .gifts-page .border-green-dashed { border: 1px dashed #36C006 !important; border-radius: 12px !important; } .gifts-page .border-green-dashed::before { content: none !important; } .gifts-page .border-green-gradient { position: relative !important; border-radius: 24px !important; border: 1px solid transparent !important; background: linear-gradient(#111111, #111111) padding-box, linear-gradient(145deg, rgb(54, 192, 6) 0%, rgb(54, 192, 6) 32%, rgb(17, 17, 17) 68%, rgb(17, 17, 17) 100%) border-box !important; } /* Additional flex utilities */ .gifts-page .align-content-center { align-content: center !important; } /* Decorative element dimensions */ .gifts-page .w-772 { width: 772px !important; } .gifts-page .h-1036 { height: 1036px !important; } .gifts-page .w-633 { width: 633.5px !important; } .gifts-page .h-565 { height: 564.59px !important; } .gifts-page .w-546 { width: 545.57px !important; } .gifts-page .h-277 { height: 276.96px !important; } .gifts-page .w-680 { width: 680px !important; } .gifts-page .h-434 { height: 434px !important; } /* Position utilities for decorative elements */ .gifts-page .position-decorative { position: absolute !important; pointer-events: none !important; z-index: 1 !important; } .gifts-page .position-content { position: relative !important; z-index: 2 !important; } /* Car Gifts Page Utilities */ .car-gifts-page .w-24 { width: 24px !important; } .car-gifts-page .h-24 { height: 24px !important; } .car-gifts-page .w-32 { width: 32px !important; } .car-gifts-page .h-32 { height: 32px !important; } .car-gifts-page .w-64 { width: 64px !important; } .car-gifts-page .h-64 { height: 64px !important; } .car-gifts-page .w-96 { width: 96px !important; } .car-gifts-page .h-96 { height: 96px !important; } .car-gifts-page .gap-10 { gap: 10px !important; } .car-gifts-page .gap-12 { gap: 12px !important; } .car-gifts-page .gap-16 { gap: 16px !important; } .car-gifts-page .gap-24 { gap: 24px !important; } .car-gifts-page .gap-32 { gap: 32px !important; } .car-gifts-page .gap-48 { gap: 48px !important; } .car-gifts-page .gap-64 { gap: 64px !important; } .car-gifts-page .gap-96 { gap: 96px !important; } .car-gifts-page .z-10 { z-index: 10 !important; } .car-gifts-page .mb-8 { margin-bottom: 8px !important; } .car-gifts-page .mb-16 { margin-bottom: 16px !important; } .car-gifts-page .position-decorative { position: absolute !important; pointer-events: none !important; z-index: 1 !important; } .car-gifts-page .position-content { position: relative !important; z-index: 2 !important; } .car-gifts-page .letter-spacing-2-56 { letter-spacing: 2.56px !important; } .article_title { font-size: 2.4rem; font-weight: 700; letter-spacing: normal; line-height: 1.2; max-width: 900px; } @media (min-width: 768px) { .article_title { font-size: 3.2rem; } } @media (min-width: 1200px) { .article_title { font-size: 4rem; } } .article_toc { --toc-muted: #8a8a8a; } .article_toc_title { color: var(--gray); cursor: pointer; letter-spacing: 0.04em; list-style: none; transition: color 0.25s; } .article_toc_title::-webkit-details-marker { display: none; } .article_toc_title::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 8px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform 0.2s; } details[open] > .article_toc_title::after { transform: translateY(1px) rotate(-135deg); } @media (min-width: 992px) { .article_toc_title { cursor: default; } .article_toc_title::after { display: none; } } .article_toc .article_toc_list { margin: 0; padding: 0; font-size: inherit; list-style: none; } .article_toc .article_toc_list li { margin-bottom: 0; padding-left: 0; position: static; } .article_toc .article_toc_list li::before { content: none; } .article_toc .article_toc_list a { display: block; padding: 6px 0 6px 12px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.4; color: var(--gray); text-decoration: none; transition: color 0.25s; } .article_toc .article_toc_list a:hover, .article_toc .article_toc_list a:focus-visible, .article_toc .article_toc_list a.s-active { color: var(--white); border-left-color: var(--green); } .article_toc.s-reading:not(:hover):not(:focus-within) .article_toc_title, .article_toc.s-reading:not(:hover):not(:focus-within) .article_toc_list a { color: var(--toc-muted); } .article_toc.s-reading:not(:hover):not(:focus-within) .article_toc_list a.s-active { color: var(--gray); } .inverted .article_toc { --toc-muted: #626262; } @media (min-width: 992px) { .article_rail { position: sticky; top: 100px; } } [data-flickity]:focus-visible { outline: none !important; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.01ms !important; } } @media (min-width: 1440px) { .col-xxl { flex-basis: 0; flex-grow: 1; max-width: 100%; } .col-xxl-auto { flex: 0 0 auto; width: auto; max-width: 100%; } .col-xxl-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .col-xxl-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .col-xxl-3 { flex: 0 0 25%; max-width: 25%; } .col-xxl-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .col-xxl-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .col-xxl-6 { flex: 0 0 50%; max-width: 50%; } .col-xxl-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .col-xxl-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .col-xxl-9 { flex: 0 0 75%; max-width: 75%; } .col-xxl-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .col-xxl-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .col-xxl-12 { flex: 0 0 100%; max-width: 100%; } .order-xxl-first { order: -1; } .order-xxl-last { order: 13; } .order-xxl-0 { order: 0; } .order-xxl-1 { order: 1; } .order-xxl-2 { order: 2; } .order-xxl-3 { order: 3; } .order-xxl-4 { order: 4; } .order-xxl-5 { order: 5; } .order-xxl-6 { order: 6; } .order-xxl-7 { order: 7; } .order-xxl-8 { order: 8; } .order-xxl-9 { order: 9; } .order-xxl-10 { order: 10; } .order-xxl-11 { order: 11; } .order-xxl-12 { order: 12; } .offset-xxl-0 { margin-left: 0; } .offset-xxl-1 { margin-left: 8.33333%; } .offset-xxl-2 { margin-left: 16.66667%; } .offset-xxl-3 { margin-left: 25%; } .offset-xxl-4 { margin-left: 33.33333%; } .offset-xxl-5 { margin-left: 41.66667%; } .offset-xxl-6 { margin-left: 50%; } .offset-xxl-7 { margin-left: 58.33333%; } .offset-xxl-8 { margin-left: 66.66667%; } .offset-xxl-9 { margin-left: 75%; } .offset-xxl-10 { margin-left: 83.33333%; } .offset-xxl-11 { margin-left: 91.66667%; } } /*rtl:begin:ignore*/ .daterangepicker { background: var(--black-200); border: none; color: var(--white); font-family: "Roboto", sans-serif; border-radius: 0; } .daterangepicker:before, .daterangepicker:after { display: none; } .daterangepicker .drp-calendar { max-width: none; float: none; } .daterangepicker .drp-calendar.left { padding: 0 20px; } .daterangepicker .drp-calendar.right { padding: 0 20px; } .daterangepicker.show-ranges.ltr .drp-calendar.left { border: none; } .daterangepicker .drp-calendar.left .calendar-table { padding-right: 0; } .daterangepicker .inputbox { margin-bottom: 20px; } .daterangepicker .calendar-table { background: transparent; border-radius: 0; border: none; } .daterangepicker .calendar-table td, .daterangepicker .calendar-table th { border-radius: 0; font-size: 14px; border: none; width: 36px; height: 36px; min-width: 36px; } .daterangepicker .calendar-table th { font-weight: 700; color: var(--gray-100); } .daterangepicker .calendar-table th.month { font-size: 18px; color: var(--white); } .daterangepicker td.off, .daterangepicker td.off.end-date, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date { background: transparent; color: var(--gray-100); } .daterangepicker td.active, .daterangepicker td.active:hover { background: rgba(var(--green-rgb), 0.6); } .daterangepicker td.available:hover, .daterangepicker th.available:hover { background: rgba(var(--green-rgb), 0.6); color: var(--white); border-radius: 3px; } .daterangepicker td.in-range { background: var(--gray-300); color: inherit; } .daterangepicker td.start-date { border-radius: 3px; background: rgba(var(--green-rgb), 0.6); } .daterangepicker td.end-date { border-radius: 3px; background: rgba(var(--green-rgb), 0.6); } .daterangepicker.show-calendar .ranges { margin: 0; } .daterangepicker .ranges { padding: 20px; float: none; } .daterangepicker .ranges ul { width: 100%; } .daterangepicker .ranges li { font-size: 20px; padding: 8px 23px; line-height: 1; border-radius: 5px; margin-bottom: 2px; color: var(--gray-100); font-weight: 400; } .daterangepicker .ranges li:hover { color: var(--white); background: transparent; } .daterangepicker .ranges li.active { background: var(--gray-300); color: var(--green); } .daterangepicker .ranges .btn { display: none; } .daterangepicker .calendar-table thead tr:first-child th { padding-bottom: 20px; } .daterangepicker .calendar-table thead tr:last-child th { padding-bottom: 25px; } .daterangepicker .calendar-table .next, .daterangepicker .calendar-table .prev { height: 45px; max-width: 24px; pointer-events: none; } .daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span { display: block; width: 45px; height: 45px; border-radius: 100%; background: url("data:image/svg+xml,%3Csvg width='45' height='45' viewBox='0 0 45 45' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30.7071 22.7071C31.0976 22.3166 31.0976 21.6834 30.7071 21.2929L24.3431 14.9289C23.9526 14.5384 23.3195 14.5384 22.9289 14.9289C22.5384 15.3195 22.5384 15.9526 22.9289 16.3431L28.5858 22L22.9289 27.6569C22.5384 28.0474 22.5384 28.6805 22.9289 29.0711C23.3195 29.4616 23.9526 29.4616 24.3431 29.0711L30.7071 22.7071ZM15 23L30 23L30 21L15 21L15 23Z' fill='white'/%3E%3C/svg%3E%0A") no-repeat 50% 50%; background-size: cover; border: none; padding: 0; transform: none; pointer-events: all; } .daterangepicker .calendar-table .prev span { transform: rotate(-180deg); } .daterangepicker .calendar-table .next span { float: right; } .daterangepicker .calendar-table .prev:hover span, .daterangepicker .calendar-table .next:hover span { background-color: var(--gray-300); } .daterangepicker .calendar-table .prev:hover, .daterangepicker .calendar-table .next:hover { background-color: transparent; } .daterangepicker .drp-selected { display: none; } .daterangepicker.show-calendar .drp-buttons { border: none; padding: 30px 20px 10px; font-size: 0; display: flex; flex-direction: column; } .daterangepicker .drp-buttons .btn { padding-top: 16px; padding-bottom: 16px; font-size: 14px; margin: 0 0 20px; width: 100%; font-size: 18px; order: 2; } .daterangepicker .drp-buttons .btn:last-child { order: 1; } @media (max-width: 767.98px) { .datepicker-open:before { content: ""; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: rgba(var(--black-400-rgb), 0.7); z-index: 20; } .daterangepicker { right: 0 !important; width: auto; left: 0 !important; margin-top: 0; box-shadow: 0 0 1px rgba(var(--black-rgb), 0.1); } .daterangepicker .calendar-table { display: none; } } @media (min-width: 768px) { .daterangepicker { margin-top: 13px; margin-right: -15px; border-radius: 5px 0 5px 5px; } .daterangepicker .drp-calendar { float: left; } .daterangepicker .drp-calendar.left { padding: 30px 10px 30px 35px; } .daterangepicker .drp-calendar.right { padding: 30px 35px 30px 10px; } .daterangepicker.show-calendar .ranges { float: right; } .daterangepicker .ranges { padding: 20px 15px; } .daterangepicker .ranges ul { margin-bottom: 15px; } .daterangepicker .ranges .btn { display: block; width: 100%; padding-top: 9px; padding-bottom: 9px; font-size: 14px; margin-bottom: 10px; } .daterangepicker.show-calendar .drp-buttons { display: none; } .daterangepicker .calendar-table td, .daterangepicker .calendar-table th { width: 28px; height: 28px; min-width: 28px; } } /*rtl:end:ignore*/ /***********/ /* Tooltip */ /***********/ .tooltip { cursor: pointer; } .tooltipster-sidetip .tooltipster-box { border: none; background: var(--black-200); } .tooltipster-sidetip .tooltipster-content { font-size: 12px; color: #A6A6A6; } .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background { border-top-color: var(--black-200); } .tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border { display: none; } .loader-wrapper { position: fixed; z-index: 1000; background: var(--black-400); transition: all 0.3s; opacity: 0; visibility: hidden; } .loader-active { opacity: 1; visibility: visible; } .loader { position: relative; width: 100px; height: 100px; perspective: 780px; } .loader-inner { position: absolute; width: 100%; height: 100%; box-sizing: border-box; border-radius: 50%; } .loader-inner.loader-one { left: 0%; top: 0%; animation: loader-rotate-one 1.15s linear infinite; border-bottom: 3px solid var(--green); } .loader-inner.loader-two { right: 0%; top: 0%; animation: loader-rotate-two 1.15s linear infinite; border-right: 3px solid var(--white); } .loader-inner.loader-three { right: 0%; bottom: 0%; animation: loader-rotate-three 1.15s linear infinite; border-top: 3px solid var(--red); } @keyframes loader-rotate-one { 0% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @keyframes loader-rotate-two { 0% { transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @keyframes loader-rotate-three { 0% { transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } /**************/ /* Navigation */ /**************/ .navigation { font-weight: 400; font-size: 16px; } .navigation li { color: var(--white); margin-bottom: 0.5em; } .navigation li:last-child { margin-bottom: 0; } .navigation li a { color: inherit; text-decoration: none; display: inline-block; } .navigation li a:hover { color: var(--green); } .navigation h3 { margin-bottom: 1.6em; } .navigation p { line-height: 1.5; margin-bottom: 1em; } .navigation p a { font-size: 18px; } .navigation p + h3 { padding-top: 1.5em; } .navigation .social { text-align: center; } .navigation .social li { display: inline-block; vertical-align: top; margin: 0 20px; } .navigation .social a { display: block; } .navigation .social a:hover .icon { fill: rgba(var(--white-rgb), 0.6); } .navigation .social a:active .icon { fill: rgba(var(--white-rgb), 0.1); } .navigation .social .icon { fill: rgba(var(--white-rgb), 0.2); width: 40px; height: 40px; } @media (min-width: 768px) { .navigation { font-size: 14px; } .navigation p a { font-size: 16px; } .navigation .col_1 { flex: 0 0 29%; max-width: 29%; } .navigation .col_2 { flex: 0 0 18%; max-width: 18%; } .navigation .col_3 { flex: 0 0 27%; max-width: 27%; } .navigation .col_4 { flex: 0 0 26%; max-width: 26%; } .navigation .col_3 h3 { margin-bottom: 1.5em; } .navigation .social { margin: 0 -0.5em 2em; text-align: left; } .navigation .social li { margin: 0 0.5em; } } @media (min-width: 992px) { .navigation { font-size: 16px; } .navigation p a { font-size: 18px; } } @media (min-width: 1200px) { .navigation { font-size: 16px; } .navigation .col_1 { flex: 0 0 30%; max-width: 30%; } .navigation .col_2 { flex: 0 0 25%; max-width: 25%; } .navigation .col_3 { flex: 0 0 23%; max-width: 23%; } .navigation .col_4 { flex: 0 0 22%; max-width: 22%; } .navigation .social { margin: 0 -1em 2em; } .navigation .social li { margin: 0 0.5em; } } /* Nav trigger */ .nav-trigger { display: flex; height: 32px; width: 32px; padding: 7px 5px 8px; z-index: 2; flex-direction: column; justify-content: space-between; flex-shrink: 0; cursor: pointer; } @media (min-width: 1200px) { .nav-trigger { height: 60px; width: 60px; padding: 15px 9px; } } .nav-trigger__line { display: block; height: 1px; width: 100%; background: var(--white); } .nav-trigger__line-1 { transform-origin: 0 0; transition: transform 0.4s ease-in-out; } .nav-trigger__line-2 { align-self: flex-end; width: 15px; transition: transform 0.2s ease-in-out; } @media (min-width: 768px) { .nav-trigger__line-2 { width: 28px; } } .nav-trigger__line-3 { transform-origin: 0 100%; transition: transform 0.4s ease-in-out; } .nav-animated .nav-trigger .nav-trigger__line-1 { transform: rotate(45deg); } .nav-animated .nav-trigger .nav-trigger__line-2 { transform: scaleY(0); } .nav-animated .nav-trigger .nav-trigger__line-3 { transform: rotate(-45deg); } /* Header navigation */ .nav-main { position: fixed; inset: 0; z-index: 90; visibility: hidden; transform: translate(-100%, 0); transition: all 0.2s ease-in-out; padding-top: 70px; } .nav-main a:not([class]) { color: inherit; text-decoration: none; } .nav-main a:not([class]):hover { color: var(--green); } .nav-main a:not([class]):hover svg { fill: var(--green); } @media (min-width: 768px) { .nav-main { transform: translate(0, 0); opacity: 0; } } @media (min-width: 992px) { .nav-main { padding-top: 100px; } } @media (min-width: 1200px) { .nav-main { padding-top: 160px; } } html:has(.nav-open), body:has(.nav-open) { overflow: hidden; } @media (min-width: 1200px) { .s-scrolled .nav-main { padding-top: 100px; } } .nav-main-inner { max-height: 100%; overflow: auto; -webkit-overflow-scrolling: touch; } .nav-main-link { border-radius: 1.2rem; color: var(--gray); background-color: var(--black-300); text-decoration: none; position: relative; transition: all 0.15s ease-out; } .nav-main-link::before { content: ""; position: absolute; inset: 0 auto 0 0; background-color: currentColor; } .nav-main-link.red { background-color: rgba(var(--red-rgb), 0.08); color: var(--red); } .nav-main-link.red:hover { background-color: rgba(var(--red-rgb), 0.16); color: var(--red); } .nav-main-link .icon { fill: currentColor; } .nav-main-link:hover { background-color: var(--gray-300); color: var(--white); } .nav-main-link.is-active { background-color: rgba(var(--green-rgb), 0.05); color: var(--green); } .nav-main-link.is-active::before { width: 4px; } .nav-main-link .logo_light { display: none; } .nav-animated .nav-main { transform: translate(0, 0); opacity: 1; visibility: visible; transition: all 0.25s ease-in-out; } .nav-main-2 { padding-top: 0; background-color: transparent; opacity: 1; transition: all 0.5s; } .nav-main-2::before { content: ""; position: absolute; inset: 0; background-color: rgba(var(--black-rgb), 0.8); transition: opacity 0.5s cubic-bezier(0.4, 0, 0.6, 1); opacity: 0; } .nav-main-2 .nav-main-inner { translate: -100%; transition: translate 0.35s cubic-bezier(0.4, 0, 0.6, 1); } @media (min-width: 768px) { .nav-main-2 .nav-main-inner { max-width: 425px; } } .nav-animated .nav-main-2::before { opacity: 1; } .nav-animated .nav-main-2 .nav-main-inner { translate: 0; transition-delay: 0.15s; } /**********/ /* Header */ /**********/ .header_main { position: fixed; left: 0; right: 0; top: 0; z-index: 100; padding: 10px 0; transition: background 0.25s, padding 0.25s; } .header_main .logo { max-width: 70px; margin-right: 24px; } .header_main .logo a { display: block; } .header_main .logo_light { display: none; } .header_main .icon { fill: currentColor; } .inverted .header_main .logo { display: none; } .inverted .header_main .logo_light { display: block; } .header_main .trigger { color: var(--gray); cursor: pointer; text-decoration: none; } .header_main .trigger:hover { color: var(--white); } .header_main .btn { margin-left: 15px; } .s-scrolled .header_main { background: rgba(var(--black-400-rgb), 0.9); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } .nav-open .header_main { background: var(--black-500); } @media (max-width: 991.98px) { .header_main .btn { font-size: 14px; padding: 10px; } } @media (min-width: 768px) { .header_main .logo { margin-right: 55px; max-width: 140px; } } @media (min-width: 992px) { .header_main { padding-top: 20px; padding-bottom: 20px; } .header_main .logo { max-width: 180px; } } @media (min-width: 1200px) { .header_main { padding: 50px 0; } .header_main .container { max-width: 90%; } .header_main .btn { min-width: 190px; } .header_main .logo { max-width: 210px; } .s-scrolled .header_main { padding-top: 20px; padding-bottom: 20px; } } @media (min-width: 1440px) { .header_main .btn { min-width: 250px; } } .header_single { padding: 20px 0; } .header_single .logo { display: block; max-width: 100px; } @media (min-width: 992px) { .header_single { padding: 30px 0; } } /**********/ /* Footer */ /**********/ .footer_main { padding: 50px 0 30px; font-weight: 400; font-size: 12px; } .footer_main .text { text-align: center; font-size: 10px; color: var(--gray-100); line-height: 1.4; } .footer_main .logo { max-width: 110px; margin: 0 auto 20px; } .footer_main .language { margin-bottom: 4.2em; } @media (min-width: 768px) { .footer_main .text { font-size: 14px; text-align: left; } .footer_main .logo { margin-right: 0; } .footer_main .text > div:last-child { text-align: right; } } @media (min-width: 992px) { .footer_main { font-size: 16px; } } @media (min-width: 1200px) { .footer_main { padding: 10em 0 5.65em; font-size: 16px; } .footer_main .text { padding: 6.3em 0; } } .footer_single { padding: 50px 0 40px; font-size: 14px; } .footer_single .language .icon { width: 30px; height: 30px; } .footer_single .copyright { font-size: 12px; padding-top: 25px; } .footer_single .links li { margin-bottom: 20px; } @media (min-width: 576px) { .footer_single .wrapper { margin: 0 auto; max-width: 800px; } } @media (min-width: 768px) { .footer_single .copyright { font-size: 14px; } } @media (min-width: 992px) { .footer_single .copyright { padding-top: 10px; } .footer_single .links li { display: inline-block; vertical-align: top; margin-bottom: 0; margin-right: 20px; } } /************/ /* Language */ /************/ .language { background: var(--black-200); position: relative; z-index: 10; border-radius: 12px; margin-right: 12px; } .language:hover { background: var(--black-100); } .language .label { color: var(--white); display: block; font-size: 14px; font-weight: 400; line-height: 1.2; padding-right: 15px; position: relative; position: relative; text-transform: uppercase; z-index: 10; } .language .label:after { border: 3px solid transparent; border-top: 6px solid rgba(var(--white-rgb), 0.3); content: ""; margin-top: -3px; position: absolute; right: 0; top: 50%; } .language_label { align-items: center; cursor: pointer; display: flex; padding: 16px 16px; position: relative; z-index: 10; } .language_list { left: 0; opacity: 0; position: absolute; top: 100%; transform: translateY(-10px); transition: all 0.15s ease-in-out; visibility: hidden; padding-top: 10px; } .language_list > ul { background: var(--black-200); border-radius: 12px; padding: 10px 0; } .language_list > ul > li { display: block; } .language_list > ul > li > a { color: var(--gray); display: block; font-size: 12px; padding: 5px 15px; text-decoration: none; white-space: nowrap; } .language_list > ul > li > a:hover { color: var(--white); } .language_bottom .language_list { bottom: 100%; top: auto; transform: translateY(10px); padding-top: 0; padding-bottom: 10px; } .language.dropdownbox-open { background-color: var(--black-100); } .language.dropdownbox-open .language_list { opacity: 1; visibility: visible; transform: translateY(0); } .language.dropdownbox-open .label:after { transform: rotate(-180deg); margin-top: -6px; } /* Trigger icon */ .trigger_icon { background-color: var(--black-200); border-radius: 12px; height: 48px; width: 48px; cursor: pointer; flex: 0 0 auto; } .trigger_icon:hover { background-color: var(--black-100); } /****************/ /* Content card */ /****************/ .content_card { margin-bottom: 40px; } .content_card_image { flex: 1 1 17.5%; width: 100%; max-width: 75px; } .content_card_image_inner { padding-bottom: 100%; position: relative; } .content_card_image img, .content_card_image svg { position: absolute; left: 0; bottom: 0; max-height: 100%; } .content_card_title { flex: 1 1 82.5%; padding-left: 20px; } @media (min-width: 768px) { .content_card_title { padding: 40px 0 0; flex: 1 1 100%; } } @media (min-width: 1200px) { .content_card_image { max-width: 105px; } .content_card_title { padding-top: 70px; } } /****************/ /* Payment card */ /****************/ .payment_card { align-items: center; background: rgba(var(--white-rgb), 0.05); border-radius: 10px; border: 1px solid transparent; color: inherit; cursor: pointer; display: flex; flex: 0 0 100%; margin: 0 0 20px; padding: 25px; text-decoration: none; transition: all 0.2s ease-in-out; } .payment_card h4 { color: var(--white); } .payment_card p { font-size: 12px; } .payment_card .icon { fill: var(--gray-100); width: 24px; height: 24px; margin-right: 15px; /*min-width: 24px;*/ transition: all 0.2s ease-in-out; } .payment_card_lg { background: transparent; border-color: var(--black-200); flex: 0 1 100%; } .payment_card_lg .icon { fill: var(--white); width: 80px; height: 80px; } .payment_card_lg .label { color: var(--white); font-size: 18px; } .payment_card:hover, .payment_card_active { border-color: rgba(var(--green-rgb), 0.5); background: transparent; transition: all 0.25s ease-in-out; } .payment_card:hover .icon, .payment_card_active .icon { fill: var(--green); transition: all 0.25s ease-in-out; } .payment_card_logo img { max-height: 70px; max-width: 200px; width: auto; height: auto; margin: 0 auto; } @media (min-width: 576px) { .payment_card { flex: 0 1 calc(50% - 20px); margin-left: 10px; margin-right: 10px; } .payment_card_lg { flex: 0 1 calc(50% - 20px); max-width: calc(50% - 20px); } } @media (min-width: 768px) { .payment_card p { font-size: 14px; } .payment_card_lg .icon { width: 40px; height: 40px; } .payment_card_lg .label { font-size: 16px; } } @media (min-width: 992px) { .payment_card { /*padding: 25px;*/ flex: 0 1 calc(50% - 20px); } .payment_card .icon { width: 40px; height: 40px; margin-right: 30px; } .payment_card_lg { flex: 0 1 calc(50% - 20px); } .payment_card_lg .icon { width: 70px; height: 70px; } } @media (min-width: 1200px) { .payment_card_lg { padding: 35px 45px; } /*.payment_card_lg .icon { width: 80px; height: 80px; }*/ .payment_card_lg .label { font-size: 18px; } } @media (min-width: 1360px) { .payment_card_lg { margin: 0 20px 40px; /*flex:0 1 360px;*/ flex: 0 1 calc(50% - 40px); max-width: calc(50% - 40px); } /*.payment_card_lg .icon { width: 100px; height: 100px; }*/ /*.payment_card_logo img { max-height: 100px; }*/ } @media (min-width: 1440px) { .payment_card { /*padding: 25px;*/ flex: 0 1 calc(33.333% - 20px); } .payment_card_lg { flex: 0 1 calc(33.333% - 40px); max-width: calc(33.333% - 40px); } } /*************/ /* Code card */ /*************/ .code_card { background: var(--black-200); box-shadow: 0px 4px 20px rgba(var(--black-rgb), 0.35); border-radius: 25px 25px 0px 25px; padding: 25px 20px; max-width: 245px; } @media (min-width: 768px) { .code_card { padding: 70px 60px; max-width: 400px; } } /* Credit card */ .credit_card { background: var(--black-200); box-shadow: 0px 4px 20px rgba(var(--black-rgb), 0.35); border-radius: 25px 0px 0px 25px; padding: 40px 20px 40px 40px; margin-bottom: 30px; } .credit_card .tooltip { background: none; } .credit_card .form_row_short { max-width: 120px; margin-bottom: 0; } @media (min-width: 768px) { .credit_card { max-width: 530px; border-radius: 25px; margin-bottom: 50px; padding-right: 40px; } } @media (min-width: 1440px) { .credit_card { padding: 80px 65px; margin-bottom: 70px; } } /* Print trigger */ .print_trigger { font-size: 12px; } .print_trigger .icon { margin-right: 20px; } /* QR trigger */ .qr_trigger { background: var(--white); border-radius: 10px; padding: 25px; display: inline-block; } /* Infobox */ .infobox { display: flex; font-size: 16px; margin-bottom: 30px; } .infobox small { font-size: 12px; display: block; } .infobox .icon { flex: 1 0 30px; margin-right: 20px; flex-grow: 0; } .infobox .icon + span { padding-top: 5px; } @media (min-width: 992px) { .infobox { margin-bottom: 50px; } } /*****************/ /* Document card */ /*****************/ .document_card { border: 1px solid var(--black-200); border-radius: 10px; padding: 20px; display: flex; margin-bottom: 20px; align-items: center; transition: all 0.2s ease-in-out; text-decoration: none; } .document_card h5 { color: var(--gray-100); font-weight: 400; margin-bottom: 15px; font-size: 18px; } .document_card .icon { fill: var(--gray); width: 80px; height: 80px; margin-right: 45px; flex: 1 0 80px; transition: all 0.2s ease-in-out; } .document_card .btn { border-width: 1px; font-size: 14px; text-transform: none; font-weight: 400; padding: 10px 15px; min-width: 160px; border-color: #535353; cursor: inherit; } .document_card .btn span:last-child { position: relative; } .document_card .progress { position: absolute; left: 0; top: 0; bottom: 0; opacity: 0; transition: all 0.2s; background: rgba(var(--green-rgb), 0.5); border-radius: 3px; } .document_card .label { flex-grow: 1; } a.document_card:not(.document_card_in_progress):hover { background: rgba(var(--black-200-rgb), 0.5); border-color: transparent; transition: all 0.25s ease-in-out; } .document_card_red .icon { fill: var(--red); } .document_card_red .btn { border-color: rgba(var(--red-rgb), 0.5); color: var(--red); } .document_card_green .icon { fill: var(--green); } .document_card_green .btn { background: rgba(var(--green-rgb), 0.5); border-color: transparent; } .document_card_in_progress .icon { fill: var(--green); } .document_card_in_progress .btn { color: var(--green); background: rgba(var(--green-rgb), 0.1); border-color: rgba(var(--green-rgb), 0.5); } @media (min-width: 992px) { .document_card { flex-direction: column; text-align: center; } .document_card .icon { margin-right: 0; margin-bottom: 20px; } } @media (min-width: 1200px) { .document_card { flex-direction: row; text-align: left; margin-bottom: 30px; } .document_card .icon { margin-bottom: 0; margin-right: 20px; } } @media (min-width: 1360px) { .document_card { padding-top: 30px; padding-bottom: 30px; } .document_card .icon { width: 100px; height: 100px; flex: 1 0 100px; } .document_card h5 { margin-bottom: 30px; } } /*************/ /* Link card */ /*************/ .link_card { display: flex; align-items: center; font-size: 14px; margin-bottom: 30px; } .link_card .icon { max-width: 50px; margin-right: 25px; flex: 1 0 50px; height: 50px; } /*******/ /* 404 */ /*******/ .page_404 { min-height: calc(100vh - 170px); letter-spacing: 0.05em; padding-top: 70px; position: relative; overflow: hidden; } .page_404 .bg { background-size: 150% auto; background-position: 50% 75%; } /*rtl:begin:ignore*/ [dir=rtl] .page_404 .bg { transform: scaleX(-1); } /*rtl:end:ignore*/ .page_404 .text { padding: 30px; text-align: center; } .page_404 h1 { margin-bottom: 1.5em; } .page_404_footer { font-size: 12px; padding: 30px 0; text-align: center; } .page_404_footer .container { max-width: 90%; } .page_404_footer .social { padding-bottom: 30px; } .page_404_footer ul { display: flex; align-items: center; margin: 0 -15px 1em; justify-content: center; } .page_404_footer li { padding: 0 15px; } .page_404_footer .icon { height: 38px; width: 38px; opacity: 0.2; } .page_404_footer a:hover .icon { opacity: 1; } .cabinet .page_404 { margin: 0 -20px; padding: 0 20px; min-height: unset; background-position: 50% 70%; } .cabinet .page_404 .text { padding-left: 0; padding-right: 0; } .cabinet .page_404 p { margin-bottom: 15vh; } .cabinet .page_404 p:last-child { margin-bottom: 0; } @media (min-width: 768px) { .page_404 .bg { background-position: 50% 75%; background-size: contain; } .page_404 .text { text-align: left; max-width: 460px; margin-bottom: 150px; } .page_404_footer { text-align: left; } .page_404_footer ul { justify-content: start; } .cabinet .page_404 { margin: 0 -3vw; padding: 0 3vw; } .cabinet .page_404 .text { max-width: 420px; } } @media (min-width: 992px) { .page_404 { padding-top: 100px; } .page_404 .text { margin-bottom: 0; } } @media (min-width: 1200px) { .page_404 { padding-top: 170px; } .page_404_footer { padding: 50px 0; } } @media (min-width: 1600px) { .cabinet .page_404 { margin: 0 -50px; padding: 0 50px; } } /**************/ /* Intro page */ /**************/ .page_intro .header_main { position: absolute; } .page_intro .header_main .logo { max-width: 170px; padding-top: 90px; } .page_intro .header_main .social { padding-top: 95px; } .page_intro .header_main .social li { margin-left: 30px; } .page_intro .header_main .social .icon { width: 38px; height: 38px; } .page_intro_content { letter-spacing: 0.05em; padding-top: 280px; position: relative; } .page_intro_content .bg { background-size: 576px auto; background-position: 0 -60px; } /*rtl:begin:ignore*/ [dir=rtl] .page_intro_content .bg { transform: scaleX(-1); } /*rtl:end:ignore*/ .page_intro_content .text { text-align: center; line-height: 1.57; margin-bottom: 70px; } .page_intro_content h1 { margin-bottom: 0.85em; } .page_intro_form { padding: 0 20px 200px; text-align: center; position: relative; } .page_intro_form .bg { background-size: 576px auto; background-position: 50%; } /*rtl:begin:ignore*/ [dir=rtl] .page_intro_form .bg { transform: scaleX(-1); } /*rtl:end:ignore*/ .page_intro_form input { text-align: center; } .page_intro_form .form_row { margin-bottom: 40px; } .page_intro_form .btn { width: 100%; } .page_intro_footer { font-size: 12px; padding: 30px 0; text-align: center; } .page_intro_footer .social { padding-bottom: 30px; } .page_intro_footer ul { display: flex; align-items: center; margin: 0 -15px 1em; justify-content: center; } .page_intro_footer li { padding: 0 15px; } .page_intro_footer .icon { height: 38px; width: 38px; opacity: 0.2; } .page_intro_footer a:hover .icon { opacity: 1; } @media (min-width: 576px) { .page_intro_content .bg { background-position: 0 50%; background-size: 100% auto; left: 100px; top: 210px; height: 200px; } .page_intro_content .text { text-align: left; max-width: 450px; } .page_intro_form { padding: 0; margin-bottom: 70px; text-align: right; } .page_intro_form .bg { background-position: 0 50%; background-size: 100% auto; top: -100px; bottom: -100px; } .page_intro_form input { text-align: left; } .page_intro_form .form_inner { background: var(--black-300); border-radius: 60px 0 0 60px; text-align: left; display: inline-block; vertical-align: top; padding: 30px 30px 30px 60px; position: relative; min-width: 50%; } .page_intro_form .form_row { margin-bottom: 0; margin-right: 20px; } .page_intro_form .form_row:last-child { margin-right: 0; } } @media (min-width: 768px) { .page_intro_wrapper { min-height: 100vh; position: relative; padding-bottom: 90px; } .page_intro_content .bg { top: 220px; } .page_intro_content .text { text-align: left; max-width: 460px; margin-bottom: 150px; } .page_intro_footer { text-align: left; position: absolute; left: 0; right: 0; bottom: 0; } .page_intro_footer ul { justify-content: start; } } @media (min-width: 992px) { .page_intro_content { margin-bottom: 100px; } .page_intro_content .bg { left: 150px; top: 240px; } .page_intro .text { margin-bottom: 0; } .page_intro_form input { width: 360px; } } @media (min-width: 1200px) { .page_intro_wrapper { padding-bottom: 128px; } .page_intro_content .text { max-width: 550px; } .page_intro_footer { padding: 50px 0; } .page_intro_footer .container { max-width: 90%; } } /***************/ /* File upload */ /***************/ .file_upload_box { background: var(--black-200); border-radius: 10px; padding: 20px; margin-bottom: 20px; display: flex; font-size: 12px; letter-spacing: 0; flex-wrap: wrap; color: var(--gray-100); } .file_upload_box .bg { padding-bottom: 100%; overflow: hidden; } .file_upload_box .button { margin-right: 20px; flex: 0 0 40px; } .file_upload_box .button .btn { margin-bottom: 10px; } .file_upload_box .buttons { display: flex; margin-bottom: 10px; } .file_upload_box .buttons .btn:first-child { /*flex:1 1 auto;*/ min-width: 0; } .file_upload_box .image { margin-right: 20px; flex: 0 1 100px; min-width: 0; background: var(--gray-200); border-radius: 5px; margin-bottom: 20px; max-width: 100px; } .file_upload_box .image_big { max-width: 200px; min-width: 200px; } .file_upload_box .btn { font-size: 12px; padding: 9px 18px; } .file_upload_box .btn .icon { width: 20px; height: 20px; margin: 0 -9px; } .file_upload_box .btn + .btn { margin-left: 20px; } .file_upload_box .inner { flex: 0 1 320px; min-width: 0; } @media (min-width: 768px) { .file_upload_box { margin-bottom: 50px; } } @media (min-width: 1440px) { .file_upload_box { flex-wrap: nowrap; } .file_upload_box .image { margin-bottom: 0; } } @media (min-width: 1600px) { .file_upload_box { padding: 40px; } } /**************/ /* Tooltipbox */ /**************/ .tooltip_box { background: var(--black-200); border-radius: 5px; color: var(--gray); font-weight: 400; letter-spacing: 0; font-size: 12px; text-align: center; padding: 12px; flex-grow: 1; margin-top: 20px; position: relative; } .tooltip_box strong { font-size: 14px; margin-right: 5px; } .tooltip_box:before { content: ""; position: absolute; left: 50%; top: -5px; width: 10px; height: 10px; background: inherit; transform: rotate(-45deg); } @media (min-width: 768px) { .tooltip_box { margin-top: 0; margin-bottom: 20px; margin-right: 15px; display: flex; align-items: center; justify-content: center; margin-left: 10px; flex: 0 1 170px; } .tooltip_box:before { top: 50%; left: -5px; margin-top: -5px; } } /********/ /* Tabs */ /********/ .tabs_container { overflow: hidden; position: relative; } .tab { left: 0; min-height: 100%; min-width: 100%; opacity: 0; position: absolute; top: 0; visibility: hidden; } .tab.active { opacity: 1; position: relative; transform: none; visibility: visible; z-index: 10; } /* Default */ .tabs_default { --tabs-count:3; --tabs-margin:3px; --tabs-padding:5px; } .tabs_default .tabs_nav { margin-left: calc(var(--tabs-margin) * -1); margin-right: calc(var(--tabs-margin) * -1); } .tabs_default .tabs_nav_item { background-color: var(--black-100); border-radius: 10px; color: var(--gray-100); flex: 1 1 calc(100% / var(--tabs-count) - var(--tabs-margin) * 2); line-height: 1.2; margin: 0 var(--tabs-margin) calc(var(--tabs-margin) * 2); min-width: 0; padding: var(--tabs-padding) calc(var(--tabs-padding) * 2); text-transform: uppercase; } .tabs_default .tabs_nav_item:before { content: ""; height: 30px; } .tabs_default .tabs_nav_item:hover { background-color: var(--gray-300); } .tabs_default .tabs_nav_item.active { background-color: var(--black-200); color: var(--green); } @media (min-width: 768px) { .tabs_default { --tabs-count:6; --tabs-margin:5px; } .tabs_default .tabs_nav_item { padding-top: calc(var(--tabs-padding) * 3); padding-bottom: calc(var(--tabs-padding) * 3); margin-bottom: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } } @media (min-width: 992px) { .tabs_default { --tabs-margin:15px; } .tabs_default .tabs_nav_item { margin-bottom: 0; } } /* Primary */ .tabs_primary { font-size: 0; margin: 0 -15px -1px; overflow: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; scrollbar-width: none; } .tabs_primary::-webkit-scrollbar { display: none; } .tabs_primary_item { color: var(--gray); font-size: 18px; margin: 0 15px; padding: 20px 0; position: relative; flex: 1 1 auto; } .tabs_primary_item:after { bottom: 0; content: ""; left: 0; position: absolute; right: 0; height: 1px; } .tabs_primary_item:hover { color: var(--white); } .tabs_primary_item:hover:after { background-color: var(--white); } .tabs_primary_item.active { color: var(--green); } .tabs_primary_item.active:after { background-color: var(--green); } /* Secondary */ /* Tabs */ .tabs_secondary { padding-top: 20px; } .tabs_secondary .flickity-viewport { overflow: visible; } .tabs_secondary_item { margin-left: 10px; display: inline-block; } .tabs_secondary_item:first-child { margin-left: 0; } .tabs_secondary_item [type=radio] + label:before, .tabs_secondary_item [type=radio] + label:after { display: none; } .tabs_secondary_item [type=radio] + label { border: 1px solid var(--black-100); background: var(--black-100); border-radius: 15px; text-align: center; font-size: 12px; color: var(--gray-100); padding: 6px 25px; white-space: nowrap; } .tabs_secondary_item [type=radio]:checked + label { background: transparent; border-color: rgba(var(--green-rgb), 0.3); color: var(--green); } .tabs_secondary_item:hover [type=radio] + label { background: var(--black-300); border-color: var(--black-300); } @media (min-width: 768px) { .tabs_secondary_item [type=radio] + label { min-width: 90px; } .tabs_secondary .flickity-viewport { overflow: hidden; } } @media (min-width: 992px) { .tabs_secondary { padding-top: 0; } } @media (min-width: 1440px) { .tabs_secondary_item [type=radio] + label { min-width: 100px; } } /***************/ /* Tabs nav #1 */ /***************/ .tabs_nav_1 { border-bottom-width: 1px; border-style: solid; /*.container { overflow: auto; -webkit-overflow-scrolling: touch; &:after { content: ''; width: 20px; } }*/ } .tabs_nav_1 .flickity-viewport { overflow: visible; } .tabs_nav_1_item { font-size: 18px; color: var(--gray-100); padding: 10px 0; position: relative; margin-right: 40px; text-decoration: none; white-space: nowrap; text-align: left; } .tabs_nav_1_item:after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; border-bottom: 1px solid transparent; } .tabs_nav_1_item.active { color: var(--green); font-weight: 700; } .tabs_nav_1_item.active:after { border-bottom-color: var(--green); } @media (min-width: 768px) { .tabs_nav_1_item { min-width: 160px; font-size: 24px; text-decoration: none; } } /*************/ /* Load more */ /*************/ .load_more { font-size: 16px; color: var(--gray-100); text-transform: uppercase; font-weight: 700; background: var(--black-300); padding: 20px; cursor: pointer; } .load_more .icon { margin-left: 15px; stroke: var(--gray-100); } .load_more:hover { color: var(--green); } .load_more:hover .icon { stroke: var(--green); } /*********/ /* Timer */ /*********/ .timer { overflow: hidden; font-size: 24px; font-weight: 700; } .timer_item { position: relative; border-radius: 10px; color: var(--green); padding: 5px; display: flex; align-items: center; justify-content: center; min-width: 50px; height: 60px; } .timer_item:before, .timer_item:after { content: ""; } .timer_item:before { background: rgba(var(--white-rgb), 0.05); border-radius: 10px 10px 0 0; bottom: 50%; margin-bottom: 1px; } .timer_item:after { background: rgba(var(--white-rgb), 0.1); border-radius: 0 0 10px 10px; margin-top: 1px; top: 50%; } .timer_item > div { position: relative; z-index: 10; } .timer_item_single { padding-left: 45px; padding-right: 45px; } .timer_delimiter { color: rgba(var(--white-rgb), 0.05); margin: 0 5px; } .timer_compact .timer_item { color: var(--white); height: 30px; min-width: 30px; padding: 0; white-space: nowrap; } .timer_compact .timer_item:before, .timer_compact .timer_item:after { display: none; } .timer_compact .timer_item_single { padding-left: 0; padding-right: 0; } /***************/ /* Tiny slider */ /***************/ .tns-visually-hidden { display: none; } .tns-outer { position: relative; } .tns-item:focus { outline: none; } .tns-nav { text-align: center; display: flex; align-items: center; min-height: 50px; justify-content: center; flex-wrap: wrap; padding: 0 40px; } .tns-nav button { padding: 6px; position: relative; margin: 7px; } .tns-nav button:before { content: ""; width: 12px; height: 12px; display: block; background: var(--black-100); border: 1px solid var(--gray-300); border-radius: 50%; } .tns-nav button.tns-nav-active:before { background: var(--green); border-color: var(--green); } .tns-controls button { font-size: 0; padding: 20px 15px; position: absolute; bottom: 0; background: var(--black-100); } .tns-controls button:before { content: ""; display: block; width: 10px; height: 10px; border-left: 2px solid var(--gray-100); border-bottom: 2px solid var(--gray-100); } .tns-controls [data-controls=prev] { left: 0; } .tns-controls [data-controls=prev]:before { transform: rotate(45deg); } .tns-controls [data-controls=next] { right: 0; } .tns-controls [data-controls=next]:before { transform: rotate(225deg); } .flickity_carousel .flickity-slider { display: flex; } .flickity_carousel .flickity-viewport { overflow: visible; } .flickity_carousel .flickity-prev-next-button { font-size: 0; padding: 20px 15px; position: absolute; bottom: 0; background: var(--black-100); top: auto; transform: none; z-index: 10; width: auto; height: auto; } .flickity_carousel .flickity-prev-next-button:before { content: ""; display: block; width: 10px; height: 10px; border-left: 2px solid var(--gray-100); border-bottom: 2px solid var(--gray-100); } .flickity_carousel .flickity-prev-next-button svg { display: none; } .flickity_carousel .flickity-prev-next-button.previous { left: -30px; border-radius: 0 25px 25px 0; } .flickity_carousel .flickity-prev-next-button.previous:before { transform: rotate(45deg); } .flickity_carousel .flickity-prev-next-button.next { right: -30px; border-radius: 25px 0 0 25px; } .flickity_carousel .flickity-prev-next-button.next:before { transform: rotate(225deg); } .flickity_carousel .flickity-page-dots { text-align: center; display: flex; align-items: center; min-height: 50px; justify-content: center; flex-wrap: wrap; padding: 0 40px; position: relative; top: 0; margin-top: 50px; } .flickity_carousel .flickity-page-dots .dot { padding: 6px; position: relative; margin: 7px; background: transparent; width: auto; height: auto; opacity: 1; } .flickity_carousel .flickity-page-dots .dot:before { content: ""; width: 12px; height: 12px; display: block; background: var(--black-100); border: 1px solid var(--gray-300); border-radius: 50%; } .flickity_carousel .flickity-page-dots .dot.is-selected:before { background: var(--green); border-color: var(--green); } /* Copy code box */ .copy_code_box { background: var(--black-500); border-radius: 5px; border: 1px dashed var(--green); max-width: 460px; padding: 12px 20px 12px 25px; } .copy_code_box_field { border-bottom-color: transparent; font-size: 26px; font-weight: 900; letter-spacing: 0.15em; } .copy_code_box_field:focus { border-color: transparent; } .copy_code_box_trigger { cursor: pointer; } /***************/ /* Cicle timer */ /***************/ .circle_timer svg { bottom: 5px; left: 5px; position: absolute; right: 5px; top: 5px; } .circle_timer circle { color: var(--green); stroke-width: 3; fill-opacity: 0; stroke-linecap: round; stroke: currentColor; stroke-dasharray: 298.5; stroke-dashoffset: 298.5; fill-opacity: 0; transition: 0.35s stroke-dashoffset; transform: rotate(-90deg); transform-origin: 50% 50%; } .circle_timer_item { position: relative; -webkit-backdrop-filter: blur(25px); backdrop-filter: blur(25px); background: rgba(var(--black-400-rgb), 0.01); border-radius: 50%; border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 6px 50px rgba(var(--white-rgb), 0.05); } .circle_timer_item:before { content: ""; padding-bottom: 100%; } .circle_timer_inner { position: relative; text-align: center; } .circle_timer_value { color: var(--white); font-size: 38px; font-weight: 700; } .circle_timer_label { font-size: 14px; } @media (min-width: 992px) { .circle_timer svg { bottom: 10px; left: 10px; position: absolute; right: 10px; top: 10px; } .circle_timer circle { stroke-width: 5; } .circle_timer_value { font-size: 64px; } .circle_timer_label { font-size: 18px; } } /******************/ /* Cookie message */ /******************/ .cookie_message { position: fixed; left: 0; right: 0; bottom: 0; background: var(--black-500); z-index: 200; opacity: 0; visibility: hidden; } .cookie_message.s-active { opacity: 0.9; visibility: visible; } /********************/ /* Combined heading */ /********************/ .combined_heading { line-height: 1; font-size: 16px; font-weight: 900; text-transform: uppercase; } .combined_heading span { display: inline-block; position: relative; } .combined_heading .part_1 { font-size: 3em; background: linear-gradient(268.78deg, #5CE02E 0.01%, #E6C35C 49.48%, #DC2958 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; text-shadow: 0px 2.31171px 23.1171px rgba(var(--black-rgb), 0.3); letter-spacing: 0.03em; } .combined_heading .part_2 { display: block; font-size: 4em; text-shadow: 0px 2.92494px 29.2494px rgba(var(--black-rgb), 0.3); margin: -0.35em 0 -0.1125em; z-index: 10; } .combined_heading .part_3 { font-size: 1.5em; background: linear-gradient(180deg, #484848 0%, var(--white) 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: #bbb; letter-spacing: 0.003em; } @media (min-width: 768px) { .combined_heading .part_1 { font-size: 4em; } .combined_heading .part_2 { font-size: 7em; text-shadow: 0px 6.55499px 65.5499px rgba(var(--black-rgb), 0.3); } .combined_heading .part_3 { font-size: 2.2em; } } @media (min-width: 1200px) { .combined_heading .part_1 { font-size: 6em; } .combined_heading .part_2 { font-size: 9em; } .combined_heading .part_3 { font-size: 4em; } } /****************/ /* Paar heading */ /****************/ /*.paar_heading { .flag { display: flex; align-items:center; height: 30px; &:first-child { position: relative; z-index: 10; } &:last-child { margin-left: 15px; margin-top: -15px; } } .icon { width: 45px; height: 45px; display: block; } }*/ .flags { padding: 6px; } .flags .icon { border-radius: 6px; } .flags > .icon { width: 52px; height: 52px; } .flags .icon-fallback { display: flex; align-items: center; justify-content: center; border: 1px solid var(--gray-200); background-color: var(--black-300); color: var(--gray-100); font-size: 13px; font-weight: 500; line-height: 1; overflow: hidden; } .flags .flag .icon { width: 32px; height: 32px; } .flags .flag .icon-fallback { font-size: 10px; } .flags .flag:first-child { position: relative; z-index: 10; } .flags .flag:last-child { margin: -12px 0 0 20px; } @media (max-width: 991.98px) { .paar_heading h2 { font-size: 24px; } } /* Accordion */ .accordion-item { border-bottom: 1px solid var(--gray-200); cursor: pointer; } .accordion-item .icon-chevron { fill: currentColor; } .accordion-content { overflow: hidden; } .content-collapsed .accordion-item { background-color: var(--black-100); } .content-collapsed .accordion-item:hover { background-color: var(--black-400); color: var(--white); } .content-collapsed .accordion-content { max-height: 0 !important; } .content-expanded .accordion-item { color: var(--green); border-bottom-color: var(--green); } .content-expanded .accordion-item .icon-chevron { transform: scaleY(-1); } .content-expanded .accordion-content { transition: 0.3s; } /* Extra content */ .content-collapsed [data-content-container], .content-collapsed [data-content-trigger] .icon, .content-collapsed [data-content-spacer], .content-expanded [data-content-container], .content-expanded [data-content-trigger] .icon, .content-expanded [data-content-spacer] { transition: 0.35s cubic-bezier(0.4, 0, 0.6, 1); } .content-collapsed [data-content-container] { max-height: 0 !important; overflow: hidden; } .content-collapsed [data-content-spacer] { opacity: 0; } @media (min-width: 992px) { .content-collapsed [data-content-container][data-expand-lg] { max-height: unset !important; } .content-collapsed [data-content-container][data-expand-lg] [data-content-spacer] { opacity: 1; } } .content-expanded [data-content-trigger] .btn .icon { transform: scaleY(-1); } /* Mobile footer navigation */ .mobile_footer_nav { background: var(--black-500); bottom: 0; left: 0; line-height: 1; position: fixed; right: 0; z-index: 50; border-radius: 24px 24px 0 0; overflow: hidden; } .mobile_footer_nav.dropdownbox-open { background: var(--black-500); } .mobile_footer_nav ul { display: flex; flex-wrap: wrap-reverse; flex-direction: row-reverse; justify-content: flex-end; } .mobile_footer_nav li { align-items: center; display: flex; flex-direction: column; flex: 1 1 20%; justify-content: center; padding: 10px; position: relative; min-width: 0; max-width: 20%; } .mobile_footer_nav li:nth-child(1), .mobile_footer_nav li:nth-child(2), .mobile_footer_nav li:nth-child(3), .mobile_footer_nav li:nth-child(4), .mobile_footer_nav li:nth-child(5) { display: flex !important; } .mobile_footer_nav:not(.dropdownbox-open) li { display: none; } .mobile_footer_nav a, .mobile_footer_nav button { color: var(--gray); color: var(--gray-100); display: block; font-size: 10px; text-align: center; text-decoration: none; } .mobile_footer_nav a div, .mobile_footer_nav button div { position: relative; } .mobile_footer_nav .icon { fill: var(--gray-100); stroke: var(--gray-100); margin-bottom: 6px; width: 24px; height: 24px; } .mobile_footer_nav .dot { background: var(--green); border-radius: 100%; height: 5px; position: absolute; right: 0; top: 0; width: 5px; } .mobile_footer_nav .active { background: rgba(var(--green-rgb), 0.03); color: rgba(var(--green-rgb), 0.6); } .mobile_footer_nav .active .icon { fill: var(--green); stroke: var(--green); } /* Authors */ .author_card_photo { flex-shrink: 0; } .author_card_photo img { width: 72px; height: 72px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } .author_byline_photo { flex-shrink: 0; } .author_byline_photo img { width: 32px; height: 32px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } .author_profile_photo { flex-shrink: 0; } .author_profile_photo img { width: 160px; height: 160px; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } @media (max-width: 575px) { .author_profile_photo img { width: 110px; height: 110px; } } /* Карточку статьи целиком накрывает ссылка на статью: без своего контекста наложения имя автора внутри неё было бы некликабельным. */ .author_link { position: relative; z-index: 1; } /* Карточка статьи в списках: блог, страница автора, новости на главной. Точка отсчёта для растянутой ссылки задана здесь, а не в секции .ov_3, как было раньше. Тот класс стоит только на /forex-blog, и на странице автора ссылка считала размеры от колонки со всем списком: накрывала его целиком, и все пятнадцать карточек вели на одну статью. */ .post_card { position: relative; } /* Колонки Bootstrap позиционированы по умолчанию, и растянутая ссылка мерила бы себя по своей колонке: заголовок и анонс нажимались бы, а картинка в соседней колонке — нет. Внутри карточки абсолютных элементов нет, отсчёт им не нужен. */ .post_card > .col, .post_card > [class*=col-] { position: static; } /* Ссылка на статью растягивается на карточку псевдоэлементом, а не отдельным пустым оверлеем: у ссылки должен быть текст анкора, иначе поисковику нечего прочитать, а скринридер объявляет её без назначения. Второй ссылкой с тем же адресом это делать нельзя — дубль хуже, чем было. */ .post_card_link { color: inherit; text-decoration: none; } .post_card_link:hover { color: inherit; text-decoration: none; } .post_card_link:after { content: ""; position: absolute; inset: 0; z-index: 1; } /* Рубрика, автор и «поделиться» лежат под растянутой ссылкой и без своего уровня перестали бы нажиматься. */ .post_card footer a, .post_card .btn-share { position: relative; z-index: 2; } /* На узком экране дата, рубрика, автор и кнопка в одну строку не помещаются, и flex дожимал их до нечитаемого: имя автора оставалось 16px при собственной ширине 95px, рубрика — 28px вместо 168px. Переносим строку вместо этого; на широком экране всё помещается по-прежнему, и правило ничего не меняет. */ .post_card footer { flex-wrap: wrap; } /* Article widgets (shortcodes) */ .article_widget { max-width: 100%; } /* Высоту графика в статье задаёт вёрстка, а не экран: блок стоит внутри колонки текста и не должен выталкивать абзацы. */ .article_chart { height: 420px; position: relative; overflow: hidden; } .article_chart iframe { max-height: 100%; } @media (max-width: 767px) { .article_chart { height: 320px; } } .article_widget_placeholder { min-height: 200px; } /* Таблицы прогноза (шоткоды forecast-table-*): своей разметки таблиц в проекте нет — из Bootstrap подключены только сетка и flex-утилиты, — а голый нечитаем на тёмном фоне. Стили минимальны и используют уже существующие цветовые переменные сайта, без новых значений. */ .forecast_table_wrap { overflow-x: auto; } .forecast_table { width: 100%; border-collapse: collapse; /* На телефоне (контейнер ~255px) четыре колонки с ценами не помещаются в одну строку: компактные поля и шрифт, перенос разрешён, чтобы последняя колонка не уезжала за горизонтальный скролл. */ } .forecast_table th, .forecast_table td { padding: 8px 10px; text-align: left; white-space: nowrap; border-bottom: 1px solid var(--gray-200); } .forecast_table th { font-weight: 400; } @media (max-width: 767.98px) { .forecast_table th, .forecast_table td { padding: 6px 4px; font-size: 12px; white-space: normal; } } /* Долгосрочный и годовой графики прогноза (forecast-chart-*): SVG рисуется сервером и сам задаёт себе высоту через viewBox, блоку нужна только ширина. */ .article_widget_forecast_chart svg { max-width: 100%; } /* Общее у виджетов прогноза: вывод над таблицей/графиком, плашка изменения к сегодняшней цене, легенда и полоски диапазона. Цвет прогноза — --forecast (жёлтый, в светлой теме — тёмное золото), рост и падение — --green/--red, как цены покупки и продажи в виджете цены. */ .forecast_sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .forecast_head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 24px; } .forecast_head_text { min-width: 0; flex: 1 1 320px; } .forecast_chip { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 4px 12px; border-radius: 15px; font-size: 14px; line-height: 1.3; white-space: nowrap; } .forecast_chip_up { background: rgba(var(--green-rgb), 0.12); color: var(--green); } .forecast_chip_down { background: rgba(var(--red-rgb), 0.12); color: var(--red); } .forecast_chip_flat { background: var(--black-100); color: var(--white); } .forecast_chip_arrow { font-size: 10px; } .forecast_value { color: var(--forecast); } .forecast_change { white-space: nowrap; } .forecast_change_up { color: var(--green); } .forecast_change_down { color: var(--red); } .forecast_legend { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 12px 0 0; padding: 0; list-style: none; font-size: 12px; color: var(--gray); } .forecast_legend_item { display: inline-flex; align-items: center; gap: 8px; } /* Список статьи даёт каждому li отступ и маркер «•» в ::before — у легенды свои значки, маркер и отступ снимаются. */ .article_widget ul.forecast_legend > li.forecast_legend_item { margin: 0; padding: 0; } .article_widget ul.forecast_legend > li.forecast_legend_item::before { content: none; display: none; } .forecast_legend_mark { display: inline-block; flex: none; /* Как линия типичного сценария в ForecastChartSvg: полупрозрачный пунктир цвета факта. */ } .forecast_legend_mark_actual { width: 20px; border-top: 2px solid var(--white); } .forecast_legend_mark_forecast { width: 20px; border-top: 2px dashed var(--forecast); } .forecast_legend_mark_path { width: 20px; border-top: 1.5px dashed rgba(var(--white-rgb), 0.75); } .forecast_legend_mark_scenario, .forecast_legend_mark_trading { width: 16px; height: 10px; border-radius: 2px; background: rgba(var(--forecast-rgb), 0.16); } .forecast_legend_mark_trading { background: rgba(var(--forecast-rgb), 0.45); } .forecast_legend_mark_average { width: 10px; height: 10px; border-radius: 50%; background: var(--forecast); } .forecast_legend_mark_today { height: 12px; border-left: 1px dashed var(--white); } /* Полоска строки таблицы: вилка сценариев, торговый диапазон, средний прогноз точкой и сегодняшняя цена вертикалью. Позиции — инлайн в процентах общей шкалы виджета. */ .forecast_strip { position: relative; height: 16px; min-width: 120px; } .forecast_strip_band, .forecast_strip_range { position: absolute; top: 3px; height: 10px; border-radius: 2px; background: rgba(var(--forecast-rgb), 0.16); } .forecast_strip_range { background: rgba(var(--forecast-rgb), 0.45); } .forecast_strip_today { position: absolute; top: -4px; bottom: -4px; width: 1px; background: rgba(var(--white-rgb), 0.6); } .forecast_strip_avg { position: absolute; top: 3px; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: var(--forecast); box-shadow: 0 0 0 2px var(--black-300); } .forecast_table_strips { /* На телефоне полоска уходит отдельной строкой под данными: строка с ценами теряет свою черту, черта остаётся под полоской. */ } .forecast_table_strips .text-right { text-align: right; } .forecast_table_strips .forecast_table_strip_cell { width: 36%; } @media (max-width: 767.98px) { .forecast_table_strips .forecast_table_data td { border-bottom: 0; } .forecast_table_strips .forecast_table_strip_row td { padding-top: 2px; padding-bottom: 10px; } } /* Карточка-вывод (forecast-summary). Вкладки — радиокнопки: :checked у n-й кнопки показывает n-ю панель и подсвечивает n-ю вкладку. Вид вкладок — как у .tabs_secondary_item. Горизонтов не больше четырёх. */ .forecast_summary_today { text-align: right; } @media (max-width: 767.98px) { .forecast_summary_today { text-align: left; } } .forecast_summary_tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; } .forecast_summary_tab { min-width: 90px; padding: 6px 20px; border: 1px solid var(--black-100); border-radius: 15px; background: var(--black-100); color: var(--gray); font-size: 13px; text-align: center; white-space: nowrap; cursor: pointer; transition: background-color 0.15s, border-color 0.15s, color 0.15s; } .forecast_summary_tab:hover { border-color: var(--gray-300); background: var(--gray-300); color: var(--white); } .forecast_summary_panel { display: none; } .forecast_summary_input:nth-of-type(1):checked ~ .forecast_summary_panels .forecast_summary_panel:nth-child(1) { display: block; } .forecast_summary_input:nth-of-type(1):checked ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(1) { border-color: rgba(var(--green-rgb), 0.3); background: transparent; color: var(--green); } .forecast_summary_input:nth-of-type(1):focus-visible ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(1) { outline: 2px solid var(--green); outline-offset: 2px; } .forecast_summary_input:nth-of-type(2):checked ~ .forecast_summary_panels .forecast_summary_panel:nth-child(2) { display: block; } .forecast_summary_input:nth-of-type(2):checked ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(2) { border-color: rgba(var(--green-rgb), 0.3); background: transparent; color: var(--green); } .forecast_summary_input:nth-of-type(2):focus-visible ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(2) { outline: 2px solid var(--green); outline-offset: 2px; } .forecast_summary_input:nth-of-type(3):checked ~ .forecast_summary_panels .forecast_summary_panel:nth-child(3) { display: block; } .forecast_summary_input:nth-of-type(3):checked ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(3) { border-color: rgba(var(--green-rgb), 0.3); background: transparent; color: var(--green); } .forecast_summary_input:nth-of-type(3):focus-visible ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(3) { outline: 2px solid var(--green); outline-offset: 2px; } .forecast_summary_input:nth-of-type(4):checked ~ .forecast_summary_panels .forecast_summary_panel:nth-child(4) { display: block; } .forecast_summary_input:nth-of-type(4):checked ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(4) { border-color: rgba(var(--green-rgb), 0.3); background: transparent; color: var(--green); } .forecast_summary_input:nth-of-type(4):focus-visible ~ .forecast_summary_tabs .forecast_summary_tab:nth-child(4) { outline: 2px solid var(--green); outline-offset: 2px; } .forecast_summary_target { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 8px; } .forecast_summary_price { color: var(--forecast); font-size: 36px; line-height: 1; font-variant-numeric: tabular-nums; } @media (max-width: 767.98px) { .forecast_summary_price { font-size: 30px; } } .forecast_summary_scale_head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-top: 24px; } .forecast_summary_uncertainty { display: inline-flex; align-items: center; gap: 8px; } .forecast_meter { display: inline-flex; gap: 3px; } .forecast_meter_step { width: 12px; height: 6px; border-radius: 1px; background: var(--gray-200); } .forecast_meter_step_on { background: var(--white); } /* Шкала карточки: подпись среднего прогноза над полосой, сегодняшней цены — под ней, чтобы не налезали друг на друга, когда значения близко. */ .forecast_summary_scale { position: relative; height: 84px; margin-top: 12px; } .forecast_summary_scale_track { position: absolute; top: 34px; right: 0; left: 0; height: 8px; border-radius: 4px; background: var(--black-100); } .forecast_summary_scale_band, .forecast_summary_scale_range { position: absolute; top: 30px; height: 16px; border-radius: 3px; background: rgba(var(--forecast-rgb), 0.22); } .forecast_summary_scale_range { background: rgba(var(--forecast-rgb), 0.5); } .forecast_summary_scale_today { position: absolute; top: 22px; width: 2px; height: 32px; margin-left: -1px; background: var(--white); } .forecast_summary_scale_base { position: absolute; top: 29px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: var(--forecast); box-shadow: 0 0 0 3px var(--black-300); } .forecast_summary_scale_label { position: absolute; transform: translateX(-50%); font-size: 12px; white-space: nowrap; } .forecast_summary_scale_label_base { top: 0; color: var(--forecast); } .forecast_summary_scale_label_today { top: 60px; color: var(--white); } .forecast_summary_scale_label_start { transform: none; } .forecast_summary_scale_label_end { transform: translateX(-100%); } .forecast_summary_cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 20px; } @media (max-width: 767.98px) { .forecast_summary_cases { grid-template-columns: minmax(0, 1fr); } } .forecast_summary_case { padding: 14px 16px; border-radius: 5px; background: var(--black-100); } .forecast_summary_case_dot { display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; } .forecast_summary_case_dot_down { background: var(--red); } .forecast_summary_case_dot_base { background: var(--forecast); } .forecast_summary_case_dot_up { background: var(--green); } /* Single chart */ .single_chart { height: 75vh; max-height: 450px; position: relative; overflow: hidden; } .single_chart iframe { max-height: 100%; } /* Dropdown menu */ .dropdown-menu { position: relative; } .dropdown-menu:hover .dropdown-menu-dropdown { opacity: 1; visibility: visible; transform: translateX(0); transition: all 0.25s; } .dropdown-menu-dropdown { position: absolute; top: -20px; right: 100%; border-radius: 12px; z-index: 10; opacity: 0; visibility: hidden; transform: translateX(15px); transition: all 0.15s; min-width: 300px; } /* Block title */ .block-title { font-size: calc(2.565rem + 9.8625vw); color: rgba(var(--white-rgb), 0.03); font-weight: 900; white-space: nowrap; } @media (min-width: 1200px) { .block-title { font-size: 14.4rem; } } /* Progressbar */ .progressbar { background-color: var(--black-500); border-radius: 1rem; height: 0.75rem; display: flex; } .progressbar-inner { background: linear-gradient(90deg, #D92252 0%, #B9BC22 30%, #36C006 100%) no-repeat; border-radius: inherit; } /* Blurred text */ .text-blurred [data-text] { filter: blur(8px); transition: filter 0.35s; will-change: filter; } .text-blurred [data-trigger] svg + svg { display: none; } .text-blurred:has(:checked) [data-trigger] svg:first-child { display: none; } .text-blurred:has(:checked) [data-trigger] svg + svg { display: block; } .text-blurred:has(:checked) [data-text] { filter: none; } /* Star rating */ .star-rating { display: flex; flex-direction: row-reverse; justify-content: flex-end; } .radio-input { position: fixed; opacity: 0; pointer-events: none; } .radio-label { cursor: pointer; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37 36'%3E%3Cpath stroke='transparent' d='M4.5 36c-1.1 0-2.042-.392-2.825-1.175C.892 34.042.5 33.1.5 32V4c0-1.1.392-2.042 1.175-2.825C2.458.392 3.4 0 4.5 0h28c1.1 0 2.042.392 2.825 1.175C36.108 1.958 36.5 2.9 36.5 4v28c0 1.1-.392 2.042-1.175 2.825C34.542 35.608 33.6 36 32.5 36h-28Zm8.15-9.5 5.85-3.55 5.85 3.55-1.55-6.65 5.2-4.5-6.85-.55-2.65-6.3-2.65 6.3-6.85.55 5.2 4.5-1.55 6.65Z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37 36'%3E%3Cpath stroke='transparent' d='M4.5 36c-1.1 0-2.042-.392-2.825-1.175C.892 34.042.5 33.1.5 32V4c0-1.1.392-2.042 1.175-2.825C2.458.392 3.4 0 4.5 0h28c1.1 0 2.042.392 2.825 1.175C36.108 1.958 36.5 2.9 36.5 4v28c0 1.1-.392 2.042-1.175 2.825C34.542 35.608 33.6 36 32.5 36h-28Zm8.15-9.5 5.85-3.55 5.85 3.55-1.55-6.65 5.2-4.5-6.85-.55-2.65-6.3-2.65 6.3-6.85.55 5.2 4.5-1.55 6.65Z'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: 50%; mask-position: 50%; -webkit-mask-size: contain; mask-size: contain; transition: all 0.1s ease-in-out; flex-grow: 1; aspect-ratio: 1; background-color: var(--gray-100); font-size: 0; } .star-rating:not(:hover) .radio-input:checked ~ .radio-label { background-color: var(--green); } .radio-label:hover, .radio-label:hover ~ .radio-label { background-color: var(--green); } /********/ /* Form */ /********/ .form h2 { margin-bottom: 30px; } .form_row { margin-bottom: 30px; position: relative; } .form_row .tooltip { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .form_row .tooltip .icon { width: 20px; height: 20px; } .form_row_selectbox { background: var(--black-300); border-radius: 10px; padding: 20px; } .form_row_border { height: 1px; background: var(--black-200); } .form_row_buttons { display: flex; flex-wrap: wrap; } .form_row_buttons .btn { flex: 1 1 100%; } .form_row_buttons .btn + .btn { margin-top: 20px; } .form_row_buttons .reset { color: var(--gray-100); font-size: 12px; letter-spacing: 0; padding: 5px; cursor: pointer; margin-top: 20px; margin-left: 20px; } .form_row_buttons .reset .icon { stroke: var(--gray-100); stroke-width: 2px; width: 20px; height: 20px; padding: 5px; border-radius: 100%; background-color: var(--gray-300); margin-left: 10px; } .form_row_buttons .reset:hover .icon { background-color: var(--black-300); } .form_row_links a { display: inline-block; vertical-align: top; margin: 5px 0; } @media (min-width: 768px) { .form_row_buttons .reset { margin: 0 -5px 20px auto; } } .form_box { background: var(--black-100); } .form_box :-webkit-autofill, .form_box :-webkit-autofill:hover, .form_box :-webkit-autofill:focus { -webkit-text-fill-color: var(--white); -webkit-box-shadow: 0 0 0px 1000px var(--black-100) inset; -webkit-transition: background-color 5000s ease-in-out 0s; transition: background-color 5000s ease-in-out 0s; font-size: 20px; border-color: var(--black-100) var(--black-100) var(--gray) var(--black-100); } .form_box_round { border-radius: 10px; } .form_card { background: rgba(var(--white-rgb), 0.03); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); } .form_card .btn-primary, .form_card .tabulator .tabulator-footer .tabulator-paginator button, .tabulator .tabulator-footer .tabulator-paginator .form_card button { background-color: rgba(var(--white-rgb), 0.03); border-color: rgba(var(--white-rgb), 0.5); } .form_card .btn-primary:hover, .form_card .tabulator .tabulator-footer .tabulator-paginator button:hover, .tabulator .tabulator-footer .tabulator-paginator .form_card button:hover { background-color: rgba(var(--white-rgb), 0.05); border-color: rgba(var(--white-rgb), 1); } .form_card_header { background: rgba(var(--white-rgb), 0.05); border-radius: 10px 10px 0 0; } .form_card_header h2 { font-size: 18px; } .form_card_separator_wrapper { overflow: hidden; } .form_card_separator { position: relative; } .form_card_separator:before, .form_card_separator:after { content: ""; position: absolute; top: 50%; width: 200%; border-bottom: 1px solid rgba(var(--white-rgb), 0.1); } .form_card_separator:before { right: 100%; margin-right: 10px; } .form_card_separator:after { left: 100%; margin-left: 10px; } @media (max-width: 767.98px) { .form_card .radio [type=radio] + label, .form_card .checkbox [type=checkbox] + label { font-size: 10px; } } @media (min-width: 768px) { .form_card_header h2 { font-size: 24px; } } .form_info { font-size: 12px; color: var(--gray-100); letter-spacing: 0; } .form_info .icon_warning { opacity: 0.05; width: 50px; height: 50px; margin-right: 15px; flex: 1 0 50px; flex-grow: 0; } .form_info ol { list-style: decimal; margin-left: 20px; } .form_row .form_info { padding-top: 10px; } .form_row .form_info:empty { display: none; } .error .form_info { color: rgba(var(--red-rgb), 1); } .success .form_info { color: var(--green); } .form_label { position: relative; z-index: 10; } .form_row .form_field .selectbox, .form_row .form_field .inputbox { margin-bottom: 0; } .form_row a:not(.btn) .icon { margin-right: 15px; fill: var(--gray-100); width: 20px; height: 20px; } .form_row .arrow_1 { width: 30px; height: 30px; } .form_row_search { position: relative; } .form_row_search input { padding-left: 35px; } .form_row_search .form_button { position: absolute; left: 0; bottom: 0; width: 44px; height: 44px; } .form_row_search button { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; border: none; box-shadow: none; cursor: pointer; width: 100%; height: 100%; padding: 0; } .form_row_search button .icon { fill: var(--gray-100); width: 20px; height: 20px; position: absolute; left: 0; top: 50%; transform: translate(0, -50%); } .form_row .form_field_description { padding-top: 10px; } .form_row .form_field_description:empty { display: none; } .form_field_description { display: flex; font-size: 12px; line-height: 1.4; color: var(--gray-100); letter-spacing: 0; } .form_field_description .icon { width: 20px; height: 20px; fill: var(--green); flex: 0 0 20px; margin-right: 15px; } .form_field_description .icon + span { position: relative; top: 2px; } .form_field_icon { position: relative; } .form_field_icon .icon { position: absolute; right: 10px; top: 10px; width: 20px; height: 20px; fill: var(--gray); } .form_field_icon input { padding-right: 40px; } .form_field_dash { color: var(--white); font-size: 18px; letter-spacing: 0; font-weight: 400; position: absolute; left: 100%; top: 50%; transform: translateY(-50%); margin-left: -3px; } @media (max-width: 767.98px) { .form_row_save_billing { margin: 0 -20px; padding: 10px 20px; background: var(--black-200); } } @media (min-width: 576px) { .form_row_buttons { margin: 0 -10px 10px; flex-wrap: nowrap; } .form_row_buttons .btn { margin: 0 10px 20px; flex: 0 1 auto; white-space: nowrap; min-width: 0; /*max-width: 250px;*/ } .form_row_buttons .btn + .btn { margin-top: 0; } } @media (min-width: 768px) { .form_row { margin-bottom: 50px; } .form_row_last { margin-bottom: 0; } .form_row_buttons { margin-bottom: 30px; } } @media (min-width: 992px) { .form h2 { margin-bottom: 35px; } .form_row_selectbox { padding: 40px 50px; } } @media (min-width: 1200px) { .form_row .arrow_1 { width: 20px; height: 20px; transform: rotate(-90deg) translate(-50%, -50%); position: absolute; left: 50%; top: 50%; } } /*********/ /* Popup */ /*********/ .popup { backface-visibility: hidden; background: var(--black-300); left: 0; pointer-events: none; position: fixed; right: 0; top: 0; height: 100%; transform: perspective(1px) translate(100%, 0); transition: transform 0.2s ease-in-out; z-index: 900; overflow: hidden; } .popup:has(#holiday-gift) { border-radius: 2.5rem; } @media (min-width: 768px) { .popup:has(#holiday-gift) { left: 0; margin: auto; max-height: 58rem; min-width: 110rem; border-radius: 5.5rem; top: 0; bottom: 0; } } .popup:has(#holiday-gift) .popup_close_trigger { background: transparent; } @media (min-width: 768px) { .popup:has(#holiday-gift) .popup_close_trigger { left: auto; top: 1em; right: 1em; } } .popup:has(#holiday-gift) .popup_inner { overflow-y: hidden; padding: 2rem 3rem; } .popup_inner { padding: 30px 20px; height: 100%; width: 100%; position: absolute; overflow: auto; -webkit-overflow-scrolling: touch; overflow-anchor: none; } .popup .bg-green-popup:before, .popup .bg-red-popup:before { content: ""; top: -45px; left: -20px; right: -20px; height: 30%; } .popup .bg-green-popup:before { background: linear-gradient(0deg, rgba(var(--green-rgb), 0) 0%, rgba(var(--green-rgb), 0.1) 100%); } .popup .bg-red-popup:before { background: linear-gradient(0deg, rgba(var(--dark-red-rgb), 0) 0%, rgba(var(--red-rgb), 0.1) 100%); } .popup_overlay { background: rgba(var(--black-rgb), 0.65); position: fixed; left: 0; right: 0; top: 0; bottom: 0; opacity: 0; visibility: hidden; transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out; z-index: 100; } .popup_close_trigger { width: 48px; height: 48px; background: var(--black-100); position: absolute; top: 22px; right: 22px; border-radius: 100%; cursor: pointer; opacity: 0; transform: translateX(100%); transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out; transition-delay: 0; z-index: 50; } .popup_close_trigger i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 16px; height: 16px; } .popup_close_trigger i:before, .popup_close_trigger i:after { content: ""; width: 100%; height: 2px; background: var(--white); display: block; position: absolute; left: 0; top: 50%; } .popup_close_trigger i:before { transform: rotate(45deg); } .popup_close_trigger i:after { transform: rotate(-45deg); } .popup-open { overflow: hidden; } .popup-open:has(.popup_inner:not(:empty)) .popup { transform: none; transition: transform 0.25s ease-in-out; pointer-events: all; } .popup-open:has(.popup_inner:not(:empty)) .popup_overlay { opacity: 1; visibility: visible; transition: opacity 0.25s ease-in-out, visibility 0.25s ease-in-out; } .popup-open:has(.popup_inner:not(:empty)) .popup_close_trigger { transform: translateX(0); opacity: 1; transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out; transition-delay: 0.15s; } .popup_body h2, .popup_body .h2 { font-size: 24px; } .popup_body h3 { font-size: 18px; letter-spacing: 0; margin-bottom: 1.675em; } .popup_content { position: relative; max-width: 100%; } .popup_content p { margin-bottom: 30px; } .popup_content p:last-child { margin-bottom: 0; } .popup_content .print_trigger { margin: 40px 0 20px; } .popup_content .documents { margin-bottom: 50px; font-size: 14px; } .popup_content .documents li { margin-bottom: 20px; font-size: 24px; } .popup_content .documents li:last-child { margin-bottom: 0; } .popup_content .documents a { text-decoration: none; } .popup_content .documents a:hover { text-decoration: underline; } .popup_content .documents small { font-size: 14px; } .popup_content .documents p { padding-top: 30px; } .popup_content .requirements { font-size: 18px; margin-bottom: 50px; } .popup_content .requirements li { position: relative; color: var(--white); padding: 2px 0 2px 45px; margin-bottom: 20px; } .popup_content .requirements li:last-child { margin-bottom: 0; } .popup_content .requirements li:before { content: ""; position: absolute; left: 0; top: 0; background: url(/images/icons/icons.svg#check-green-circle) no-repeat 50% 50%/contain; width: 25px; height: 25px; } .popup_content .requirements small { font-size: 12px; color: var(--gray); } .popup_header { margin-bottom: 50px; padding-right: 80px; } .popup_header h2, .popup_header .h2 { font-size: 24px; margin-bottom: 20px; } .popup_header h2:last-child { margin-bottom: 0; } .popup_header .infobox { margin-bottom: 0; } .popup_footer { height: 150px; min-height: 150px; position: relative; } .popup_footer .icon { width: 120px; height: 120px; position: absolute; right: 0; bottom: 0; fill: var(--black-200); } .popup_big_label { font-size: 3em; font-weight: 700; margin-bottom: 30px; } .popup_text { color: var(--white); margin-bottom: 30px; } .popup_text ol { margin: 0 0 2.75em 25px; list-style: decimal; font-size: 16px; } .popup_text ol li { margin-bottom: 10px; } .popup_text ol small { font-size: 0.75em; color: var(--gray-100); } .popup_columns { margin: 0 -35px; } .popup_columns > div { padding-left: 35px; padding-right: 35px; } .popup .form_box_lg { margin-left: -20px; margin-right: -20px; padding-left: 20px; padding-right: 20px; } .popup .chat_trigger { position: relative; left: 0; bottom: 0; } .popup .intro_8 .card_tickets_flat { background: rgba(255, 255, 255, 0.03); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border: none; } .popup .progress_bar { background-color: var(--black-500); } .popup .accordion { margin-left: -20px; margin-right: -20px; } .popup .accordion-item, .popup .accordion-content { padding-left: 20px; padding-right: 20px; } @media (max-width: 1199.98px) { .popup .intro_8 .card_hero .card_text { text-align: left; } .popup .intro_8 .card_hero .card_bg { width: 40%; left: auto; right: 10%; max-width: 175px; } .popup .intro_8 table td:first-child, .popup .intro_8 table th:first-child { padding-left: 35px; } .popup .intro_8 table td:last-child, .popup .intro_8 table th:last-child { padding-right: 35px; } } @media (min-width: 768px) { .popup { max-width: 60%; left: auto; width: 100%; overflow: visible; } .popup_inner { padding: 30px 40px; } .popup_content { font-size: 16px; } .popup_header { padding-right: 0; } .popup_content .print_trigger { margin-bottom: 0; } .popup .form_box_lg { margin-left: -40px; margin-right: -40px; padding-left: 40px; padding-right: 40px; } .popup .bg-green:before, .popup .bg-red:before { top: -60px; left: -40px; right: -40px; } .popup .combined_heading .part_2 { font-size: 5.75em; } .popup .combined_heading .part_3 { font-size: 2em; } .popup .accordion { margin-left: -40px; margin-right: -40px; } .popup .accordion-item, .popup .accordion-content { padding-left: 40px; padding-right: 40px; } } @media (min-width: 992px) { .popup_big_label, .popup_text { margin-bottom: 50px; } .popup .combined_heading .part_2 { font-size: 7em; } .popup .combined_heading .part_3 { font-size: 2.2em; } } @media (min-width: 1200px) { .popup { max-width: 700px; } .popup_inner { padding: 30px 60px; } .popup_footer { height: 270px; min-height: 270px; } .popup_footer .icon { width: 270px; height: 270px; right: -45px; bottom: -45px; } .popup_text { font-size: 20px; } .popup_text small { font-size: 0.7em; } .popup .form_box_lg { margin-left: -60px; margin-right: -60px; padding-left: 60px; padding-right: 60px; } .popup .bg-green:before, .popup .bg-red:before { top: -90px; left: -60px; right: -60px; } .popup .intro_8 .card_tickets { -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; border: none; white-space: nowrap; } .popup .intro_8 .card_tickets br { display: none; } .popup .accordion { margin-left: -60px; margin-right: -60px; } .popup .accordion-item, .popup .accordion-content { padding-left: 60px; padding-right: 60px; } } @media (min-width: 1440px) { .popup_inner { padding: 30px 80px; } .popup .form_box_lg { margin-left: -80px; margin-right: -80px; padding-left: 80px; padding-right: 80px; } .popup .bg-green:before, .popup .bg-red:before { top: -100px; left: -80px; right: -80px; } .popup .accordion { margin-left: -80px; margin-right: -80px; } .popup .accordion-item, .popup .accordion-content { padding-left: 80px; padding-right: 80px; } } #confirm-code .bg { position: absolute; right: 0; top: 150px; height: 738px; width: 70%; background-position: 0 0; } #credit-card .credit_card { margin-right: -20px; } #top-up-balance .payment_card .icon { max-width: 70px; max-height: 70px; width: 10vw; height: 10vw; } #top-up-balance .payment_card:hover { border-color: transparent; background: rgba(var(--white-rgb), 0.07); } @media (min-width: 768px) { #credit-card .credit_card { margin-right: 0; } #top-up-balance .payment_card .icon { width: 4vw; height: 4vw; } } .popup .form_row_border { margin-left: -20px; margin-right: -20px; } @media (min-width: 768px) { .popup .form_row_border { margin-left: -40px; margin-right: -40px; } } @media (min-width: 1200px) { .popup .form_row_border { margin-left: -60px; margin-right: -60px; } } @media (min-width: 1440px) { .popup .form_row_border { margin-left: -95px; margin-right: -95px; } } @media (min-width: 1440px) { .popup .form_row_border { margin-left: -95px; margin-right: -95px; } } #prize-pool-distribution .tournament td:first-child { width: 50%; } #prize-pool-distribution .tournament th:first-child, #prize-pool-distribution .tournament td:first-child { padding-left: 20px; } @media (min-width: 768px) { #prize-pool-distribution .tournament th:first-child, #prize-pool-distribution .tournament td:first-child { padding-left: 40px; } } @media (min-width: 1200px) { #prize-pool-distribution .tournament th:first-child, #prize-pool-distribution .tournament td:first-child { padding-left: 60px; } } @media (min-width: 1440px) { #prize-pool-distribution .tournament { margin-left: -80px !important; margin-right: -80px !important; } #prize-pool-distribution .tournament th:first-child, #prize-pool-distribution .tournament td:first-child { padding-left: 80px; } } /******************/ /* Popup center */ /******************/ .popup-open-center .popup-overlay { opacity: 1; visibility: visible; transition: opacity 0.25s ease-in-out, visibility 0.25s ease-in-out; } .popup-overlay { position: fixed; opacity: 0; visibility: hidden; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); display: flex; justify-content: center; align-items: center; z-index: 999; } .chat { position: fixed; z-index: 100; letter-spacing: 0; font-weight: 400; pointer-events: none; } .chat_overlay { background: rgba(var(--black-rgb), 0.65); opacity: 0; visibility: hidden; transition: all 0.15s; } .chat-open { pointer-events: all; } .chat-open .chat_overlay { opacity: 1; visibility: visible; } .chat-open .chat_container { opacity: 1; visibility: visible; transition-delay: 0.15s; transform: translateX(0); } .chat_trigger { position: absolute; right: 20px; bottom: 20px; background: rgba(var(--green-rgb), 0.1); border-radius: 30px 30px 30px 0px; width: 60px; height: 60px; pointer-events: all; } .chat_trigger .icon { fill: var(--green); stroke: var(--green); width: 22px; height: 22px; margin-top: 5px; } .chat_trigger_count { position: absolute; right: 0; top: 0; border-radius: 20px; background: var(--green); box-shadow: 0px 0px 20px rgba(var(--green-rgb), 0.3); font-weight: 900; text-align: center; font-size: 10px; line-height: 18px; color: #1E4510; letter-spacing: -0.1em; min-width: 18px; padding: 0 3px; } .chat_container { background: var(--black-200); border-radius: 10px; position: absolute; opacity: 0; visibility: hidden; transition: all 0.15s; transform: translateX(10%); } @media (max-width: 767.98px) { .chat-open .chat_trigger { visibility: hidden; } } @media (min-width: 768px) { .chat_container { width: 465px; left: auto; right: 100px; top: 20px; bottom: 20px; } } @media (min-width: 992px) { .chat_trigger { right: 50px; bottom: 50px; } .chat_container { left: auto; top: 50px; bottom: 50px; right: 120px; } } .chat_header { background: var(--black-300); border-radius: 10px 10px 0px 0px; padding: 10px; z-index: 20; } .chat_header_title { flex: 1 1 auto; color: var(--white); font-weight: 700; font-size: 12px; min-width: 0; padding-left: 10px; gap: 3px; } .chat_header_title_row { width: 100%; min-width: 0; gap: 8px; } .chat_header_title_row strong { min-width: 0; font-size: inherit; line-height: 1.2; } .chat_header_labels { gap: 6px; flex: 0 0 auto; padding-left: 10px; padding-right: 10px; } .chat_header_status { width: 100%; min-width: 0; color: var(--gray-100); font-size: 11px; line-height: 1.2; font-weight: 400; gap: 5px; } .chat_header_status_dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 2px rgba(var(--green-rgb), 0.15); flex: 0 0 auto; } .chat_header_status_dot.is-connecting { background: #F7931A; box-shadow: 0 0 0 2px rgba(247, 147, 26, 0.15); animation: chatStatusConnecting 1s ease-in-out infinite; } @keyframes chatStatusConnecting { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } } .chat_header_trigger { width: 30px; height: 30px; } .chat_header_trigger .icon { stroke: var(--gray-100); width: 14px; height: 14px; stroke-width: 2; } .chat_header_trigger:hover .icon { stroke: var(--white); } .chat_header_back .icon { fill: var(--gray-100); stroke: transparent; width: 14px; height: 14px; } .chat_header_back:hover .icon { fill: var(--white); stroke: transparent; } .chat_main { flex: 1 1 auto; min-height: 0; position: relative; } .chat_room_list { display: flex; flex-direction: column; height: 100%; min-height: 0; position: relative; } .chat_room_list .content_scroll_wrapper { flex: 1 1 auto; height: 100%; min-height: 0; } .chat_room_list_inner { padding: 10px; } .chat_room_item { color: var(--gray); width: 100%; min-height: 70px; padding: 10px; border-radius: 8px; text-align: left; transition: background 0.15s; } .chat_room_item:hover, .chat_room_item.is-current { background: var(--black-300); } .chat_room_item + .chat_room_item { margin-top: 4px; } .chat_room_item_avatar { position: relative; width: 44px; height: 44px; border-radius: 50%; margin-right: 10px; flex: 0 0 auto; background-color: var(--gray-200); color: var(--white); font-size: 16px; line-height: 1; font-weight: 700; } .chat_room_item_avatar_letter { text-transform: uppercase; } .chat_room_item_body { min-width: 0; flex: 1 1 auto; } .chat_room_item_header { min-width: 0; margin-bottom: 5px; } .chat_room_item_title { min-width: 0; flex: 1 1 auto; gap: 6px; } .chat_room_item_header strong { color: var(--white); font-size: 13px; line-height: 1.2; font-weight: 700; min-width: 0; flex: 0 1 auto; } .chat_room_item_header time { position: static; margin-left: auto; padding-left: 10px; flex: 0 0 auto; } .chat_room_item_label { display: inline-flex; align-items: center; height: 20px; border: 1px solid var(--gray-200); border-radius: 5px; padding: 0 8px; flex: 0 0 auto; font-size: 10px; line-height: 1; font-weight: 700; text-transform: uppercase; letter-spacing: 0; } .chat_room_item_label_official { border-color: rgba(49, 202, 0, 0.5); background: rgba(49, 202, 0, 0.16); color: var(--green); } .chat_room_item_label_system { border-color: rgba(217, 34, 82, 0.5); background: rgba(217, 34, 82, 0.16); color: #D92252; } .chat_room_item_label_partner { border-color: rgba(66, 133, 244, 0.5); background: rgba(66, 133, 244, 0.16); color: #4285F4; } .chat_room_item_label_referral { border-color: rgba(247, 147, 26, 0.5); background: rgba(247, 147, 26, 0.16); color: #F7931A; text-transform: none; } .chat_room_item_label_investment { border-color: rgba(0, 184, 169, 0.5); background: rgba(0, 184, 169, 0.16); color: #00B8A9; } .chat_room_item_label_investor { border-color: rgba(155, 81, 224, 0.5); background: rgba(155, 81, 224, 0.16); color: #9B51E0; } .chat_room_item_label_trader { border-color: rgba(0, 184, 169, 0.5); background: rgba(0, 184, 169, 0.16); color: #00B8A9; } .chat_room_item_footer { min-width: 0; } .chat_room_item p { color: var(--gray-100); font-size: 12px; line-height: 1.3; margin: 0; min-width: 0; flex: 1 1 auto; } .chat_room_item_count { min-width: 20px; height: 20px; border-radius: 20px; padding: 0 6px; margin-left: 8px; flex: 0 0 auto; background: var(--green); color: #1E4510; font-size: 10px; line-height: 20px; font-weight: 900; text-align: center; } .chat_room_empty { color: var(--gray-100); font-size: 16px; } .chat_room_list_state { flex: 1 1 auto; height: 100%; min-height: 0; padding: 10px; } .chat_body { flex: 1 1 auto; min-height: 0; position: relative; } .chat_body .content_scroll_wrapper { height: 100%; } .chat_body .__view { max-width: 100%; } .chat_body_inner { padding: 20px 10px; } .chat_date { position: absolute; left: 50%; top: 10px; font-size: 12px; line-height: 1.2; color: var(--black-300); padding: 4px; border-radius: 10px; background: rgba(var(--gray-rgb), 0.9); transform: translateX(-50%); min-width: 60px; text-align: center; z-index: 10; } .chat_card_date { position: relative; margin: 20px 0; } .chat_card_date:before { content: ""; position: absolute; left: 10px; right: 10px; border-top: 1px solid var(--gray-300); top: 50%; } .chat_card_date_inner { background: var(--black-200); padding: 5px 20px; position: relative; font-size: 12px; color: var(--gray-100); } .chat_card_inner { position: relative; padding-top: 5px; max-width: 80%; font-size: 14px; line-height: 1.2; color: var(--gray); word-wrap: break-word; } .chat_card + .chat_card_green { padding-top: 10px; } .chat_card_green + .chat_card { padding-top: 10px; } .chat_card_green + .chat_card_green { padding-top: 5px; } .chat_card p, .chat_card h5, .chat_card h6, .chat_card blockquote { margin-bottom: 0; } .chat_card h6 { font-size: 10px; font-weight: 700; color: var(--gray-100); } .chat_card a { color: inherit; } .chat_card_icon { height: 40px; border-radius: 50%; margin-right: 10px; flex: 0 0 auto; min-width: 40px; } .chat_card_body { background: var(--black-300); border-radius: 10px; padding: 10px 15px; position: relative; flex: 1 1 auto; min-width: 0; } .chat address { color: var(--gray-100); font-size: 12px; line-height: 1.2; margin-bottom: 5px; } .chat_card_author { gap: 8px; margin-bottom: 5px; } .chat_card_author address { margin-bottom: 0; } .chat time { color: var(--gray-100); position: absolute; right: 10px; bottom: 5px; font-size: 10px; line-height: 1.2; } .chat .chat_room_item_header time { position: static; right: auto; bottom: auto; margin-left: auto; padding-left: 10px; flex: 0 0 auto; } .chat_card_text :last-child:after { content: "."; display: inline-flex; min-width: 25px; opacity: 0; } .chat_card_text p { display: inline; } .chat_card_text hr { color: var(--gray-100); margin: 5px 0; } .chat blockquote { padding-left: 10px; position: relative; font-size: 12px; margin-bottom: 10px; color: var(--green); } .chat blockquote:before { content: ""; position: absolute; left: 0; width: 2px; top: 0; bottom: 0; background: var(--green); border-radius: 2px; } .chat blockquote .bg { width: 30px; height: 30px; float: left; margin-right: 10px; } .chat blockquote h5 { font-size: 12px; font-weight: 700; margin-bottom: 2px; letter-spacing: 0; } .chat blockquote p { margin: 0; } .chat blockquote button { width: 30px; height: 30px; float: right; } .chat blockquote button .icon { stroke: var(--gray-100); width: 12px; height: 12px; stroke-width: 3; stroke-linecap: round; } .chat blockquote button:hover .icon { stroke: var(--white); } .chat_card_file { background: var(--gray-300); margin: 0 -5px 15px; border-radius: 10px; text-decoration: none; } .chat_card_file:hover { opacity: 0.75; } .chat_card_file .bg { width: 75px; height: 75px; flex: 0 0 auto; border-radius: 10px; } .chat_card_file .icon { width: 20px; height: 20px; margin: 20px 5px 20px 15px; flex-shrink: 0; } .chat_card_file_inner { flex: 1 1 auto; min-width: 0; padding: 10px; } .chat_card_image { margin: 0 -5px 15px; cursor: pointer; } .chat_card_image img { border-radius: 10px; } .chat_card_link { display: inline-block; margin-bottom: 10px; max-width: 100%; } .chat .chat_card_link_box { color: var(--gray); font-size: 14px; } .chat .chat_card_link_box img { margin-bottom: 10px; border-radius: 5px; } .chat .chat_card_link_box h5 { font-size: 14px; margin-bottom: 5px; } .chat_card_green .chat_card_inner { margin-right: 0; color: var(--black-600); } .chat_card_green .chat_card_body { background: rgba(var(--green-rgb), 0.7); } .chat_card_green h6 { color: #1F500E; } .chat_card_green time { color: #1F500E; } .chat_card_green blockquote { color: #245812; } .chat_card_green blockquote:before { background: #245812; } .chat_card_green .chat_card_file { background: #56CC2C; } .chat .chat_card_green .chat_card_link_box { color: inherit; } .chat_footer { background: var(--black-300); border-radius: 0 0 10px 10px; } .chat_form { padding: 5px 5px 5px 10px; } .chat_form_file_trigger { margin-bottom: 8px; } .chat_form_file_trigger .icon { width: 30px; height: 30px; fill: var(--gray-200); } .chat_form_file_trigger:hover .icon { fill: var(--white); } .chat_form_field { padding: 0 5px; } .chat_form_field textarea { border-radius: 30px; border: 1px solid var(--gray-300); font-size: 12px; min-height: 38px; padding: 12px 20px; resize: none; } .chat_form_button { margin-bottom: 3px; } .chat_form_button .icon { height: 40px; stroke-width: 5px; stroke: rgba(var(--green-rgb), 0.07); width: 40px; } .chat_form_button:hover .icon { stroke: rgba(var(--green-rgb), 0.3); } .chat_footer blockquote { padding-top: 10px; padding-bottom: 10px; margin: 0 60px; } .chat_footer blockquote:before { top: 10px; bottom: 10px; } .chat_footer blockquote .progress { float: right; margin-top: -5px; width: 40px; height: 40px; } .chat nav { position: absolute; left: 0; z-index: 10; min-width: 160px; } .chat nav.top { bottom: 100%; padding-bottom: 5px; } .chat nav.bottom { top: 100%; padding-top: 5px; } .chat nav button { background: var(--black-300); border-style: solid; border-color: var(--gray-300); border-width: 1px 1px 0 1px; font-size: 14px; color: var(--gray); width: 100%; padding: 10px 20px; } .chat nav button:first-child { border-radius: 10px 10px 0 0; } .chat nav button:last-child { border-bottom-width: 1px; border-radius: 0 0 10px 10px; } .chat nav .icon { width: 20px; height: 20px; margin-left: 20px; fill: var(--gray); stroke: var(--gray); } .chat nav button:hover { color: var(--white); } .chat nav button:hover .icon { fill: var(--white); stroke: var(--white); } .chat nav .btn-primary:hover, .chat nav .tabulator .tabulator-footer .tabulator-paginator button:hover, .tabulator .tabulator-footer .tabulator-paginator .chat nav button:hover { background-color: var(--black-300); } .chat_card_green nav { left: auto; right: 0; } .progress { transform: rotate(-90deg); background: var(--gray-200); border-radius: 100%; position: relative; } .progress_loader circle { stroke: var(--gray-300); stroke-dasharray: 125.66368; } .progress .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .chat_popup_overlay { position: absolute; inset: 0; z-index: 11; background-color: rgba(var(--black-rgb), 0.8); } .chat_popup_overlay .__view { display: flex; flex-direction: column; align-items: center; justify-content: center; } .chat_popup { border-top-width: 2px; border-top-style: solid; } .chat_popup h4 { color: var(--white); text-transform: uppercase; font-size: 16px; } /*body { width: 1920px; }*/ .app { position: relative; background-size: 100% auto; overflow-x: clip; } .inverted .inverted-hidden { display: none !important; } .inverted-visible { display: none !important; } .inverted .inverted-visible { display: block !important; } .page_bg img { width: 100%; } .page_bg_cover img { height: 100%; -o-object-fit: cover; object-fit: cover; } .page-bg-left { position: absolute; left: 0; top: 100vh; max-width: calc(var(--container-gap) * 2); } @media (min-width: 1600px) { .page-bg-left { top: auto; bottom: 0; max-width: 10vw; left: 2vw; } } .page-bg-right { position: absolute; right: 0; top: 0; max-width: calc(var(--container-gap) * 2); } @media (min-width: 1600px) { .page-bg-right { max-width: 10vw; right: 2vw; } } .content { /*h2 { font-size: 1.8rem; color: var(--white); }*/ } .content h1, .content h2, .content h3, .content h4 { margin-bottom: 1em; } .content p, .content ul, .content ol { margin-bottom: 1.5em; } .content ol { counter-reset: ordered-list; } .content ol > li { margin-bottom: 0.5em; padding-left: 3.5rem; position: relative; } .content ol > li:before { color: var(--white); content: counter(ordered-list) "."; counter-increment: ordered-list; font-weight: 700; left: 0; position: absolute; top: 0; } .content ol > li:last-child { margin-bottom: 0; } .content ul > li { position: relative; padding-left: 1em; margin-bottom: 0.5em; } .content ul > li:before { content: ""; position: absolute; left: 0; top: 0.5em; width: 0.25em; height: 0.25em; border-radius: 50%; background-color: currentColor; } .content ul > li:last-child { margin-bottom: 0; } .lime_bg { background-color: #36C006; } .tooltip { background-image: url("/images/icons/svg/tooltip-icon.svg"); width: 24px; height: 20px; background-repeat: no-repeat; } .bg-white { background-color: var(--white); } .bg-green { background-color: var(--green); } .cursor-pointer { cursor: pointer; } .radius { border-radius: 2.5rem; } @media (min-width: 768px) { .radius { border-radius: 3rem; } } .text-capitalize { text-transform: capitalize; } .representative-1 .container { z-index: 1; } @media (min-width: 768px) { .representative-1 .wrap { display: grid; grid-template-areas: "title header-label" "description header-label" "buttons header-label" "images images"; } } .representative-1__label { font-size: 155px; position: relative; grid-area: header-label; } @media (min-width: 768px) { .representative-1__label { font-size: 29rem; align-self: baseline; } } .representative-1__label div { font-weight: 700; transform: rotate(-90deg); position: absolute; opacity: 0.5; left: -8%; bottom: 34%; font-size: 69px; } @media (min-width: 768px) { .representative-1__label div { font-size: 11rem; left: -10%; } } .representative-1__label span { font-weight: 800; position: relative; left: 5rem; } .representative-1__title { grid-area: title; } @media (min-width: 768px) { .representative-1__title { font-size: 64px; font-weight: 700; } } .representative-1__description { grid-area: description; } .representative-1__image { grid-area: images; } @media (min-width: 768px) { .representative-1__image { position: absolute; top: 80%; left: 14%; } } .representative-1__buttons { grid-area: buttons; } .representative-1__more { text-decoration: none; color: var(--white); border-bottom: 1px dashed var(--white); z-index: 2; } .representative-1__bg-dots { position: absolute; width: 100%; height: 100%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .representative-1__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(48.51% 40.33% at 84% 59.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } .representative-2 .container { z-index: 1; } @media (min-width: 768px) { .representative-2 h1 { font-size: 48px; font-weight: 700; } } @media (min-width: 768px) { .representative-2__cards { display: grid; grid-template-columns: repeat(12, 1fr); /* Создаем шесть фракционных колонок */ gap: 32px; } } @media (min-width: 768px) { .representative-2__card { grid-column: span 4; } } .representative-2__card svg { width: 64px; height: 64px; } @media (min-width: 768px) { .representative-2__card svg { width: 96px; height: 96px; } } @media (min-width: 768px) { .representative-2__card:nth-last-child(2) { grid-column: span 7; } .representative-2__card:last-child { grid-column: span 5; } } .representative-3 .container { z-index: 1; } @media (min-width: 768px) { .representative-3 h1 { font-size: 48px; } } .representative-3__card-text { font-style: italic; } .representative-3__cards { overflow: hidden; margin: 0 -20px; } .representative-3__cards:after { content: "flickity"; display: none; } .representative-3__card_wrapper { width: 100%; min-height: 100%; } .representative-3 .flickity-button { display: none; } .representative-3 .flickity-page-dots { margin-top: 15px; } @media (min-width: 768px) { .representative-3 .flickity-page-dots { width: 20%; } } .representative-3 .flickity-page-dots .dot { margin: 4px; } .representative-4 .container { z-index: 1; } .representative-4__title { font-size: 64px; } @media (min-width: 768px) { .representative-4__title { font-weight: 700; } } .representative-4__text { font-size: 24px; } .representative-4__bg-dots { position: absolute; width: 100%; height: 100%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .representative-4__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(48.51% 40.33% at 84% 59.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } .representative-5__title { font-size: 48px; } @media (min-width: 768px) { .representative-5 .accordion { max-width: 1300px; } } @media (min-width: 768px) { .representative-5__list-title { gap: 50px; } } .representative-5__list-title b { font-size: 20px; } .representative-5__list-title h3 { font-size: 16px; font-weight: 500; } @media (min-width: 768px) { .representative-5__list-title h3 { font-size: 20px; } } .representative-5 .content-expanded .icon-chevron { transform: rotate(-90deg); transition: 0.3s; color: var(--green); } .representative-5 .content-expanded .accordion-content { border-radius: 0 0 1em 1em; } .representative-5 .content-expanded .accordion-content div { border-left: 1px solid var(--green); } .content-expanded .representative-5__list-title { color: var(--green); } @media (min-width: 768px) { .content-expanded .representative-5__list-title span { color: var(--green); } } .representative-5 .content-collapsed .icon-chevron { transform: rotate(90deg); transition: 0.3s; } .representative-5 .content-collapsed:hover { background-color: var(--green); } .representative-5 .content-collapsed:hover div:first-child { color: #000; } .representative-6__title { font-size: 40px; } .representative-6__text { font-size: 24px; } .representative-6__form-fields { gap: 16px; } .representative-6__form-fields .form_row { margin-bottom: 0; } .representative-6__form-fields .field:hover { border-radius: 2rem; background-color: var(--gray-300); } .company-history-1 .container { z-index: 1; } .company-history-1__title { font-size: 45px; font-weight: 700; } @media (min-width: 768px) { .company-history-1__title { font-size: 64px; } } .company-history-1__description { font-size: 24px; line-height: 32px; margin-bottom: 64px; } .company-history-1__buttons { margin-bottom: 64px; } .company-history-1__more { text-decoration: none; border-bottom: 1px dashed var(--green); } .company-history-1__points { margin-bottom: 64px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 32px; align-self: stretch; } .company-history-1__points .point { display: flex; padding: 12px 24px; justify-content: center; align-items: center; gap: 12px; border-radius: 48px; border: 1px solid rgba(226, 226, 226, 0.12); background: #1A1A1A; } @media (max-width: 767.98px) { .company-history-1__points .point .logo .icon { width: 16px; height: 16px; } } .company-history-1__points .point .title p { margin: 0; color: var(--e2); font-size: 16px; font-weight: 400; line-height: 24px; } @media (max-width: 767.98px) { .company-history-1__points .point .title p { font-size: 12px; line-height: 16px; } } .company-history-1__points .point:hover { background: transparent; border: 1px solid #36C006; } @media (max-width: 767.98px) { .company-history-1__points .point { grid-row: span 1; grid-column: span 1; justify-self: stretch; } } @media (max-width: 767.98px) { .company-history-1__points { display: inline-grid; row-gap: 16px; -moz-column-gap: 16px; column-gap: 16px; align-self: stretch; grid-template-rows: repeat(2, fit-content(100%)); grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: row; } } .company-history-1__navigate { position: sticky; top: 100px; z-index: 50; width: 100%; display: flex; padding: 32px 0; justify-content: center; align-items: flex-start; gap: 16px; } .company-history-1__navigate .navigate-arrow-left, .company-history-1__navigate .navigate-arrow-right { display: flex; padding: 12px; justify-content: center; align-items: center; cursor: pointer; border-radius: 48px; border: 1px solid rgba(226, 226, 226, 0.12); } .company-history-1__navigate .navigate-content { display: flex; align-items: flex-start; flex: 1 0 0; } .company-history-1__navigate .navigate-content .year { position: relative; display: flex; padding: 12px; flex-direction: column; justify-content: center; align-items: center; gap: 12px; flex: 1 0 0; cursor: pointer; } .company-history-1__navigate .navigate-content .year::before { content: ""; position: absolute; top: 17px; left: 0; width: 100%; height: 2px; background: #242424; transition: background 0.2s ease; z-index: 0; } .company-history-1__navigate .navigate-content .year .point { position: relative; z-index: 1; width: 12px; height: 12px; border-radius: 50%; background: #6D6D6D; transition: background 0.2s ease, box-shadow 0.2s ease; } .company-history-1__navigate .navigate-content .year .text { position: relative; z-index: 1; } .company-history-1__navigate .navigate-content .year .text p { margin: 0; color: #6D6D6D; text-align: center; font-size: 16px; font-weight: 700; line-height: 16px; transition: color 0.2s ease; } .company-history-1__navigate .navigate-content .year .text .current { margin-top: 6px; color: #36C006; font-size: 12px; font-weight: 400; } .company-history-1__navigate .navigate-content .year:hover:not(.active) .point { background: #E2E2E2; } .company-history-1__navigate .navigate-content .year:hover:not(.active) .text p { color: #E2E2E2; } .company-history-1__navigate .navigate-content .year.active::before { background: #36C006; } .company-history-1__navigate .navigate-content .year.active .point { background: #36C006; box-shadow: 0 0 0 8px rgba(54, 192, 6, 0.15); } .company-history-1__navigate .navigate-content .year.active .text p { color: #36C006; } .company-history-1__bg-dots { position: absolute; width: 50%; height: 100%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .company-history-1 .bg-dots-right { right: -25%; } .company-history-1 .bg-dots-left { left: -25%; } .company-history-1__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; } .company-history-1 .bg-dots-left::after { background: radial-gradient(33.51% 23.33% at 51% 54.33%, transparent 0%, var(--black-400) 100%); } .company-history-1 .bg-dots-right::after { background: radial-gradient(33.51% 23.33% at 51% 54.33%, transparent 0%, var(--black-400) 100%); } .company-history-2__history { position: relative; } .company-history-2__history .company-history-nav-sticky { position: sticky; top: 100px; z-index: 50; width: 100%; background: rgba(var(--black-400-rgb), 0.9); } .company-history-2__history .company-history-nav-sticky .company-history-navigate { width: 100%; display: flex; padding: 32px 0; justify-content: center; align-items: flex-start; gap: 16px; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-left, .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-right { display: flex; flex: 0 0 auto; padding: 12px; justify-content: center; align-items: center; cursor: pointer; border-radius: 48px; border: 1px solid rgba(226, 226, 226, 0.12); } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-left.disabled, .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-right.disabled { opacity: 0.3; pointer-events: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content { display: flex; align-items: flex-start; flex: 1 1 auto; min-width: 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content::-webkit-scrollbar { display: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year { position: relative; display: flex; /* * Desktop: * растягиваются на всю ширину. * * Mobile: * меньше 100px не становятся, * поэтому появляется scroll. */ flex: 1 0 100px; min-width: 100px; padding: 12px; flex-direction: column; justify-content: center; align-items: center; gap: 12px; cursor: pointer; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year::before { content: ""; position: absolute; top: 17px; left: 0; width: 100%; height: 2px; background: #242424; transition: background 0.2s ease; z-index: 0; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year .point { position: relative; z-index: 1; width: 12px; height: 12px; flex: 0 0 12px; border-radius: 50%; background: #6D6D6D; transition: background 0.2s ease, box-shadow 0.2s ease; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year .text { position: relative; z-index: 1; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year .text p { margin: 0; color: #6D6D6D; text-align: center; font-size: 16px; font-weight: 700; line-height: 16px; transition: color 0.2s ease; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year .text .current { margin-top: 6px; color: #36C006; font-size: 12px; font-weight: 400; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year:hover:not(.active) .point { background: #E2E2E2; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year:hover:not(.active) .text > p:not(.current) { color: #E2E2E2; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year.active::before { background: #36C006; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year.active .point { background: #36C006; box-shadow: 0 0 0 8px rgba(54, 192, 6, 0.15); } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year.active .text > p { color: #36C006; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-current-year { display: none; } .company-history-2 .highlighted { background-color: var(--green); padding: 30px; color: black; } .company-history-2 .rounded { border-radius: 3rem; } .company-history-2 .circle { width: 14px; height: 14px; border-radius: 50%; } .company-history-2 .rhomb { width: 14px; height: 14px; transform: rotate(45deg); } .company-history-2 .line { height: 11rem; width: 2px; } .company-history-2 .line-dashed { height: 7px; width: 2px; margin-left: 1px; } .company-history-2 .right-border { border-right: 1px solid var(--green); } .company-history-2 .right-border .rhomb { position: relative; right: -8px; } .company-history-2 .left-border { border-left: 1px solid var(--green); } .company-history-2 .left-border .rhomb { position: relative; left: -8px; } .company-history-2__year { background: linear-gradient(var(--black-200), var(--black-400)); } .company-history-2__year-title { overflow: hidden; } .company-history-2__year-line { position: relative; } .company-history-2__year-line .rhomb { position: absolute; top: -8px; } .company-history-2__event { display: grid; grid-template-columns: 50% 1px 50%; justify-content: center; grid-template-areas: "optional eventLine date" "eventText eventText eventText"; } @media (min-width: 768px) { .company-history-2__event { grid-template-columns: 49.99% 1px max-content 1fr; grid-template-rows: max-content; justify-content: start; grid-template-areas: "eventText eventLine date optional"; } } .company-history-2__event-reverse { display: grid; grid-template-columns: 50% 1px 50%; justify-content: center; grid-template-areas: "date eventLine optional" "eventText eventText eventText"; } @media (min-width: 768px) { .company-history-2__event-reverse { grid-template-columns: 1fr max-content 1px 50%; grid-template-rows: max-content; justify-content: end; grid-template-areas: "optional date eventLine eventText"; } } .company-history-2__event-content { grid-area: eventText; } .company-history-2__event-content:hover { background-color: var(--green); padding: 30px; color: black; } .company-history-2__event-date { grid-area: date; margin-left: -7px; gap: 30px; } .company-history-2__event-date div:first-child { gap: 10px; } .company-history-2__event-date span:last-of-type { color: rgba(92, 224, 46, 0.4588235294); } .company-history-2__event-reverse .company-history-2__event-date { margin-left: 0; margin-right: -8px; } .company-history-2__event-optional { grid-area: optional; font-size: 7rem; align-self: end; } @media (min-width: 768px) { .company-history-2__event-optional { font-size: 13rem; align-self: start; } } .company-history-2__event-line { grid-area: eventLine; height: 16rem; width: 2px; margin: auto; } @media (min-width: 768px) { .company-history-2__event-line { height: 100%; } } .company-history-2__roadmap .right-border { border-right: 1px solid var(--white); } .company-history-2__roadmap .right-border .rhomb { position: relative; right: -8px; } .company-history-2__roadmap .left-border { border-left: 1px solid var(--white); } .company-history-2__roadmap .left-border .rhomb { position: relative; left: -8px; } .company-history-2__roadmap .company-history-2__year { background: linear-gradient(rgba(92, 224, 46, 0.0509803922), var(--black-400)); } .company-history-2__roadmap .company-history-2__event-date span:last-of-type { color: var(--green); } .company-history-2__roadmap .company-history-2__event-optional { font-size: 24px; font-weight: 400; text-align: left; } @media (min-width: 768px) { .company-history-2__roadmap .company-history-2__event-optional { text-align: right; } } .company-history-2__roadmap .reverse { text-align: right; } @media (min-width: 768px) { .company-history-2__roadmap .reverse { text-align: left; } } @media (max-width: 767.98px) { .company-history-2__history .company-history-nav-sticky { top: var(--header-height, 0); background: rgba(var(--black-400-rgb), 0.95); } .company-history-2__history .company-history-nav-sticky .container { padding-left: 0; padding-right: 0; max-width: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate { display: grid; grid-template-columns: 84px 1fr 84px; grid-template-rows: auto auto; grid-template-areas: "years years years" "prev current next"; width: 100%; padding: 32px; gap: 0; align-items: center; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content { grid-area: years; display: flex; width: 100%; min-width: 0; overflow-x: auto; overflow-y: hidden; padding: 12px 0; border-top: 1px solid rgba(226, 226, 226, 0.06); border-bottom: 1px solid rgba(226, 226, 226, 0.06); scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content::-webkit-scrollbar { display: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year { flex: 0 0 auto; min-width: auto; padding: 12px; gap: 0; border-radius: 12px; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year::before { display: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year .point { display: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year .text p { color: #6D6D6D; text-align: center; font-size: 12px; font-weight: 400; line-height: 16px; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year:hover:not(.active) .text > p { color: #6D6D6D; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year.active { background: rgba(54, 192, 6, 0.12); } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-content .year.active .text > p { color: #36C006; font-weight: 700; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-left, .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-right { display: flex; width: 62px; height: 62px; padding: 0; margin-top: 32px; justify-content: center; align-items: center; border-radius: 50%; border: 1px solid rgba(226, 226, 226, 0.15); box-sizing: border-box; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-left.disabled, .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-right.disabled { opacity: 0.3; pointer-events: none; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-left { grid-area: prev; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-arrow-right { grid-area: next; justify-self: end; } .company-history-2__history .company-history-nav-sticky .company-history-navigate .navigate-current-year { grid-area: current; display: flex; margin-top: 32px; justify-content: center; align-items: center; color: #36C006; text-align: center; font-size: 32px; font-style: normal; font-weight: 700; line-height: normal; } } .company-history-3 .rounded { border-radius: 2rem; } .welcome-1 .container { z-index: 1; } @media (min-width: 768px) { .welcome-1 .wrap { display: grid; grid-template-columns: 60% 40%; grid-template-areas: "title images" "description images" "buttons images"; } } .welcome-1__title { font-size: 45px; font-weight: 700; grid-area: title; } @media (min-width: 768px) { .welcome-1__title { font-size: 64px; } } .welcome-1__description { font-size: 24px; line-height: 32px; grid-area: description; } .welcome-1__image { grid-area: images; } @media (min-width: 768px) { .welcome-1__image { grid-row: 1/4; align-self: center; } } .welcome-1__buttons { grid-area: buttons; } .welcome-1__more { text-decoration: none; color: var(--white); border-bottom: 1px dashed var(--white); } .welcome-1__bg-dots { position: absolute; width: 100%; height: 100%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .welcome-1__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(48.51% 40.33% at 84% 59.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } .welcome-2 .green-mark { margin: 0; } .welcome-2 .green-mark + div { border: none; } .welcome-2 .mark-bottom { top: -10px; } .welcome-2 .card-round { background: var(--black-300); width: 48px; height: 48px; border-radius: 50%; position: relative; } .welcome-2 .round-left { left: -24px; } .welcome-2 .round-right { right: -24px; } @media (min-width: 768px) { .welcome-2__card { height: 100%; } .welcome-2__card .radius.green-border { height: 100%; } } .welcome-2 .green-border { border: 2px solid transparent; } .welcome-2__card:hover .green-border, .welcome-2__card:hover .card-round { border: 2px solid var(--green); } .welcome-2 h2 { font-size: 37px; font-weight: 700; } .welcome-2__info { font-size: 24px; } .welcome-2__price { font-size: 48px; font-weight: 700; } .welcome-3 .cover { top: 55%; left: -37%; } @media (min-width: 768px) { .welcome-3 .cover { top: 10%; left: 0; } } .welcome-3__title { font-size: 48px; } .welcome-3__cards { overflow: hidden; } .welcome-3__cards:after { content: "flickity"; display: none; } .welcome-3__card_wrapper { width: 100%; min-height: 100%; } .welcome-3__card { font-size: 14px; line-height: 1.4; text-align: center; min-height: 100%; } .welcome-3__text { text-align: center; position: relative; top: 50%; } .welcome-3 .image-container { height: 249px; } @media (min-width: 768px) { .welcome-3 .image-container { height: auto; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } } .welcome-3__card-image-1 .card-1 { position: relative; } @media (min-width: 768px) { .welcome-3__card-image-1 .card-1 { width: 757px; } } .welcome-3__card-image-1 .card-2 { position: absolute; width: 80px; right: 6%; bottom: 33%; } @media (min-width: 768px) { .welcome-3__card-image-1 .card-2 { bottom: 0; right: 0; width: 215px; } } @media (min-width: 768px) { .welcome-3__card-image-2 .card-1 { width: 767px; } } .welcome-3__card-image-3 .card-1 svg { width: 100%; height: 100%; transform: scale(1.1); } @media (min-width: 768px) { .welcome-3__card-image-3 .card-1 svg { transform: scale(1); } } @media (min-width: 768px) { .welcome-3__card-image-4 .card-1 { width: 767px; } } .welcome-3__card-image-5 .card-1 { position: relative; } .welcome-3__card-image-5 .card-1 svg { width: 100%; height: 100%; } .welcome-3__card-image-5 .card-2 { position: absolute; width: 177px; bottom: 24%; left: 3%; } @media (min-width: 768px) { .welcome-3__card-image-5 .card-2 { left: 0; bottom: 15%; width: 403px; } } .welcome-3__card-image-5 .card-3 { position: absolute; width: 199px; right: 2%; bottom: 41%; } @media (min-width: 768px) { .welcome-3__card-image-5 .card-3 { bottom: 0; top: 32%; right: -20%; width: 359px; } } @media (min-width: 768px) { .welcome-3__card-image-5.image-container { right: 10%; } } .welcome-3__card-image-6 .card-1 { position: relative; } .welcome-3__card-image-6 .card-2 { position: absolute; width: 138px; top: 31%; left: 30%; } @media (min-width: 768px) { .welcome-3__card-image-6 .card-2 { top: 0; left: 29%; width: 271px; } } .welcome-3__card-image-6 .card-3 { position: absolute; left: 27%; bottom: 33%; } @media (min-width: 768px) { .welcome-3__card-image-6 .card-3 { left: 29%; bottom: 10%; } } .welcome-3__card-image-6 .card-4 { position: absolute; right: 24%; bottom: 42%; } @media (min-width: 768px) { .welcome-3__card-image-6 .card-4 { right: 25%; bottom: 24%; } } .welcome-3 .flickity-button { display: none; } .welcome-3 .flickity_carousel .flickity-page-dots { margin-top: 1em; } @media (min-width: 768px) { .welcome-3 .flickity_carousel .flickity-page-dots { margin-top: 8em; } } .welcome-3 .flickity_carousel .flickity-page-dots .dot { padding: 0; margin: 10px; } .welcome-3 .flickity_carousel .flickity-page-dots .dot::before { width: 12px; height: 12px; } @media (min-width: 768px) { .welcome-4 h1 { font-size: 48px; } } .welcome-4 .radius { border-radius: 1em; } @media (min-width: 768px) { .welcome-4 .accordion { max-width: 1300px; } } .welcome-4__list-title h3, .welcome-4__list-title span { font-size: 24px; font-weight: 500; } @media (min-width: 768px) { .welcome-4__list-title { gap: 50px; } .welcome-4__list-title h3 { font-size: 32px; } .welcome-4__list-title span { font-weight: normal; } } .welcome-4 .content-expanded { background-color: var(--black-200); } .welcome-4 .content-expanded .icon-chevron { transform: rotate(90deg); transition: 0.3s; } .welcome-4 .content-expanded .accordion-content { border-radius: 0 0 1em 1em; border-bottom: 1px solid var(--green); } .welcome-4 .content-expanded .accordion-content div { border-left: 1px solid var(--green); } .welcome-4 .content-expanded .accordion-content div:first-child:before { content: "."; position: relative; right: 26px; bottom: 19px; font-size: 51px; line-height: 8px; color: var(--green); display: flex; } @media (min-width: 768px) { .welcome-4 .content-expanded .accordion-content div:first-child:before { display: none; } } .welcome-4 .content-expanded .accordion-content ul { list-style: disc; padding: 20px 0 0 25px; } .content-expanded .welcome-4__list-title { padding: 1rem 1rem !important; } @media (min-width: 768px) { .content-expanded .welcome-4__list-title { padding: 1.5rem 3.5rem !important; } } @media (min-width: 768px) { .content-expanded .welcome-4__list-title span { color: var(--green); } } .welcome-4 .content-collapsed div:first-child { padding: 0.7rem !important; } @media (min-width: 768px) { .welcome-4 .content-collapsed div:first-child { padding: 1.5rem 3.5rem !important; } } .welcome-4 .content-collapsed .icon-chevron { transition: 0.3s; } .welcome-4 .content-collapsed:hover { background-color: var(--green); } .welcome-4 .content-collapsed:hover div:first-child { color: #000; } .depositing-1 .wrap { display: grid; grid-template-rows: repeat(3, 200px); grid-template-columns: repeat(2, 50%); grid-template-areas: "title title" "description images" "buttons buttons"; } .depositing-1__title { grid-area: title; } .depositing-1__description { grid-area: description; font-size: 24px; margin: 0 10% 0 0; } .depositing-1__images { grid-area: images; } .depositing-1__images svg:first-child { color: var(--white); width: 128px; } .depositing-1__images svg:last-child { color: var(--white); width: 96px; } .depositing-1__buttons { grid-area: buttons; } .depositing-1__bg { color: var(--black-300); position: absolute; bottom: -50%; } .depositing-1 .more-about { text-decoration: none; color: var(--white); border-bottom: 1px dashed var(--white); } @media (min-width: 768px) { .depositing-1 .wrap { grid-template-columns: 73% 27%; grid-template-areas: "title images" "description images" "buttons images"; } .depositing-1__title { font-size: 64px; } .depositing-1__bg { width: 26%; bottom: 0; transform: rotate(90deg); } .depositing-1__images { gap: 20px; } .depositing-1__images svg:first-child, .depositing-1__images svg:last-child { width: 224px; } } .depositing-2 .rectangle { width: 8px; } @media (min-width: 768px) { .depositing-2 .container { width: 80%; position: absolute; z-index: 10; bottom: -50%; } } .depositing-3 { font-size: 14px; } .depositing-3 .container { padding-bottom: 20em; } .depositing-3 .accordion-item { background-color: var(--black-200); } .depositing-3 .content-collapsed .accordion-item { cursor: pointer; border: none; color: var(--white); } .depositing-3 .content-expanded .accordion-item { background-color: var(--black-100); color: #36C006; border: none; } .depositing-3 .accordion-item:hover { background-color: var(--black-100); color: #36C006; } .depositing-3 .columns { border-bottom: 1px solid #3A3A3A; } .depositing-3 .note { background-color: var(--gray-300); color: var(--white); font-size: 12px; border-radius: 25px 0 0 25px; } .depositing-3 .note p { font-size: 12px; } .depositing-4 .content-expanded .icon-chevron { transform: rotate(180deg); } .depositing-4 .content-expanded .container div { color: #36C006; } .depositing-4 .content-expanded .value { color: #36C006; } .depositing-5 .info h3 { font-size: 22px; } .depositing-5 .info p { font-size: 12px; } @media (min-width: 768px) { .depositing-5 { position: relative; top: -13em; } } .holiday-1 .container { z-index: 1; } .holiday-1 .wrap { display: flex; } @media (min-width: 768px) { .holiday-1 .wrap { display: grid; grid-template-columns: 73% 27%; -moz-column-gap: 5%; column-gap: 5%; grid-template-areas: "title images" "description images" "buttons images"; } } @media (min-width: 768px) { .holiday-1__title { grid-area: title; } } .holiday-1__description { font-size: 24px; } @media (min-width: 768px) { .holiday-1__description { grid-area: description; } } @media (min-width: 768px) { .holiday-1__image { grid-area: images; } } @media (min-width: 768px) { .holiday-1__buttons { grid-area: buttons; } } .holiday-1__bg-1 { width: 100%; height: 80%; position: absolute; background-image: url("/images/bg/bg-holiday-1.png"); } @media (min-width: 768px) { .holiday-1__bg-1 { width: 100%; height: 150%; position: absolute; background-image: url("/images/bg/bg-holiday-1.png"); background-position: left; background-size: 50%; } } .holiday-1__bg-2 { position: absolute; width: 100%; height: 100%; transform: scale(-1); background-image: url("/images/bg/bg-holiday-2.png"); background-position: right; background-size: 342%; background-repeat: no-repeat; } @media (min-width: 768px) { .holiday-1__bg-2 { position: absolute; width: 100%; height: 150%; background-image: url("/images/bg/bg-holiday-2.png"); background-position: right; background-size: 340%; background-repeat: no-repeat; } } .holiday-1 .more-about { text-decoration: none; color: var(--white); border-bottom: 1px dashed var(--white); } @media (min-width: 768px) { .holiday-2 .container { border-radius: 5rem; } } @media (min-width: 768px) { .holiday-2__title { font-size: 48px; } } .holiday-2__gifts { display: grid; grid-template-columns: repeat(2, 1fr); justify-items: center; row-gap: 30px; } @media (min-width: 768px) { .holiday-2__gifts { grid-template-columns: repeat(4, 1fr); -moz-column-gap: 30px; column-gap: 30px; } } .holiday-2__card { width: 132px; height: 132px; } @media (min-width: 768px) { .holiday-2__card { width: 264px; height: 264px; } } .holiday-2__card .card-content { height: 100%; border: 2px dashed var(--black-100); transition: all 0.3s ease; } .holiday-2__card .card-icon { position: relative; background-color: var(--black-200); z-index: 2; bottom: -12px; transition: all 0.3s ease; width: 48px; height: 48px; } @media (min-width: 768px) { .holiday-2__card .card-icon { width: 96px; height: 96px; bottom: -20px; } } .holiday-2__card .card-text { position: relative; top: -15px; transition: all 0.3s ease; } @media (min-width: 768px) { .holiday-2__card .card-text { top: -40px; font-size: 20px; } } .holiday-2__card .card-round { background: var(--black-300); max-width: 32px; height: 32px; border-radius: 50%; border: 2px dashed var(--black-100); position: relative; } @media (min-width: 768px) { .holiday-2__card .card-round { max-width: 56px; height: 56px; } } .holiday-2__card .radius { border-radius: 1rem; } @media (min-width: 768px) { .holiday-2__card .radius { border-radius: 2.5rem; } } .holiday-2__card .round-left { left: -18px; } @media (min-width: 768px) { .holiday-2__card .round-left { left: -28px; } } .holiday-2__card .round-right { right: -18px; } @media (min-width: 768px) { .holiday-2__card .round-right { right: -28px; } } .holiday-2__card:hover .card-content { background-color: var(--black-400); box-shadow: 0px 6px 12px 0px #0A0A0A inset; } .holiday-2__card:hover .card-icon { background-color: var(--black-400); color: var(--green); bottom: 0; } .holiday-2__card:hover .card-text { top: 0; } .holiday-2 h2 { font-size: 37px; font-weight: 700; } .holiday-3 { overflow: hidden; } .holiday-3 .container { z-index: 2; } .holiday-3 .radius { border-radius: 2rem; } .holiday-3__card { max-width: 362px; min-height: 720px; } .holiday-3__card .card-text { height: 510px; } .holiday-3__card .card-text h2 { font-size: 32px; } .holiday-3__card .card-text p { font-size: 16px; } .holiday-3__bg-1 { width: 100%; height: 80%; position: absolute; z-index: 1; background-image: url("/images/bg/bg-holiday-1.png"); background-repeat: no-repeat; top: 0; } @media (min-width: 768px) { .holiday-3__bg-1 { background-position: center; top: -25%; background-size: 56%; } } .holiday-3__bg-2 { position: absolute; width: 100%; height: 100%; z-index: 1; top: 0; background-image: url("/images/bg/bg-holiday-2.png"); background-position: top left; background-size: 414%; background-repeat: no-repeat; } @media (min-width: 768px) { .holiday-3__bg-2 { top: -40%; background-position: left; background-size: 275%; transform: rotate(-90deg); } } .holiday-3__bg-3 { position: absolute; width: 100%; height: 100%; top: 0; transform: scale(2); background-image: url('data:image/svg+xml,'); } @media (min-width: 768px) { .holiday-3__bg-3 { top: 18%; height: 63%; } } .holiday-3__bg-3::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(81.51% 15.33% at 5% 35.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .holiday-3__bg-3::after { background: radial-gradient(26.51% 35.33% at 49% 50.33%, transparent 0%, var(--black-400) 100%); } } .holiday-gift { position: relative; } @media (min-width: 768px) { .holiday-gift .popup_body h1 { font-size: 38px; } } .holiday-gift__icon { width: 96px; height: 96px; } .holiday-gift__content { position: relative; z-index: 1; } @media (min-width: 768px) { .holiday-gift__content { padding: 2rem 10rem; } } .holiday-gift__bg-1 { position: absolute; background-image: url("/images/bg/bg-holiday-small-1.png"); width: 100%; height: 100%; right: -14%; } @media (min-width: 768px) { .holiday-gift__bg-1 { background-repeat: no-repeat; background-position: right top; right: 0; } } .holiday-gift__bg-2 { position: absolute; background-image: url("/images/bg/bg-holiday-small-2.png"); width: 131%; height: 100%; background-size: 187%; background-position: left; right: -44px; } @media (min-width: 768px) { .holiday-gift__bg-2 { background-size: 60%; background-position: right top; right: 10%; background-repeat: no-repeat; } } .promo-1__header { background: url("/images/svg/lines-mobile.svg") no-repeat center; } .promo-1__rectangle { position: absolute; z-index: 1; } .promo-1__title { z-index: 1; } .promo-1__text { font-size: 24px; line-height: 32px; } .promo-1__name { font-size: 48px; } .promo-1 .more { text-decoration: none; color: var(--white); border-bottom: 1px dashed var(--white); } @media (min-width: 768px) { .promo-1__header { background: url("/images/svg/lines.svg") no-repeat center; } .promo-1__name { font-size: 96px; } .promo-1__text { max-width: 60%; } } .promo-2__wrap { display: grid; grid-template-rows: repeat(4, max-content); grid-template-columns: 100%; grid-template-areas: "title title" "card card" "text text" "buttons buttons"; } .promo-2__title { grid-area: title; } .promo-2__card { max-width: 334px; max-height: 448px; } .promo-2__card-content { grid-area: card; z-index: 1; } .promo-2__card-content::before { content: ""; width: 128px; height: 20px; display: block; position: relative; border-radius: 20px; background-color: #36c006; bottom: 10px; } .promo-2__card-name { font-size: 36px; } .promo-2__program { width: -moz-min-content; width: min-content; font-size: 20px; } .promo-2__text { grid-area: text; font-size: 24px; line-height: 32px; } .promo-2__icon-1 { width: 16px; height: 30px; } .promo-2__icon-2 { width: 23px; height: 42px; left: 1.3em; top: 2em; position: relative; } .promo-2__icon-3 { width: 46px; height: 88px; position: relative; right: 2.5em; bottom: 2em; z-index: 2; } .promo-2__icon-4 { width: 9px; height: 16px; position: relative; bottom: 2.5em; left: 0.7em; } .promo-2__icon-5 { width: 31px; height: 57px; position: relative; bottom: 2em; right: 0.8em; } .promo-2__buttons { grid-area: buttons; } @media (min-width: 768px) { .promo-2__wrap { grid-template-rows: repeat(3, 10.7em); grid-template-columns: 32% 68%; grid-template-areas: "card title" "card text" "card buttons"; } .promo-2__title { font-size: 48px; } .promo-2__card { grid-row-start: 1; grid-row-end: 4; } .promo-2__text { margin: 0; } } .promo-3__title { font-size: 32px; } .promo-3__hexagon { position: relative; isolation: isolate; width: 232px; height: 232px; } .promo-3__hexagon::before { content: ""; position: absolute; inset: 0; z-index: -1; background-color: var(--black-200); -webkit-mask: url("/images/svg/hexagon.svg") no-repeat center; mask: url("/images/svg/hexagon.svg") no-repeat center; } .promo-3__cards { overflow: hidden; border-radius: 3.5em; border: 3px solid var(--gray-200); } .promo-3__card_wrapper { width: 100%; min-height: 100%; } .promo-3__card-bg { position: absolute; bottom: 0; } .promo-3__card { font-size: 14px; line-height: 1.4; text-align: center; min-height: 100%; } .promo-3__text { text-align: center; position: relative; margin-top: 30px; } .promo-3__progress { gap: 6px; } .promo-3 .flickity-button { display: none; } .promo-3 .flickity_carousel .flickity-page-dots .dot { padding: 0; margin: 4px; } .promo-3 .flickity_carousel .flickity-page-dots .dot::before { width: 8px; height: 8px; } @media (min-width: 768px) { .promo-3__title { font-size: 48px; } .promo-3__cards { border: 0; } .promo-3__card { border: 3px solid transparent; } .promo-3__card:hover { border-color: var(--gray-200); border-radius: 3.5em; } .promo-3__card-bg { top: 33%; } .promo-3__text { position: static; } } @media (max-width: 991.98px) { .promo-3__cards:after { content: "flickity"; display: none; } } .promo-4 .radius { border-radius: 3em; } .promo-4__icon { border-radius: 1.5em; } .promo-4__text b { color: var(--white); font-size: 20px; } @media (min-width: 768px) { .promo-4__items { display: grid; grid-template-columns: repeat(2, 50%); -moz-column-gap: 2em; column-gap: 2em; grid-template-areas: "column-1 column-2"; } .promo-4__item:hover { background-color: var(--black-100); border-radius: 1.5em; } .promo-4__item:hover > .promo-4__text b { color: #36C006; } .promo-4__title { font-size: 48px; } } .promo-5__header { background: url("/images/svg/lines-mobile-2.svg") no-repeat bottom; } .promo-5__dot { width: 6px; height: 6px; border-radius: 6px; background-color: #36C006; } .promo-5 .content-expanded .icon-chevron { transform: rotate(180deg); } .promo-5 .accordion-content { border-radius: 0 0 2em 2em; } @media (min-width: 768px) { .promo-5 { background: url("/images/svg/lines.svg") no-repeat top; } .promo-5__header { background: none; } } .card-rectangle { width: 128px; height: 24px; position: relative; bottom: 12px; left: 12px; } .green-mark { width: 128px; height: 20px; margin-left: 24px; display: block; position: relative; border-radius: 20px; background-color: var(--green); top: 10px; } .white-mark { width: 128px; height: 20px; margin-left: 24px; display: block; position: relative; border-radius: 20px; background-color: var(--white); top: 10px; } .white-mark + div { border: 2px solid var(--white); } .green-mark + div { border: 2px solid var(--green); } .green-mark + div, .white-mark + div { position: relative; z-index: 2; } .without-border { border: 0; } .pamm-1 { z-index: 2; } .pamm-1 .container { z-index: 1; } .pamm-1 .wrap { display: grid; grid-template-rows: repeat(3, 13em); grid-template-columns: repeat(2, 50%); grid-template-areas: "title images" "description description" "buttons buttons"; } .pamm-1__title { z-index: 2; grid-area: title; font-size: 32px; } .pamm-1__description { z-index: 2; grid-area: description; font-size: 24px; } .pamm-1__images { grid-area: images; } .pamm-1__buttons { grid-area: buttons; } .pamm-1 .more-about { text-decoration: none; color: var(--white); border-bottom: 1px dashed var(--white); } .pamm-1__bg-dots { position: absolute; bottom: -10.6%; width: 100%; height: 36%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .pamm-1__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(59.51% 146.33% at 90% 126.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .pamm-1 .wrap { grid-template-rows: 12em 6em 8em; grid-template-columns: 73% 27%; grid-template-areas: "title images" "description images" "buttons buttons"; } .pamm-1__title { font-size: 64px; } .pamm-1__bg-dots::after { background: radial-gradient(32.51% 148.33% at 50% 168.33%, transparent 0%, var(--black-400) 100%); } } .pamm-2 { position: relative; } .pamm-2 .container { z-index: 2; } .pamm-2 .green-mark + div { border: 0; } .pamm-2__description { font-size: 24px; } .pamm-2__card { position: relative; font-size: 16px; } .pamm-2__card-arrow { position: absolute; z-index: 3; top: 76%; right: 0; } .pamm-2__bg-dots { position: absolute; top: -10.6%; width: 100%; height: 16%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .pamm-2__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(59.51% 146.33% at 90% 126.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .pamm-2 .container { border-radius: 2.5em; } .pamm-2__title { font-size: 48px; } .pamm-2__card-item { max-width: 264px; height: 300px; } .pamm-2__card-arrow { height: 1.1em; left: 6em; top: 74%; } } .pamm-3__container { position: relative; z-index: 1; } .pamm-3__card { font-size: 16px; } .pamm-3__card-item { font-size: 20px; } .pamm-3__bar-text h3 { width: -moz-min-content; width: min-content; } .pamm-3__bars div { position: relative; } .pamm-3__bars div:last-child .bar-white { width: 40%; } .pamm-3__bars div:last-child .bar-green { width: 20%; } .pamm-3__bars .bar-middle .bar-parent { width: 45%; } .pamm-3__bars .bar-middle .bar-white { width: 55%; } .pamm-3__bar .bar-parent { height: 98px; border-radius: 14px; background: linear-gradient(180deg, #2B2B2B 0%, #1D1D1D 13.02%, #3A3A3A 86.46%, #2B2B2B 100%); } .pamm-3__bar .bar-child { height: 98px; width: 28.34px; background: linear-gradient(90deg, #1A1A1A 0%, #3A3A3A 100%); border-radius: 24px; } .pamm-3__bar .bar-white { margin-right: -1em; z-index: 4; background: linear-gradient(180deg, #484848 0%, #3A3A3A 13.02%, #5A5A5A 86.46%, #484848 100%); } .pamm-3__bar .bar-child-white { background: linear-gradient(90deg, #3A3A3A 0%, #5A5A5A 100%); } .pamm-3__bar .bar-green { margin-right: -1em; z-index: 3; background: linear-gradient(180deg, #7BDD58 0%, #36C006 13.02%, #AAFF8C 86.46%, #7BDD58 100%); } .pamm-3__bar .bar-child-green { background: linear-gradient(90deg, #36C006 0%, #98EE7A 100%); } .pamm-3__bar-arrow { height: 1.1em; position: absolute; left: 2.5em; top: 60%; z-index: 5; transform: rotate(90deg); } .pamm-3__bg-dots { position: absolute; top: -10.7%; width: 100%; height: 28%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .pamm-3__bg-dots:after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(59.51% 146.33% at 20% -26.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } .pamm-3__bg-dots-second { position: absolute; top: 50%; width: 100%; height: 40.8%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .pamm-3__bg-dots-second:after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(50.51% 50.33% at 90% 56.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .pamm-3 .container h2 { font-size: 48px; } .pamm-3__bars div:last-child .bar-white { height: 90%; width: 166px; margin-bottom: -1.5em; } .pamm-3__bars div:last-child .bar-green { height: 30%; width: 166px; } .pamm-3__bars .bar-middle .bar-parent { height: 50%; width: 166px; } .pamm-3__bars .bar-middle .bar-white { height: 60%; width: 166px; } .pamm-3__bars > div { height: 600px; } .pamm-3__bar .bar-parent { width: 166px; height: 600px; border-radius: 24px; background: linear-gradient(90deg, var(--gray-200) 0%, var(--black-100) 13.02%, var(--gray-200) 86.46%, var(--gray-300) 100%); } .pamm-3__bar .bar-child { width: 166px; height: 48px; border-radius: 24px; background: linear-gradient(180deg, var(--gray-300) 0%, var(--gray-200) 100%); } .pamm-3__bar .bar-white { margin-right: 0; margin-bottom: -1em; z-index: 3; background: linear-gradient(90deg, var(--gray-100) 0%, var(--gray-200) 13.02%, var(--gray-100) 86.46%, var(--gray-200) 100%); } .pamm-3__bar .bar-child-white { background: linear-gradient(180deg, var(--gray-200) 0%, var(--gray-100) 100%); } .pamm-3__bar .bar-green { margin-right: 0; margin-bottom: -1em; z-index: 2; background: linear-gradient(90deg, #7BDD58 0%, #36C006 13.02%, #AAFF8C 86.46%, #7BDD58 100%); } .pamm-3__bar .bar-child-green { background: linear-gradient(180deg, #36C006 0%, #98EE7A 100%); } .pamm-3__bar-arrow { width: 80%; left: 4.1em; top: 45%; transform: rotate(0deg); } .pamm-3__bg-dots { top: 50%; height: 40.2%; right: 124%; } .pamm-3__bg-dots:after { background: radial-gradient(35.51% 49.33% at 69% 50.67%, transparent 0%, var(--black-400) 100%); } .pamm-3__bg-dots-second { top: 50%; left: 124.7%; width: 100.1%; height: 40.2%; } .pamm-3__bg-dots-second:after { background: radial-gradient(27.51% 50.33% at 25% 55.33%, transparent 0%, var(--black-400) 100%); } } .pamm-4 .container { z-index: 1; } .pamm-4__card { font-size: 16px; } .pamm-4__card-item { font-size: 20px; } .pamm-4__card-item div:first-child span { font-size: 24px; } .pamm-4__bg-dots { position: absolute; bottom: -10.6%; width: 100%; height: 33%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .pamm-4__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(59.51% 146.33% at 20% 126.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .pamm-4 .container h2 { font-size: 48px; } .pamm-4__bg-dots:after { background: radial-gradient(29.51% 100.33% at 50% 126.33%, transparent 0%, var(--black-400) 100%); } } .pamm-5 .container { z-index: 1; } .pamm-5__card-item { font-size: 20px; } .pamm-5__rectangle { width: 8px; border-radius: 12px; } .pamm-5 .white-mark + div, .pamm-5 .green-mark + div { border: 0; } .pamm-5__info h3 { font-size: 22px; } .pamm-5__info p { font-size: 12px; } @media (min-width: 768px) { .pamm-5 .container { border-radius: 2.5em; } .pamm-5 .container h2 { font-size: 48px; } } .pamm-6 .content-expanded .icon-chevron { transform: rotate(180deg); } .pamm-6 .container { position: relative; z-index: 1; } .pamm-6 .accordion-content { border-radius: 0 0 1.9em 1.9em; } .pamm-6__list-title { font-size: 18px; } .pamm-6__list h3 { font-size: 20px; } .pamm-6__bg-dots { position: absolute; top: -10.6%; width: 100%; height: 28%; transform: scale(2); background-image: url('data:image/svg+xml,'); } .pamm-6__bg-dots::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(59.51% 146.33% at 90% 126.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .pamm-6 .radius { border-radius: 1em; } .pamm-6 .accordion-content { border-radius: 0 0 1em 1em; } .pamm-6 .container h2 { font-size: 48px; } .pamm-6__bg-dots { top: 0; } .pamm-6__bg-dots:after { background: radial-gradient(36.51% 120.33% at 50% -63.67%, transparent 0%, var(--black-400) 100%); } } .inverted .pamm-2 .container { background-color: white; } .inverted .pamm-3__bar .bar-parent { background: linear-gradient(180deg, var(--gray-200) 0%, var(--black-100) 13.02%, var(--gray-100) 86.46%, var(--gray-200) 100%); } .inverted .pamm-3__bar .bar-child { background: linear-gradient(90deg, var(--gray-100) 0%, var(--gray-200) 100%); } .inverted .pamm-3__bar .bar-white { background: linear-gradient(180deg, var(--gray-300) 0%, var(--black-200) 13.02%, var(--gray-200) 86.46%, var(--gray-300) 100%); } .inverted .pamm-3__bar .bar-child-white { background: linear-gradient(90deg, var(--gray-200) 0%, var(--gray-300) 100%); } .inverted .pamm-3__bar .bar-green { background: linear-gradient(180deg, #7BDD58 0%, #36C006 13.02%, #AAFF8C 86.46%, #7BDD58 100%); } .inverted .pamm-3__bar .bar-child-green { background: linear-gradient(90deg, #36C006 0%, #98EE7A 100%); } @media (min-width: 768px) { .inverted .pamm-3__bar .bar-parent { background: linear-gradient(90deg, var(--gray-200) 0%, var(--black-100) 13.02%, var(--gray-100) 86.46%, var(--gray-200) 100%); } .inverted .pamm-3__bar .bar-child { background: linear-gradient(180deg, var(--gray-100) 0%, var(--gray-200) 100%); } .inverted .pamm-3__bar .bar-white { background: linear-gradient(90deg, var(--gray-300) 0%, var(--black-200) 13.02%, var(--gray-200) 86.46%, var(--gray-300) 100%); } .inverted .pamm-3__bar .bar-child-white { background: linear-gradient(180deg, var(--gray-200) 0%, var(--gray-300) 100%); } .inverted .pamm-3__bar .bar-green { background: linear-gradient(180deg, #7BDD58 0%, #36C006 13.02%, #AAFF8C 86.46%, #7BDD58 100%); } .inverted .pamm-3__bar .bar-child-green { background: linear-gradient(90deg, #36C006 0%, #98EE7A 100%); } } .inverted .pamm-3__bar-text span { color: var(--white); } .inverted .pamm-4__card-item { background-color: white; } .inverted .pamm-5 .container { background-color: white; } .inverted .pamm-6 .accordion-content { background-color: white; } /***********/ /* Hero #1 */ /***********/ .hero_1 { padding: 150px 0 0; } .hero_1 h1 { margin-bottom: 0.85em; } .hero_1 h1 span { white-space: nowrap; } .hero_1 h3 { color: var(--white); line-height: 1.2; } .hero_1 .image { max-width: 120px; width: 100%; margin-right: 40px; } .hero_1 .order-2 { margin-right: 0; margin-left: 40px; } .hero_1 .title { margin-bottom: 50px; } .hero_1 .box { padding: 30px 0; } .hero_1 .border { border-bottom: 1px solid rgba(var(--white-rgb), 0.2); padding-top: 50px; margin-bottom: 100px; } .hero_1 .btn { min-width: 30.5%; margin-bottom: 20px; } @media (min-width: 576px) { .hero_1 { text-align: center; } .hero_1 .box { max-width: 250px; margin: 0 auto; padding: 50px 0; } .hero_1 .image { max-width: 50%; margin: 0 auto 3em; } } @media (min-width: 992px) { .hero_1 { padding: 10em 0 5em; } .hero_1 .title { font-size: 24px; margin-bottom: 3em; } .hero_1 h1 { margin-bottom: 1.05em; } .hero_1 p { line-height: 1.4; padding: 0 4em; } .hero_1 .image { max-width: 155px; } .hero_1 .border { border-color: transparent; padding-top: 0; margin-bottom: 10em; } } @media (min-width: 1200px) { .hero_1 { padding: 20em 0 10em; } .hero_1 .title { margin-bottom: 4.7em; } } @media (orientation: landscape) and (min-width: 992px) { .hero_1 { height: 100vh; padding-top: 25vh; padding-bottom: 15vh; min-height: 600px; } .hero_1 .title { margin-bottom: 10vh; } .hero_1 h1 { margin-bottom: 6vh; font-size: 6vh; } .hero_1 h3 { font-size: 2.5vh; } .hero_1 .image { max-width: 15vh; } } @media (orientation: landscape) and (min-height: 1080px) { .hero_1 h3 { font-size: 24px; } } /***********/ /* Hero #2 */ /***********/ .hero_2 { padding: 110px 0 140px; } .hero_2 h1 { font-weight: 100; letter-spacing: 0.06em; line-height: 1.35; } @media (min-width: 768px) { .hero_2 { padding: 10em 0 5em; } } @media (min-width: 992px) { .hero_2 h1 { font-size: 36px; } } @media (min-width: 1200px) { .hero_2 { padding: 23.4em 0 15em; } } /***********/ /* Hero #3 */ /***********/ .hero_3 { padding: 130px 0 0; margin-bottom: 40px; background-position: 100% 50%; background-size: auto 100%; position: relative; } .hero_3 h1 { margin-bottom: 1.05em; text-transform: uppercase; } .hero_3 p { line-height: 1.45; margin-bottom: 1.5em; } .hero_3 .text { letter-spacing: 0.05em; margin-bottom: 90px; } .hero_3 .buttons { position: absolute; left: 5px; right: 5px; top: 100%; background: var(--black-400-rgb); border-radius: 6px; transform: translateY(-50%); padding: 10px; } @media (min-width: 992px) { .hero_3 { padding-top: 12em; margin-bottom: 0; } } @media (min-width: 1200px) { .hero_3 { padding: 17em 0 2em; min-height: 800px; } } @media (orientation: landscape) and (min-width: 992px) { .hero_3 { height: 100vh; padding-top: 20vh; min-height: 600px; } .hero_3 h1 { margin-bottom: 6vh; font-size: 6vh; } .hero_3 .text { margin-bottom: 8.5vh; } } /***********/ /* Hero #4 */ /***********/ .hero_4 { text-align: center; padding: 130px 0 25px; } .hero_4 img { margin: 0 auto 40px; } .hero_4 h1 { margin-bottom: 15px; } .hero_4 h3 { color: var(--white); margin-bottom: 40px; line-height: 1.4; } .hero_4 .text { margin-bottom: 55px; } .hero_4 .btn { min-width: 30.5%; margin-bottom: 20px; } @media (min-width: 768px) { .hero_4 { padding-top: 12em; } } @media (min-width: 992px) { .hero_4 h1 img { margin: 0 40px 0 0; /*display: inline-block; vertical-align: top; position: relative; top: 8px;*/ } .hero_4 h1 { margin-bottom: 0.65em; } .hero_4 h3 { margin-bottom: 2em; } } @media (min-width: 1200px) { .hero_4 { padding: 20em 0 8.5em; } } @media (orientation: landscape) and (min-width: 992px) { .hero_4 { height: 100vh; padding-top: 20vh; padding-bottom: 14vh; min-height: 600px; } .hero_4 h1 { margin-bottom: 3.5vh; font-size: 6vh; } .hero_4 h1 img { max-height: 5.8vh; width: auto; } .hero_4 h3 { font-size: 2.5vh; } .hero_4 .text { margin-bottom: 10vh; } } @media (orientation: landscape) and (min-height: 1080px) { .hero_4 h3 { font-size: 24px; } } /***********/ /* Hero #5 */ /***********/ .hero_5 { text-align: center; padding: 140px 0 0; position: relative; } .hero_5 .bg { background-position: 50% 100%; background-size: 100% auto; } .hero_5 h1 { font-weight: 300; text-transform: uppercase; } .hero_5 .buttons { padding: 60px 0 40px; } .hero_5 .button { display: block; vertical-align: top; background: linear-gradient(90deg, var(--red), var(--green)); font-size: 20px; text-decoration: none; position: relative; border-radius: 5px; padding: 20px 50px; } .hero_5 .button:before, .hero_5 .button:after { content: ""; position: absolute; border-radius: 5px; } .hero_5 .button:before { left: 0; right: 0; top: 0; bottom: 0; background: var(--white); opacity: 0; } .hero_5 .button:after { left: 3px; right: 3px; bottom: 3px; top: 3px; background: var(--black-300); } .hero_5 .button span, .hero_5 .button small { display: block; position: relative; z-index: 10; } .hero_5 .button span { position: relative; } .hero_5 .button small { color: var(--gray); font-size: 0.6em; padding: 5px 0 1px; } .hero_5 .button:hover { color: var(--white); } .hero_5 .button:hover:before { opacity: 1; } .hero_5 .button:hover small { color: inherit; } @media (min-width: 576px) { .hero_5 .bg { background-size: 150% auto; } .hero_5 .button { display: inline-block; } } @media (min-width: 768px) { .hero_5 { padding: 240px 0 0; } .hero_5 .button { font-size: 36px; padding: 30px 90px; } .hero_5 .button small { font-size: 0.5em; padding-top: 11px; } } @media (min-width: 992px) { .hero_5 { padding: 340px 0 0; } .hero_5 .buttons { padding: 113px 0 50px; } .hero_5 .button { padding: 44px 126px; } } @media (min-width: 1200px) { .hero_5 .bg { background-size: 100% auto; } } @media (orientation: landscape) and (min-width: 992px) { .hero_5 { height: 100vh; padding-top: 20vh; min-height: 600px; } .hero_5 h1 { margin-bottom: 3.5vh; font-size: 6vh; } .hero_5 .buttons { padding-top: 10.5vh; padding-bottom: 5vh; } .hero_5 .button { padding: 4vh 11.5vh; font-size: 3.5vh; } } /***********/ /* Hero #6 */ /***********/ .hero_6 { text-align: center; padding: 140px 0 0; position: relative; } .hero_6 .bg { background-position: 50% 70%; background-size: 100% auto; } .hero_6 h1 { text-transform: uppercase; margin-bottom: 120px; } @media (max-width: 1440px) { .hero_6 h1 { font-size: 54px; } } @media (max-width: 1199.98px) { .hero_6 h1 { font-size: 48px; } } @media (max-width: 991.98px) { .hero_6 h1 { font-size: 30px; } } @media (min-width: 576px) { .hero_6 .bg { background-position: 50% 40%; } } @media (min-width: 768px) { .hero_6 { text-align: left; } .hero_6 .bg { background-position: 50% 100%; } .hero_6 h1 { margin-bottom: 70px; } } @media (min-width: 992px) { .hero_6 { padding-top: 250px; padding-bottom: 75px; } .hero_6 .text { padding-top: 80px; font-size: 20px; letter-spacing: 0.05em; } } @media (orientation: landscape) and (min-width: 992px) { .hero_6 { height: 100vh; padding-top: 15vh; padding-bottom: 10vh; min-height: 600px; } .hero_6 .bg { background-position: 50% 100%; } .hero_6 h1 { margin-bottom: 6.5vh; font-size: 5.5vh; } .hero_6 .text { padding-top: 7vh; } .hero_6 img { max-height: 60vh; width: auto; min-height: 360px; } } /***********/ /* Hero #7 */ /***********/ .hero_7 { overflow: hidden; } .hero_7 .image_wrapper { width: 450px; } .hero_7 .btn-primary, .hero_7 .tabulator .tabulator-footer .tabulator-paginator button, .tabulator .tabulator-footer .tabulator-paginator .hero_7 button { background-color: transparent; } .hero_7 .text { max-width: 660px; } .hero_7 .image_wrapper { position: relative; } .hero_7 .image { padding-bottom: 75%; } .hero_7 picture:last-child { display: none; } .inverted .hero_7 picture:last-child { display: block; } .inverted .hero_7 picture:first-child { display: none; } @media (max-width: 767.98px) { .hero_7:before { background: linear-gradient(180deg, rgba(14, 14, 14, 0) 0%, rgba(92, 224, 46, 0.05) 100%); content: ""; height: 100%; max-height: 515px; top: auto; } .hero_7 h1 { font-size: 26px; line-height: 1.2; } .hero_7 .text { line-height: 1.4; } } @media (min-width: 768px) { .hero_7 .image_wrapper { width: 830px; } } @media (min-width: 1200px) { .hero_7 .text { font-size: 20px; } } /***********/ /* Hero #8 */ /***********/ .hero_8:before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 380px; background: linear-gradient(180deg, rgba(var(--black-400-rgb), 0) 0%, var(--black-400) 100%); } .hero_8_text { font-size: 24px; font-weight: 700; } .hero_8_text big { font-size: 2.66em; font-weight: 900; line-height: 0.9; } .hero_8 .infobox .icon { flex: 1 0 16px; margin-right: 10px; height: 16px; max-width: 16px; } .hero_8 h2 { font-size: 36px; } .hero_8 .counter { font-size: 18px; } .hero_8 .counter strong { font-size: 2em; } .hero_8_carousel .card { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); background: rgba(var(--black-400-rgb), 0.01); border-radius: 12px; border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 3px 24px rgba(var(--white-rgb), 0.05); opacity: 0.3; text-align: center; transition: opacity 0.3s; width: calc(50vw - 30px); } .hero_8_carousel .card:after { background: var(--red); border-radius: 12px 12px 0 0; bottom: 0; content: ""; height: 6px; left: 30px; position: absolute; right: 30px; } .hero_8_carousel picture { height: 80px; } .hero_8_carousel h4 { font-size: 24px; } .hero_8_carousel .flickity-slider { will-change: transform; } .hero_8_carousel .flickity-viewport { overflow: visible; } .hero_8_carousel .card_wrapper { transition: opacity 0.6s 3s ease-in-out; will-change: transform, opacity; } .hero_8_carousel .is-selected .card { opacity: 1; } .hero_8_carousel .is-selected { opacity: 0; transform: scale(0.5); } @media (min-width: 576px) { .hero_8_carousel .card { max-width: 33vw; } .hero_8_carousel .is-selected + .card_wrapper + .card_wrapper .card { opacity: 0.1; } } @media (min-width: 768px) { .hero_8_text { font-size: 32px; } .hero_8_text big { font-size: 3em; line-height: 0.9; } .hero_8 .infobox { left: 15px; position: absolute; right: 15px; top: 100%; } .hero_8_carousel { transform: scaleX(-1); } .hero_8_carousel .card { transform: scaleX(-1); } .hero_8_carousel .card { max-width: 25vw; } } @media (min-width: 992px) { .hero_8_text { font-size: 48px; } .hero_8_text big { font-size: 3em; line-height: 0.9; } .copy_code_box { border-radius: 10px; } .copy_code_box_field { font-size: 36px; } .hero_8_carousel .card picture { height: 120px; } .hero_8_carousel h4 { font-size: 36px; } } @media (min-width: 1200px) { .hero_8_carousel .card { max-width: 265px; } } @media (min-width: 1300px) { .hero_8_carousel { margin-left: calc((100vw - 1300px + 40px) / -2) !important; } } /***********/ /* Hero #9 */ /***********/ .hero_9 { overflow: hidden; margin-bottom: 120px; padding-top: 65px; } .hero_9 .image { margin-left: 35%; margin-right: -15%; max-width: 450px; position: relative; } .hero_9 .image_bg { position: absolute; right: 0; top: -60px; width: 80%; display: none; } .hero_9 .text { font-size: 14px; max-width: 620px; line-height: 1.4; } .hero_9 .btn { max-width: 360px; } .inverted .hero_9 .image_bg { display: block; } @media (min-width: 768px) { .hero_9 { padding-top: 165px; margin-bottom: 255px; } .hero_9 p { margin-bottom: 3.8em; } .hero_9 .image { position: absolute; left: 63.5%; max-width: 754px; width: 50%; margin: 0; } .hero_9 .image_bg { right: 30%; max-width: 520px; } .hero_9 .text { font-size: 24px; } } @media (min-width: 1200px) { .hero_9 { /*p { margin-bottom: 3.8em; } .image { position:absolute; left: 63.5%; max-width: 754px; width: 50%; margin: 0; } .text { font-size: 24px; }*/ } .hero_9 h1 { /*.part_1 { font-size: 6em; } .part_2 { font-size: 9em; } .part_3 { font-size: 4em; }*/ } } /************/ /* Hero #10 */ /************/ .hero_10 { padding-top: 120px; } .hero_10 .badge { font-size: inherit; line-height: inherit; padding: 0 5px; text-transform: none; } .hero_10 .card { -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 12px; font-weight: 400; position: relative; transition: all 0.15s; background-color: var(--black-200); } .hero_10 .card:before { border-radius: 24px 24px 0px 0px; bottom: 100%; content: ""; height: 12px; left: 20px; position: absolute; width: 164px; } .hero_10 .card-white:before { background: var(--white); } .hero_10 .card-red:before { background: var(--red); } .hero_10 .card-green:before { background: var(--green); } .hero_10 .card-yellow:before { background: var(--yellow); } @media (min-width: 992px) { .hero_10 { padding-top: 180px; } .hero_10 .card { border-radius: 24px; flex: 1 1 360px; min-width: 0; } } @media (min-width: 1200px) { .hero_10 { padding-top: 265px; } } /************/ /* Hero #11 */ /************/ .hero_11 form { position: relative; } .hero_11 button { position: absolute; right: 0; top: 5px; } .hero_11 .search_form { background: var(--black-300); border-radius: 12px; } /************/ /* Hero #12 */ /************/ .hero_12 { padding-top: 64px; overflow: hidden; } .hero_12 li { margin-bottom: 10px; } .hero_12 li:nth-child(1) { font-size: 40px; opacity: 0.9; } .hero_12 li:nth-child(2) { font-size: 30px; opacity: 0.65; } .hero_12 li:nth-child(3) { font-size: 24px; opacity: 0.5; } .hero_12 li:nth-child(4) { font-size: 18px; opacity: 0.35; } .hero_12 li:nth-child(5) { font-size: 14px; opacity: 0.25; } .hero_12 .box { position: relative; } .hero_12 .box-2 { position: absolute; left: 14%; top: 28%; } .hero_12__bg-1 { position: absolute; width: 100%; height: 100%; top: 0; transform: scale(2); background-image: url('data:image/svg+xml,'); } @media (min-width: 768px) { .hero_12__bg-1 { top: 55%; right: 25%; height: 63%; } } .hero_12__bg-1::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(81.51% 15.33% at 5% 35.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .hero_12__bg-1::after { background: radial-gradient(19.51% 54.33% at 42% 50.33%, transparent 0%, var(--black-400) 100%); } } .hero_12__bg-2 { position: absolute; width: 100%; height: 100%; top: 0; transform: scale(2); background-image: url('data:image/svg+xml,'); } @media (min-width: 768px) { .hero_12__bg-2 { width: 44%; top: 55%; right: 0; height: 63%; } } .hero_12__bg-2::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(81.51% 15.33% at 5% 35.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .hero_12__bg-2::after { background: radial-gradient(17.51% 52.33% at 60% 54.33%, transparent 0%, var(--black-400) 100%); } } .hero_12_image_2 { margin: 0 auto; width: 90vw; max-width: 25rem; position: relative; } .hero_12_image_3 { left: 45%; max-width: 80vw; position: absolute; top: 70px; width: 400px; } .hero_12_image_4 { position: absolute; right: 100%; margin-right: 100px; width: 93px; top: -50px; } @media (min-width: 768px) { .hero_12 { overflow: visible; } .hero_12 .box-2 { left: 40%; top: 36%; } .hero_12_image { left: 100%; max-width: 905px; position: absolute; top: 0; width: 100%; } .hero_12_image_2 { left: 100%; max-width: 573px; position: absolute; top: 0; width: 100%; } .hero_12_image_3 { left: 70%; max-width: 40vw; } } @media (min-width: 992px) { .hero_12_image { left: 90%; width: 50vw; } .hero_12_image_2 { left: 90%; width: 50vw; } .hero_12_image_3 { left: 90%; top: -40px; } } @media (min-width: 1200px) { .hero_12 li:nth-child(1) { font-size: 48px; } .hero_12 li:nth-child(2) { font-size: 36px; opacity: 0.65; } } /************/ /* Intro #1 */ /************/ .intro_1 { text-align: center; padding: 0 0 75px; } .intro_1 h2 { margin-bottom: 30px; } .intro_1 .title { font-size: 18px; letter-spacing: 0.05em; margin-bottom: 60px; } .intro_1 .image { margin: 0 -20px 60px; } .intro_1 .image img { margin: 0 auto; } .intro_1 .text { margin-bottom: 4em; font-size: 16px; margin-bottom: 75px; } .intro_1 .arrow { margin: 0 auto; width: 47px; } .intro_1 .btn { min-width: 30.5%; margin-bottom: 20px; } @media (min-width: 576px) { .intro_1 .image { margin-left: 0; margin-right: 0; } .intro_1 .btn { min-width: 190px; margin: 0 1.1em 0 0; } .intro_1 .btn:last-child { margin-right: 0; } } @media (min-width: 992px) { .intro_1 { padding: 6.4em 0 6.2em; } .intro_1 h2 { margin-bottom: 0.28em; } .intro_1 .title { font-size: 24px; margin-bottom: 4.2em; } .intro_1 .image { margin-bottom: 5em; } .intro_1 .text { font-size: 18px; margin-bottom: 4em; line-height: 1.2; } .intro_1 .btn { min-width: 250px; } } @media (min-width: 1200px) { .intro_1 .title { font-size: 36px; } .intro_1 .text { font-size: 24px; } } /************/ /* Intro #2 */ /************/ .intro_2 { padding: 100px 0 80px; } .intro_2 h2 { margin-bottom: 1.4em; } .intro_2 p { line-height: 1.45; } .intro_2 .text { margin-bottom: 60px; } .intro_2 .btn { min-width: 30.5%; margin-bottom: 20px; } @media (min-width: 576px) { .intro_2 .btn { min-width: 30.5%; margin: 0 1.1em 0 0; } } @media (min-width: 1200px) { .intro_2 { padding: 5em 0; min-height: 44.5em; } .intro_2 .text { margin-bottom: 5.65em; } .intro_2 .buttons { margin-bottom: 0.5em; } } /************/ /* Intro #3 */ /************/ .intro_3 { position: relative; text-align: center; padding: 60px 0 40px; overflow: hidden; } .intro_3 .bg { padding-bottom: 35%; background-size: contain; margin: 0 -20px 20px; } .intro_3 img { margin: 0 auto; max-width: 150px; } .intro_3 h2 { margin-bottom: 10px; } .intro_3 h3 { color: var(--white); font-weight: 400; max-width: 700px; margin: 0 auto; line-height: 1.4; } .intro_3 .image { padding-top: 40px; } .intro_3 .bg_2 { display: none; } .inverted .intro_3 { background: var(--black); } .inverted .intro_3 .bg_1 { display: none !important; } .inverted .intro_3 .bg_2 { display: block; } @media (max-width: 575.98px) { .intro_3 h2 { font-size: 30px; } } @media (min-width: 576px) { .intro_3 { padding-top: 50px; } .intro_3 h2 { margin: 0; } } @media (min-width: 768px) { .intro_3 { padding: 90px 0; } .intro_3 .bg { position: absolute; top: 0; left: 0; right: 0; height: 100%; padding: 0; margin: 0; } .intro_3 .image { padding: 80px 0; } } @media (min-width: 992px) { .intro_3 .image { padding: 100px 0; } .intro_3 img { max-width: 234px; } } @media (min-width: 1200px) { .intro_3 { padding: 135px 0 110px; } .intro_3 .image { padding: 9.55em 0 9.4em; } } /************/ /* Intro #4 */ /************/ .intro_4 { overflow: hidden; } .intro_4 .bg { background-color: var(--black-300); border-radius: 20px; left: 15px; right: 15px; top: 120px; } .intro_4 h3 { font-size: 36px; text-transform: uppercase; } .intro_4 .figure_1, .intro_4 .figure_2 { height: 200px; position: absolute; width: 200px; } .intro_4 .figure_1 { left: -65px; bottom: -65px; } .intro_4 .figure_2 { right: -65px; top: -65px; } @media (min-width: 768px) { .intro_4 .image { bottom: 0; left: 30px; position: absolute; right: 30px; } .intro_4 .bg { border-radius: 0px 20px; top: 0; } .intro_4 h3 { font-size: 24px; } .intro_4 .bg:before, .intro_4 .bg:after { background-color: inherit; content: ""; height: 65px; position: absolute; width: 65px; } .intro_4 .bg:before { right: 100%; bottom: 100%; border-radius: 20px 20px 0px 20px; } .intro_4 .bg:after { left: 100%; top: 100%; border-radius: 0px 20px 20px 20px; } } @media (min-width: 768px) { .intro_4 { padding-top: 250px !important; } } @media (min-width: 1200px) { .intro_4 h3 { font-size: 36px; } } /************/ /* Intro #5 */ /************/ .intro_5:before { background: linear-gradient(180deg, rgba(var(--black-400-rgb), 0) 50%, rgba(var(--green-rgb), 0.05) 100%); content: ""; bottom: 80px; } .intro_5 .container { z-index: 10; } .intro_5 .container { z-index: 10; } .intro_5_1 .container:before { display: none; } .intro_5_1:before { top: 100%; bottom: auto; height: 100%; } .intro_5_1:after { background: linear-gradient(180deg, rgba(var(--black-400-rgb), 0) 0%, rgba(var(--green-rgb), 0.05) 100%); content: ""; } .intro_5 picture:last-child { display: none; } .inverted .intro_5 picture:first-child { display: none; } .inverted .intro_5 picture:last-child { display: block; margin-top: -70px; } @media (max-width: 767.98px) { .intro_5:before { background: linear-gradient(180deg, rgba(var(--green-rgb), 0.05) 0%, rgba(var(--black-400-rgb), 0) 100%); bottom: auto; height: 100%; max-height: 515px; } .intro_5 .container:before { background: rgba(var(--white-rgb), 0.05); content: ""; left: 30px; right: 30px; border-radius: 20px; } .intro_5 .text { text-align: center; line-height: 1.4; } .intro_5_1 .text { text-align: left; } .intro_5_1 picture { margin-left: -20px; max-width: calc(100% + 20px); } } @media (min-width: 768px) { .intro_5:after { background: linear-gradient(180deg, rgba(var(--green-rgb), 0.05) 0%, rgba(var(--black-400-rgb), 0) 50%); content: ""; bottom: auto; top: calc(100% - 80px); height: 800px; } .intro_5_1:after { top: 50%; height: 100%; } .intro_5_1:before { bottom: 50%; top: auto; } } @media (min-width: 1200px) { .intro_5 picture { margin-left: -60px; max-width: calc(100% + 60px); } .intro_5_1 picture { margin-left: 0; } } /************/ /* Intro #6 */ /************/ .intro_6 .card { margin: 0 10px; } .intro_6 .tns-controls [data-controls=prev] { left: -20px; border-radius: 0 25px 25px 0; } .intro_6 .tns-controls [data-controls=next] { right: -20px; border-radius: 25px 0 0 25px; } .intro_6 .affiliate_grid .card_data .title { font-weight: 700; color: #fff; } .intro_6 .nav_item { border: 1px solid var(--black-300); background: var(--black-300); border-radius: 10px; margin-bottom: 10px; padding: 12px 15px; text-align: left; } .intro_6 .nav_item:last-child { margin-bottom: 0; } .intro_6 .nav_item:hover { background: transparent; } .intro_6 .nav_item.active { background-color: rgba(var(--green-rgb), 0.1); border-color: transparent; } .intro_6 .nav_item_inner { flex: 1 1 auto; min-width: 0; } .intro_6 .affiliate_grid .card { margin: 0; } @media (max-width: 991.98px) { .intro_6 .tabs_container { overflow: visible; margin: 0 10px; } .intro_6 .tab { position: relative; opacity: 1; visibility: visible; min-height: unset; min-width: unset; } .intro_6 .cards:after { content: "flickity"; display: none; /* hide :after */ } .intro_6 .card_wrapper { max-width: 360px; } } @media (min-width: 992px) { .intro_6 .row { transform: none !important; } .intro_6 .affiliate_grid .card_body { height: 207px; } .intro_6 .affiliate_grid .card_footer { max-width: 50%; } .intro_6 .affiliate_grid .card_data_inner { position: absolute; right: 30px; bottom: -252px; } .intro_6 .affiliate_grid .card_data .value { font-size: 18px; } .intro_6 .affiliate_grid .card_data .data_small .value { font-size: 14px; } .intro_6 .affiliate_grid .card .btn { position: absolute; right: 30px; bottom: 338px; } .intro_6 .affiliate_grid .card_header { border-bottom: none; } .intro_6 .affiliate_grid .card_data .title { font-size: 14px; } } /************/ /* Intro #7 */ /************/ .intro_7 { overflow: hidden; position: relative; } .intro_7:before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 380px; background: linear-gradient(180deg, var(--black-400) 0%, rgba(var(--black-400-rgb), 0) 100%); z-index: 10; } .intro_7 .container { z-index: 20; } .intro_7 .infobox .icon { flex: 1 0 16px; margin-right: 10px; height: 16px; max-width: 16px; } .intro_7_carousel { position: relative; z-index: 10; } .intro_7_carousel .is-selected { z-index: 10; } .intro_7_carousel .icon { height: auto; width: 84px; position: relative; } .intro_7_carousel .icon:before { content: ""; padding-bottom: 100%; } .intro_7_carousel h3 { font-size: 24px; font-weight: 400; } .intro_7_carousel .card { width: 100%; } .intro_7_carousel .card_image { padding-bottom: 65%; position: relative; } .intro_7_carousel .intro_7_carousel_bg { right: -60vw; left: -30px; transition: transform 0.4s ease-in-out; will-change: transform; } .intro_7_carousel[data-step="1"] .intro_7_carousel_bg { transform: translateX(-10vw); } .intro_7_carousel[data-step="2"] .intro_7_carousel_bg { transform: translateX(-20vw); } .intro_7_carousel[data-step="3"] .intro_7_carousel_bg { transform: translateX(-30vw); } .intro_7_carousel[data-step="4"] .intro_7_carousel_bg { transform: translateX(-40vw); } .intro_7_carousel[data-step="5"] .intro_7_carousel_bg { transform: translateX(-50vw); } .intro_7_carousel[data-step="6"] .intro_7_carousel_bg { transform: translateX(-60vw); } .intro_7_carousel_1 .flickity-page-dots { display: none; } .intro_7_carousel_2 .flickity-page-dots { bottom: -165px; } .intro_7_carousel_2 .flickity-page-dots .dot { border: 2px solid var(--gray-200); background: var(--black-100); width: 12px; height: 12px; opacity: 1; } .intro_7_carousel_2 .flickity-page-dots .dot.is-selected { background: var(--green); border-color: var(--green); } @media (max-width: 767.98px) { .intro_7_carousel .container { -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); background: rgba(var(--black-400-rgb), 0.01); border-radius: 12px; border-radius: 20px; border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); max-width: 350px !important; } .intro_7_carousel .card_text { min-height: 55px; text-align: center; } } @media (min-width: 768px) { .intro_7_carousel .box { -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); background: rgba(var(--black-400-rgb), 0.01); border-radius: 20px; border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); font-size: 14px; padding: 8vw 4vw; } .intro_7_carousel .card_image { padding-bottom: 75%; } .intro_7_carousel .icon { flex: 0 0 60px; } .intro_7_carousel h3 { font-size: 3vw; } .intro_7_carousel_2 .flickity-page-dots { bottom: -35px; right: 0; left: -76%; width: auto; } } @media (min-width: 992px) { .intro_7_carousel_2 .flickity-page-dots { left: calc(-100% - 30px); } .intro_7_carousel .icon { flex: 0 0 74px; } } @media (min-width: 1200px) { .intro_7_carousel .card_image { padding-bottom: 85%; } .intro_7_carousel .icon { flex: 0 0 84px; } .intro_7_carousel h3 { font-size: 36px; } } /************/ /* Intro #8 */ /************/ .intro_8 h2 { letter-spacing: 0; } .intro_8 h4 { font-weight: 900; font-size: 36px; } .intro_8 h3 { font-weight: 400; } .intro_8 .card { background-color: rgba(var(--black-300-rgb), 0.05); border: 1px solid rgba(var(--white-rgb), 0.05); box-sizing: border-box; box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; } .intro_8 .card_bg { position: absolute; left: 20%; top: 50%; transform: translateY(-50%); width: 60%; } .intro_8 .card_bg:before { content: ""; padding-bottom: 100%; } .intro_8 .card_bg .icon { opacity: 0.05; width: 100%; height: 100%; } .intro_8 .card_text { position: relative; } .intro_8 .card_image { position: relative; } .intro_8 table th, .intro_8 table td { vertical-align: middle; padding: 10px; } .intro_8 table th:first-child, .intro_8 table td:first-child { padding-left: 15px; width: 20%; } .intro_8 table th:last-child, .intro_8 table td:last-child { padding-right: 15px; } .intro_8 table th:nth-child(2), .intro_8 table td:nth-child(2) { width: 40%; } .intro_8 table th:nth-child(3), .intro_8 table td:nth-child(3) { width: 20%; } .intro_8 tbody tr:nth-child(odd) td { background: rgba(var(--white-rgb), 0.03); } .inverted .intro_8 .card > picture { opacity: 0.05; } @media (max-width: 767.98px) { .intro_8 .card_text { text-align: left; } .intro_8 .card_bg { width: 40%; left: auto; right: 10%; max-width: 175px; } .intro_8 h4.small { font-size: 36px; } } @media (min-width: 768px) { .intro_8 h4 { font-size: 48px; } .intro_8 table td:first-child, .intro_8 table th:first-child { padding-left: 65px; } .intro_8 table td:last-child, .intro_8 table th:last-child { padding-right: 65px; } } /************/ /* Intro #9 */ /************/ .intro_9 h3 { font-size: 24px; } .intro_9 big { font-size: 36px; font-weight: 900; } @media (max-width: 767.98px) { .intro_9 h2 { font-size: 36px; } .intro_9 .box_1 .text { flex: 1 1 50%; min-width: 0; } .intro_9 .box_1 picture { flex: 1 1 50%; min-width: 0; } .intro_9 .box_2 .text { flex: 1 1 40%; min-width: 0; } .intro_9 .box_2 picture { flex: 1 1 60%; min-width: 0; } } @media (min-width: 768px) { .intro_9 .box_1 .text { padding-left: 20%; } .intro_9 .box_2 .text { padding-left: 20%; } } /*************/ /* Intro #10 */ /*************/ .intro_10 h3 { font-size: 24px; } .intro_10 big { font-size: 36px; font-weight: 900; } .intro_10 .card { background-color: rgba(var(--black-300-rgb), 0.05); border: 1px solid rgba(var(--white-rgb), 0.05); box-sizing: border-box; box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; } /*************/ /* Intro #11 */ /*************/ .intro_11 .gradient { background: linear-gradient(180deg, rgba(var(--black-500-rgb), 0) 0%, rgba(var(--black-600-rgb), 0.32) 100%); } .intro_11 .intro_11_bg { position: absolute; left: 0; right: 0; opacity: 0.2; } .intro_11 .intro_11_bg img { width: 100%; } .intro_11 .intro_11_bg:before, .intro_11 .intro_11_bg:after { content: ""; position: absolute; left: 0; right: 0; height: 20vh; background: linear-gradient(180deg, rgba(var(--black-400-rgba), 0) 0%, var(--black-400) 100%); } .intro_11 .intro_11_bg:before { top: 0; transform: scaleY(-1); } .intro_11 .intro_11_bg:after { top: 0; } .intro_11 .flickity-viewport { width: 100%; overflow: visible; } .intro_11 .card { background-color: rgba(var(--black-300-rgb), 0.05); border: 1px solid rgba(var(--white-rgb), 0.05); box-sizing: border-box; box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; white-space: normal; } .intro_11 h3 { font-size: 24px; } .intro_11 big { font-size: 36px; font-weight: 900; } .intro_11 .card { background-color: rgba(var(--black-300-rgb), 0.05); border: 1px solid rgba(var(--white-rgb), 0.05); box-sizing: border-box; box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; } .intro_11 .card picture { height: 7.2rem; width: 7.2rem; } .intro_11 .flickity-page-dots { bottom: -45px; } .intro_11 .flickity-slider > div { min-height: 100%; opacity: 0.12; transition: opacity 0.3s; will-change: opacity; } .intro_11 .flickity-slider > div.is-selected { opacity: 1; } .intro_11 .flickity-slider > div.is-selected + div { opacity: 0.5; } .intro_11 .flickity-slider > div.is-selected + div + div { opacity: 0.25; } @media (min-width: 768px) { .intro_11 .flickity-page-dots { left: 50%; width: auto; right: 15px; text-align: right; bottom: -66px; } .intro_11 .col-md-6 { max-width: 49.99%; } } @media (min-width: 992px) { .intro_11 .col-lg-4 { max-width: 33.333%; } } /*************/ /* Intro #12 */ /*************/ .intro_12 { padding: 40px 0; } .intro_12 .box_1 { margin-bottom: 45vw; } .intro_12 .box_1 picture { min-width: 56px; } .intro_12 .box_2 { background: rgba(var(--black-400-rgb), 0.01); border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; } .intro_12 .image { padding-bottom: 200px; position: relative; } .intro_12 .image picture { top: auto; z-index: 10; } @media (min-width: 576px) { .intro_12 .box_1 { margin-bottom: 35vw; } } @media (min-width: 768px) { .intro_12 { padding: 200px 0 100px; } .intro_12 .box_1 { background: rgba(var(--black-400-rgb), 0.01); border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; margin-bottom: 0; } } @media (min-width: 992px) { .intro_12 { padding-top: 270px; } } /*************/ /* Intro #14 */ /*************/ .intro_14 { position: relative; padding-top: 130px; padding-bottom: 214px; } @media (min-width: 768px) { .intro_14 { padding-top: 196px; } } .intro_14 .box { border-radius: 24px; } .intro_14__picture-wrap { position: absolute; width: 256px; height: 256px; top: 15em; right: -9em; } @media (min-width: 768px) { .intro_14__picture-wrap { top: -85px; right: -77px; } } .intro_14__picture-wrap::after { content: ""; position: absolute; background: rgba(92, 224, 46, 0.06); filter: blur(64px); transform: matrix(-1, 0, 0, 1, 0, 0); width: 160px; height: 142px; top: 0; right: 100px; } .intro_14__picture { width: 160px; height: 142px; } .intro_14__title { font-weight: 700; font-size: 36px; line-height: 43px; opacity: 0.88; color: var(--white); letter-spacing: 0; margin-right: -20px; margin-bottom: 32px; } .intro_14__description { font-weight: 400; font-size: 24px; line-height: 28px; color: rgba(255, 255, 255, 0.48); } .intro_14_figure_2 { max-width: 420px; margin-top: -26px; margin-bottom: 67px; } @media (min-width: 768px) { .intro_14_picture { right: -90px; top: -120px; } } /*************/ /* Intro #15 */ /*************/ .intro_15 { position: relative; } .intro_15 .container { z-index: 1; } .intro_15 .box { mix-blend-mode: normal; box-shadow: 0 0 48px rgba(0, 0, 0, 0.06); border-radius: 24px; padding: 64px 32px 130px; margin-bottom: 32px; position: relative; } .intro_15 .box__title { max-width: 120px; margin-bottom: 25px; } @media (min-width: 576px) { .intro_15 .box__title { max-width: unset; } } .intro_15 .box__date-row { display: flex; align-items: center; font-weight: 700; font-size: 24px; line-height: 28px; opacity: 0.88; color: var(--white); margin-bottom: 48px; } .intro_15 .box__calendar-icon-wrap { display: flex; width: 32px; height: 32px; margin-right: 12px; } .intro_15 .box__calendar-icon { width: 100%; height: 100%; } .intro_15__img-wrap { position: absolute; top: -116px; right: 8px; z-index: 1; } .intro_15__btn { font-weight: 700; font-size: 24px; line-height: 28px; margin-bottom: 118px; } .intro_15__btn svg { margin: 0 20px 0 4px; } .intro_15 picture { position: absolute; } .intro_15 .picture-1 { left: -7vw; top: 8vw; max-width: 11vw; } .intro_15 .picture-2 { right: 9.5vw; top: 0; max-width: 22vw; } .intro_15 .picture-3 { top: 50%; right: -5.5vw; transform: translateY(-50%); max-width: 10vw; } .intro_15 .picture-4 { right: 30px; bottom: 0; max-width: 26vw; } .intro_15 .picture-5 { top: 0; right: 40px; top: 90px; } .intro_15 .picture-6 { top: 0; right: -20px; } .intro_15 .picture-7 { top: -140px; right: 20px; width: 250px; } .intro_15 .picture-8 { right: 1.5rem; top: -9rem; width: 235px; max-width: 50%; } @media (min-width: 768px) { .intro_15 .picture-8 { width: 370px; } } .intro_15__bg-1 { position: absolute; width: 100%; height: 100%; top: 0; transform: scale(2); background-image: url('data:image/svg+xml,'); } @media (min-width: 768px) { .intro_15__bg-1 { top: 15%; right: 25%; height: 63%; } } .intro_15__bg-1::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(81.51% 15.33% at 5% 35.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .intro_15__bg-1::after { background: radial-gradient(33.51% 38.33% at 41% 50.33%, transparent 0%, var(--black-400) 100%); } } .intro_15__bg-2 { position: absolute; width: 100%; height: 100%; top: 0; transform: scale(2); background-image: url('data:image/svg+xml,'); } @media (min-width: 768px) { .intro_15__bg-2 { width: 44%; top: 15%; right: 0; height: 63%; } } .intro_15__bg-2::after { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(81.51% 15.33% at 5% 35.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } @media (min-width: 768px) { .intro_15__bg-2::after { background: radial-gradient(36.51% 38.33% at 60% 43.33%, transparent 0%, var(--black-400) 100%); } } @media (min-width: 768px) { .intro_15 { padding-top: 60px; padding-bottom: 180px; } .intro_15 .picture-7 { top: -190px; right: 20px; width: 550px; max-width: 60vw; } .intro_15 .box-a { max-width: 600px; } } .intro-15-card { font-weight: 400; position: relative; border-radius: 24px; border: 3px dashed var(--green); background: rgba(92, 224, 46, 0.02); margin-left: -10px; margin-right: -10px; padding: 48px 32px; } @media (min-width: 768px) { .intro-15-card { padding: 64px; } } .intro-15-card h1 { font-size: 36px; } .intro-15-card__date-row { font-weight: 700; line-height: 28px; opacity: 0.88; margin-bottom: 48px; } .intro-15-card__calendar-icon-wrap { display: flex; width: 32px; height: 32px; margin-right: 12px; } .intro-15-card__calendar-icon { width: 100%; height: 100%; } .intro-15-card__images { position: absolute; top: -37%; right: 4%; transform: translateX(52%); } @media (min-width: 768px) { .intro-15-card__images { top: -170%; right: -7%; transform: none; } } .intro-15-card__images img:first-child { position: relative; } @media (min-width: 768px) { .intro-15-card__images img:first-child { width: 579px; height: 472px; } } .intro-15-card__images img:last-child { position: absolute; top: 0em; right: 21em; width: 66%; } @media (min-width: 768px) { .intro-15-card__images img:last-child { top: 8em; right: 2em; width: 232px; height: 124px; } } .intro-15-card__images:before { content: ""; position: absolute; right: 3em; bottom: 2em; width: 96px; height: 96px; background: #5CE02E; filter: blur(90px); } .intro-15-card:before { border-radius: 24px 24px 0 0; bottom: 100%; content: ""; height: 12px; left: 9%; position: absolute; width: 36%; background: var(--green); } /*************/ /* Intro #16 */ /*************/ .intro_16 { padding: 100px 0; } .intro_16 .box { font-weight: 400; border: 1px solid var(--black-100); position: relative; border-radius: 24px; margin-left: -10px; margin-right: -10px; } .intro_16 .box__title { font-weight: 700; font-size: 36px; line-height: 42px; color: #5CE02E; letter-spacing: 0; } .intro_16 .box__description { font-weight: 400; font-size: 18px; line-height: 21px; color: rgba(255, 255, 255, 0.64); } .intro_16 .box:before { border-radius: 24px 24px 0 0; bottom: 100%; content: ""; height: 12px; left: 9%; position: absolute; width: 36%; background: var(--green); } .intro_16 .figure_2 { position: absolute; right: 0; top: -30px; width: 160px; } .intro_16 .figure_1 { position: absolute; left: 0; bottom: -30px; width: 160px; } .intro_16 picture { width: 65%; margin: -50px auto 0; max-width: 300px; } .intro_16 .text a { font-size: 18px; } .intro_16 .text .icon { flex-shrink: 0; } @media (min-width: 768px) { .intro_16 picture { position: absolute; left: 15%; width: auto; max-width: unset; right: 15%; bottom: 0; } } /*************/ /* Intro #17 */ /*************/ .intro-17-glow { position: absolute; top: 50vh; transform: translateY(-50%); max-width: 50%; z-index: 20; pointer-events: none; } .intro-17-glow-1 { left: 0; } .intro-17-glow-2 { right: 0; } .intro-17 { letter-spacing: 0; z-index: 30; } .intro-17 h1 { letter-spacing: 0; } .intro-17 .btn { min-width: 170px; } .intro-17 .radius { border-radius: 0.8em; } .intro-17 .arrow { position: relative; } .intro-17 .arrow:before, .intro-17 .arrow:after { content: ""; } .intro-17 .arrow:before { border: 1px solid transparent; border-left-color: currentColor; border-bottom-color: currentColor; transform: rotate(45deg); width: 8px; height: 8px; } .intro-17 .arrow:after { height: 1px; background-color: currentColor; width: calc(100% + 8px); margin-left: -8px; } .intro-17 .chart { position: absolute; max-width: 45%; } .intro-17 .chart-1 { left: 55%; bottom: -30px; width: 320px; margin-left: 2vw; } .intro-17 .chart-2 { right: 55%; top: -30px; width: 256px; margin-right: 3vw; } .intro-17 picture { max-width: 415px; } @media (min-width: 768px) { .intro-17 .label, .intro-17 .arrow { flex: 1 1 50%; min-width: 0; } .intro-17 .chart-1 { left: 100%; bottom: auto; top: 0; } .intro-17 .chart-2 { right: 100%; top: auto; bottom: 0; } } @media (min-width: 1200px) { .intro-17 picture { position: relative; right: 40px; top: -30px; } } .intro-17__banners { overflow: hidden; } .intro-17__banners:after { content: "flickity"; display: none; } .intro-17__banner_wrapper { width: 100%; min-height: 100%; overflow: hidden; } .intro-17__banner { min-height: 100%; } .intro-17 .flickity-button { display: none; } .intro-17 .flickity_carousel .flickity-page-dots { justify-content: start; padding: 0; margin-top: 0; } .intro-17 .flickity_carousel .flickity-page-dots .dot { padding: 0; margin: 4px; } .intro-17 .flickity_carousel .flickity-page-dots .dot::before { width: 8px; height: 8px; } .intro-17__introduction { color: #3a3a3a; } .intro-17__title { color: var(--e2); } .intro-17__subtitle { color: var(--a1); } @media (min-width: 1200px) { .intro-17 > .container { max-width: 1206px; } .intro-17__banners { padding-top: 59px !important; } .intro-17__banner { min-height: 606px; width: 100%; } .intro-17__banner > .row { display: grid; grid-template-columns: minmax(0, 656px) 460px; gap: 30px; width: 100%; margin: 0; } .intro-17__banner > .row > .intro-17__copy, .intro-17__banner > .row > .intro-17__visual { width: 100%; max-width: none; padding: 0; } .intro-17__banner > .row > .intro-17__copy { padding-top: 32px; } .intro-17__introduction { font-size: 32px; line-height: 38px; margin-bottom: 16px !important; } .intro-17__title { font-size: 72px; line-height: 84px; margin-bottom: 48px !important; } .intro-17__subtitle { font-size: 32px; line-height: 38px; margin-bottom: 80px !important; } .intro-17__actions { gap: 30px; } .intro-17__actions .banner-button { flex: 0 0 auto; width: auto !important; min-width: 166px; height: 60px; padding-inline: 24px; margin: 0 !important; border-radius: 6px; color: #36c006; border: 1.5px solid rgba(54, 192, 6, 0.48); background: rgba(54, 192, 6, 0.06); } .intro-17__visual picture { width: 460px; max-width: 100%; right: auto; top: auto; align-self: flex-start; } } .intro-17__actions .label, .intro-17__actions .arrow { display: none !important; } .inverted .intro-17__introduction { color: rgba(0, 0, 0, 0.24); } .inverted .intro-17__title { color: #000; } .inverted .intro-17__subtitle { color: rgba(0, 0, 0, 0.64); } .inverted .intro-17__actions { color: rgba(0, 0, 0, 0.48); } @media (min-width: 1200px) { .inverted .intro-17__actions .banner-button { color: #36c006; border: 1.5px solid #5ce02e; background: rgba(255, 255, 255, 0.12); } .inverted .intro-17__actions .label { flex: 0 0 182px; width: 182px; } .inverted .intro-17__actions .arrow { flex: 1 1 166px; padding: 0 !important; } } /*************/ /* Intro #18 */ /*************/ .intro-18 { --size:64px; } .intro-18 .nav { flex-wrap: nowrap; } .intro-18 .nav .nav-item .nav-link { display: flex; flex-wrap: wrap; padding: 6px 0; align-items: flex-end; color: var(--a1); font-size: 48px; font-weight: 900; background-color: transparent !important; } @media (max-width: 767.98px) { .intro-18 .nav .nav-item .nav-link { font-size: 32px; font-weight: 700; } } .intro-18 .nav .nav-item .active { color: var(--white); border-bottom: 2px solid #36C006; } .intro-18 .nav .nav-item:last-child { margin-left: 64px; } @media (max-width: 767.98px) { .intro-18 .nav .nav-item:last-child { margin-left: 32px; } } .intro-18 .tab-content .tab-pane .description { margin-top: 32px; color: var(--a1); font-size: 18px; font-weight: 400; line-height: 25px; } @media (max-width: 991.98px) { .intro-18 .tab-content .tab-pane .description { margin-top: 24px; } } @media (max-width: 767.98px) { .intro-18 .tab-content .tab-pane .description { margin-top: 16px; } } .intro-18 .tab-content .tab-pane .points { margin-top: 64px; } .intro-18 .tab-content .tab-pane .points .point { display: flex; align-items: center; } .intro-18 .tab-content .tab-pane .points .point .number { text-align: right; font-size: 48px; font-weight: 700; line-height: 97.188%; } .intro-18 .tab-content .tab-pane .points .point .text { margin-left: 16px; color: var(--e2); font-size: 24px; font-weight: 400; line-height: 97.188%; text-transform: capitalize; } @media (max-width: 767.98px) { .intro-18 .tab-content .tab-pane .points .point { margin-bottom: 16px; } .intro-18 .tab-content .tab-pane .points .point:last-child { margin-bottom: 0; } } .intro-18 .tab-content .tab-pane .devices { margin-top: 32px; } .intro-18 .tab-content .tab-pane .devices .device .title { color: var(--a1); font-size: 14px; font-weight: 400; } .intro-18 .tab-content .tab-pane .devices .device .available-list { margin-top: 16px; } .intro-18 .tab-content .tab-pane .devices .device .count { display: flex; flex-direction: column; } .intro-18 .tab-content .tab-pane .devices .device .count .value { margin: auto 0; color: #6D6D6D; font-size: 36px; font-weight: 700; } @media (max-width: 767.98px) { .intro-18 .tab-content .tab-pane .devices .device:last-child { margin-top: 32px; } } .intro-18 .tab-content .tab-pane .actions { margin-top: 64px; justify-content: space-between; } .intro-18 .tab-content .tab-pane .actions .btn-view { width: 100%; } .intro-18 .tab-content .tab-pane .actions .btn-download { width: 100%; } @media (max-width: 767.98px) { .intro-18 .tab-content .tab-pane .actions .btn-download { margin-top: 16px; } } @media (max-width: 767.98px) { .intro-18 .tab-content .tab-pane .actions { margin-top: 32px; } } .intro-18 .link { color: inherit; border-radius: 0 24px 24px 24px; border: 1px solid currentColor; text-decoration: none; min-height: var(--size); min-width: var(--size); } .intro-18 .link svg { fill: currentColor; stroke: currentColor; } .intro-18 .link:hover { color: var(--white); } @media (min-width: 992px) { .intro-18 { --size:80px; } } /*************/ /* Intro #19 */ /*************/ .intro-19 { --size:64px; } .intro-19 .gradient { background: linear-gradient(180deg, rgba(var(--black-500-rgb), 0) 0%, rgba(var(--black-100-rgb), 0.32) 100%); } .intro-19 .link { color: inherit; border-radius: 0 24px 24px 24px; border: 1px solid currentColor; text-decoration: none; min-height: var(--size); min-width: var(--size); } .intro-19 .link svg { fill: currentColor; stroke: currentColor; } .intro-19 .link:hover { color: var(--white); } .intro-19 .teasers picture { width: 56px; height: 56px; background: var(--black-100); border-radius: 12px; flex-shrink: 0; } .intro-19 .teasers img { width: auto; height: 24px; } @media (min-width: 992px) { .intro-19 { --size:80px; } } /*************/ /* Intro #20 */ /*************/ .intro-20 { background: linear-gradient(180deg, rgba(var(--black-500-rgb), 0.32) -1.71%, rgba(var(--black-600-rgb), 0.32) 100%); } .intro-20 .badge { max-width: 460px; } .intro-20 > picture { left: 50%; right: auto; transform: translateX(-60%); width: 80vw; max-width: 1770px; } .intro-20 .teaser { opacity: 0.1; transition: all 0.3s; transform-origin: left center; text-decoration: none; } @media (max-width: 767.98px) { .intro-20 .teaser:nth-child(2) { transform: scale(1.2); opacity: 1; } .intro-20 .teaser:nth-child(3) { opacity: 0.4; } .intro-20 .teaser:nth-child(4) { opacity: 0.3; } .intro-20 .teaser:nth-child(5) { opacity: 0.2; } } @media (min-width: 768px) { .intro-20 .teaser:hover { transform: scale(1.2); opacity: 1; } } /*************/ /* Intro #21 */ /*************/ .intro-21 picture { max-width: 335px; width: 80vw; } .intro-21 .background-text { font-size: calc(3.685rem + 18.2625vw); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0.06; } @media (min-width: 1200px) { .intro-21 .background-text { font-size: 25.6rem; } } @media (min-width: 768px) { .intro-21 p { padding-top: calc(2.565rem + 9.8625vw); } } @media (min-width: 1200px) { .intro-21 p { padding-top: 14.4rem; } } /*************/ /* Intro #23 */ /*************/ .intro-23 { background: linear-gradient(180deg, rgba(var(--black-400-rgb), 0.32) -1.71%, rgba(var(--black-600-rgb), 0.32) 100%); } .intro-23 .card-title { color: rgba(var(--white-rgb), 0.06); } .intro-23 .card:before { border-radius: 24px 24px 0px 0px; bottom: 100%; content: ""; height: 8px; left: 30px; position: absolute; width: 125px; } .intro-23 .card-green:before { background-color: var(--green); } .intro-23 .card-red:before { background-color: var(--red); } .intro-23 .card-white:before { background-color: var(--white); } @media (min-width: 768px) and (max-width: 991.98px) { .intro-23 .card-title { font-size: calc(1.25rem + 6.2625vw); } } /*************/ /* Intro #24 */ /*************/ .intro-24 { background: linear-gradient(180deg, rgba(var(--black-400-rgb), 0.32) -1.71%, rgba(var(--black-600-rgb), 0.32) 100%); } .intro-24 .radius { border-radius: 0.75em; } .intro-24 .cover { bottom: 15%; } .intro-24__cards { gap: 1em; } .intro-24__card { height: 45em; } @media (min-width: 768px) and (max-width: 991.98px) { .intro-24 .card-title { font-size: calc(1.25rem + 6.2625vw); } } .intro_24 .card { border-radius: 24px; position: relative; } .intro_24 .card:before { border-radius: 24px 24px 0 0; bottom: 100%; content: ""; height: 12px; left: 20px; position: absolute; width: 100px; background: var(--green); } /*************/ /* Intro #25 */ /*************/ .intro-25 { background: linear-gradient(180deg, rgba(var(--black-400-rgb), 0.32) -1.71%, rgba(var(--black-600-rgb), 0.32) 100%); } .intro-25 .radius { border-radius: 4em; } .intro-25 .container { z-index: 1; } .intro-25__bg-dots { display: none; } @media (min-width: 768px) { .intro-25__bg-dots { display: block; position: absolute; width: 100%; height: 66%; top: 21%; transform: scale(2); background-image: url('data:image/svg+xml,'); } } .intro-25__bg-dots:before { display: none; } @media (min-width: 768px) { .intro-25__bg-dots:before { content: ""; display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(18.51% 8.33% at 50% 37.33%, transparent 0%, var(--black-400) 100%); pointer-events: none; } } @media screen and (min-width: 1441px) { .intro-25__bg-dots:before { background: radial-gradient(10.51% 8.33% at 50% 37.33%, transparent 0%, var(--black-400) 100%); } } .intro-25 .image-cover img { height: 194px; width: 81px; } .intro-25__text { display: none; } @media (min-width: 768px) { .intro-25__text { display: block; width: 50%; } } @media (min-width: 768px) { .intro-25__content { background-color: var(--black-300); } } .intro-25__cards { gap: 1em; flex-direction: column; gap: 30px; } .intro-25__cards .radius { border-radius: 1em; } @media (min-width: 768px) { .intro-25__cards { flex-direction: row; } } .intro-25__card { height: auto; gap: 48px; } .intro-25__card article div { gap: 24px; } .intro-25__card article div span { font-size: 24px; } .intro-25__card article div p { font-size: 20px; } .intro-25__card article time { font-size: 14px; } @media (min-width: 768px) { .intro-25__card { border: 1px solid var(--gray-200); } } /*************/ /* Downloads */ /*************/ .downloads h3 { text-align: center; } .downloads .border { border-top: 1px solid rgba(var(--white-rgb), 0.2); } .downloads .box_1 { padding: 70px 0 50px; } .downloads .box_1 img { margin-right: 50px; margin-left: -20px; max-width: 200px; } .downloads .box_2 { padding: 50px 0 100px; } .downloads .box_2 img { margin-left: 50px; margin-right: -25px; max-width: 105px; } .downloads .box_2 .label { text-align: right; } .downloads ul { text-align: center; padding-top: 60px; } .downloads li { display: inline-block; vertical-align: top; padding: 0 1em; } @media (min-width: 768px) { .downloads ul { padding-top: 0; } .downloads .box_1 ul { text-align: right; } .downloads .box_2 ul { text-align: left; } .downloads .box_1 img { margin-left: 0; max-width: 170px; } .downloads .box_2 img { margin-right: 0; } } @media (min-width: 1200px) { .downloads .box_1 { padding: 7.9em 0 5.45em; } .downloads .box_1 img { max-width: 275px; } .downloads .box_1 ul { padding-right: 2.5em; } .downloads .box_2 { padding: 5.5em 0 10em; } .downloads .box_2 img { max-width: 145px; } .downloads .box_2 ul { padding-left: 2.5em; } .downloads li { padding: 0 1.35em; } } /************/ /* Products */ /************/ .products { padding: 100px 0; } .products h2 { margin-bottom: 40px; } .products p { line-height: 1.4; } .products .item { max-width: 60px; width: 100%; padding-bottom: 35px; margin: 0 auto; } .products .label { font-weight: 900; color: var(--red); text-align: right; margin-bottom: 0.4em; font-size: 16px; } .products .image { padding-bottom: 100%; position: relative; margin-bottom: 0.8em; } .products .icon { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .products .title { font-size: 12px; font-weight: 400; letter-spacing: 0.04em; min-width: 80px; } .products .text { margin-bottom: 60px; } .products .buttons { padding-top: 55px; } .products .btn { min-width: 50%; } @media (min-width: 768px) { .products .buttons { padding-top: 0; } } @media (min-width: 992px) { .products { padding: 10.4em 0 8em; } .products h2 { margin-bottom: 1.45em; } .products .item { max-width: 100px; float: right; padding-bottom: 3em; } .products .label { font-size: 24px; } .products .title { font-size: 16px; } .products .text { margin-bottom: 6.8em; } .products .buttons { margin-bottom: 3em; padding-top: 0; } } /*********************/ /* Products overview */ /*********************/ .products_overview { background-size: auto; background-repeat: repeat; padding: 60px 0 40px; } .products_overview h3 { margin-bottom: 15px; color: var(--white); } .products_overview p { margin-bottom: 1em; } .products_overview a { text-decoration: none; } .products_overview a:hover { text-decoration: underline; } .products_overview .products { padding: 0; } .products_overview .buttons { padding-top: 20px; } @media (min-width: 768px) { .products_overview .content_card_title { padding-top: 0; } .products_overview .content_card_image { margin-right: 30px; } } @media (min-width: 992px) { .products_overview { padding: 5em 0 2em; } .products_overview h3 { margin-bottom: 0.8em; } .products_overview p { margin-bottom: 1.6em; } } @media (min-width: 1200px) { .products_overview { padding: 12.7em 0 8em; } .products_overview .content_card_image { margin-right: 50px; min-width: 105px; } .products_overview .content_card { margin-left: 30px; margin-bottom: 4.85em; } } /***********/ /* Heading */ /***********/ .heading { padding: 100px 0 0; text-transform: uppercase; } .heading .container { max-width: 1240px; } @media (min-width: 768px) { .heading { padding: 120px 0 0; } } @media (min-width: 992px) { .heading { padding: 200px 0 0; } } @media (min-width: 1200px) { .heading { padding: 370px 0 0; } } /***********/ /* Text #1 */ /***********/ .text_1 { margin-bottom: 5.5em; letter-spacing: 0.05em; line-height: 1.45; } .text_1 .figure { position: absolute; right: -120px; bottom: -210px; width: 44%; } .text_1 .title { margin-bottom: 3.5em; } .text_1 li { position: relative; padding: 1em 0 1em 5em; margin-bottom: 1em; line-height: 1.4; -moz-column-break-inside: avoid; break-inside: avoid; } .text_1 li:before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url(/images/icons/icons.svg#check-pink) no-repeat 50% 50%/contain; width: 48px; height: 48px; } @media (min-width: 576px) { .text_1 .columns ul { -moz-columns: 2; columns: 2; -moz-column-gap: 3.5em; column-gap: 3.5em; } .text_1 .columns li { display: inline-block; vertical-align: top; } } @media (min-width: 768px) { .text_1 .columns ul { -moz-columns: 2; columns: 2; -moz-column-gap: 3.5em; column-gap: 3.5em; } .text_1 li:before { left: 1.25em; } .text_1 li { padding-left: 6.5em; } } @media (min-width: 1200px) { .text_1 + .text_1 { padding-top: 12em; } } /***********/ /* Text #2 */ /***********/ .text_2 { padding: 50px 0 0; letter-spacing: 0.05em; } .text_2 .text { position: relative; margin-bottom: 40px; } .text_2 .text h2 { margin-bottom: 1.4em; } .text_2 .text p { line-height: 1.5; } @media (min-width: 992px) { .text_2 { padding-top: 4em; } } @media (min-width: 1200px) { .text_2 { padding: 8.15em 0 1.5em; } .text_2 .text { left: 20px; margin-bottom: 0; } .text_2 .content_card_title { padding-top: 80px; } } /***********/ /* Text #3 */ /***********/ .text_3 { position: relative; padding: 100px 0 10px; letter-spacing: 0.05em; } .text_3 .bg { position: absolute; left: 0; top: 0; right: 0; height: 102px; max-width: 1620px; background-position: 100% 0; background-size: contain; } .text_3 .title { margin-bottom: 40px; } .text_3 .title h2 { margin-bottom: 0.35em; } .text_3 .content_card_title { line-height: 1.5; } @media (min-width: 768px) { .text_3 { padding: 21.7em 0 2em; } .text_3 .content_card_title { font-size: 16px; } .text_3 .bg { height: 274px; max-width: 100%; left: -26%; top: 20px; } } @media (min-width: 1200px) { .text_3 { padding-bottom: 6em; margin-bottom: 2.5em; } .text_3 .title { margin-bottom: 7em; } } /***********/ /* Text #4 */ /***********/ .text_4 { padding: 50px 0; letter-spacing: 0.05em; } .text_4 .title { line-height: 1.45; letter-spacing: 0.05em; } .text_4 .title h2 { margin-bottom: 1.3em; } .text_4 .text { padding-top: 2.75em; } .text_4 .text h3 { margin-bottom: 20px; position: relative; -webkit-hyphens: auto; hyphens: auto; } .text_4 .text p { line-height: 1.5; } .text_4 .content_card { margin-bottom: 0; padding-top: 30px; } .text_4 .content_card_title { margin-bottom: 20px; } .text_4 .content_card_text { line-height: 1.5; padding-top: 20px; } .text_4_2 .content_card_title { margin-bottom: 0; } .text_4_2 .content_card_title h3 { color: var(--white); } @media (max-width: 575.98px) { .text_4_1 .col_2 .content_card_text { padding-right: 25px; } } @media (max-width: 767.98px) { .text_4 .text h3 { padding-left: 25px; } .text_4 .text h3:before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 10px; border-radius: 5px; background: var(--green); } .text_4_1 .content_card_image { max-width: 125px; flex: 1 1 25%; } .text_4_1 .content_card_text { flex: 1 1 75%; text-align: left; padding-top: 0; padding-left: 25px; } } @media (min-width: 768px) { .text_4 { padding: 4em 0; font-size: 16px; } .text_4:not(.text_4_1) .col_1 { flex: 0 0 32.5%; max-width: 32.5%; margin-right: 4%; } .text_4:not(.text_4_1) .col_2 { flex: 0 0 34%; max-width: 34%; } .text_4:not(.text_4_1) .col_3 { flex: 0 0 29.5%; max-width: 29.5%; } .text_4 .title { margin-bottom: 3em; font-size: 18px; } .text_4 .text h3 { margin-bottom: 1.4em; } .text_4 .content_card { padding-top: 0; } .text_4 .content_card_title { padding-top: 60px; } .text_4 .content_card_text { padding-top: 0.75em; } .text_4_1 .content_card_text { padding-top: 30px; } .text_4_2 .content_card_image { flex: 1 1 25%; max-width: 85px; } .text_4_2 .content_card_title { flex: 1 1 75%; padding-left: 20px; } .text_4_2 .content_card_text { padding-top: 35px; } } @media (min-width: 1200px) { .text_4 { padding: 8em 0 5em; } .text_4 .title { margin-bottom: 6em; } .text_4_1 { /*padding: 10em 0 14em;*/ padding-top: 10em; } .text_4_1 .title { font-size: 24px; } .text_4_1 .content_card_text { padding-top: 50px; font-size: 24px; line-height: 1.2; } .text_4_1 .content_card_image { max-width: 150px; } .text_4_2 { padding: 10em 0 13.5em; } .text_4_2 .title h2 { margin-bottom: 2.9em; } } /***********/ /* Text #5 */ /***********/ .text_5 { position: relative; margin-bottom: 50px; } .text_5 h2 { margin-bottom: 1.45em; } .text_5 .box { padding-bottom: 50px; } .text_5 .text p { line-height: 1.45; margin-bottom: 1.45em; } .text_5 .buttons { padding-top: 4em; } .text_5 .btn { min-width: 38%; margin-right: 1.3em; } @media (max-width: 575.98px) { .text_5 .text { margin-bottom: 50px; } .text_5 .buttons { position: absolute; left: 5px; right: 5px; top: 100%; background: var(--black-400); border-radius: 6px; transform: translateY(-50%); padding: 10px; } } @media (min-width: 768px) { .text_5 { padding: 4em 0; margin-bottom: 0; } .text_5 .box { padding-bottom: 0; } } @media (min-width: 992px) { .text_5 .box { padding-left: 40px; } } @media (min-width: 1200px) { .text_5 { padding: 16em 0 11em; margin-bottom: -0.35em; } } /***********/ /* Text #6 */ /***********/ .text_6 { background-repeat: repeat; background-size: auto; padding-top: 45px; } .text_6 .content_card_text { padding-top: 15px; } .text_6 h3 { color: var(--white); } .text_6 .image img:last-child { display: none; } .inverted .text_6 .image img:last-child { display: block; } .inverted .text_6 .image img:first-child { display: none; } .text_6_1 { background-color: var(--black-300); } .text_6_1 .content_card { margin-bottom: 80px; } .text_6 .button { position: absolute; left: 10px; right: 10px; top: 100%; background: var(--black-400); border-radius: 6px; transform: translateY(-50%); padding: 10px; } @media (min-width: 768px) { .text_6 { padding-top: 60px; } .text_6 .content_card { margin-bottom: 60px; } .text_6 .content_card_title { flex: 1 1 82.5%; padding: 0 0 0 35px; } .text_6 .content_card_text { padding-top: 10px; letter-spacing: 0.05em; line-height: 1.45; } } @media (min-width: 992px) { .text_6 { padding-top: 5em; } .text_6 .image { position: relative; left: 30px; } .text_6 .content_card { margin-bottom: 100px; padding: 0 20px; } .text_6 .content_card_title { padding-left: 10px; } } /***********/ /* Text #7 */ /***********/ .text_7 { text-align: center; padding: 55px 0; } .text_7 .content_card_image { max-width: 25px; margin-bottom: 20px; } .text_7 .content_card_title { padding: 0; } .text_7 p { margin-bottom: 1em; } .text_7 h3 { color: var(--white); margin-bottom: 20px; } .text_7 a { text-decoration: none; } .text_7 a:hover { text-decoration: underline; } @media (min-width: 768px) { .text_7 { text-align: left; padding: 8em 0 6em; } .text_7 .content_card_image { max-width: 80px; margin: 0 30px 0 0; } .text_7 .content_card_title { font-size: 16px; letter-spacing: 0.05em; line-height: 1.45; } .text_7 h3 { margin-bottom: 0.7em; } .text_7 p { margin-bottom: 1.5em; } } @media (min-width: 1200px) { .text_7 { text-align: left; padding: 13.5em 0 8.25em; } .text_7 .content_card { padding-left: 30px; margin-bottom: 5.25em; } } /***********/ /* Text #8 */ /***********/ .text_8 { padding: 60px 0 20px; } .text_8 h3 { margin-bottom: 20px; color: var(--white); } .text_8 p { margin-bottom: 1em; } .text_8 a { text-decoration: none; } .text_8 a:hover { text-decoration: underline; } @media (min-width: 768px) { .text_8 .content_card_title { padding-top: 0; } .text_8 .content_card_image { margin-right: 20px; } } @media (min-width: 992px) { .text_8 { padding: 5em 0 2em; } .text_8 .content_card_title { font-size: 16px; letter-spacing: 0.05em; line-height: 1.4; } .text_8 h3 { margin-bottom: 0.7em; } .text_8 p { margin-bottom: 1.75em; } } @media (min-width: 1200px) { .text_8 { padding: 13.25em 0 7em; } .text_8 .content_card { margin-bottom: 105px; } .text_8 .content_card_image { margin-left: 40px; } } /***********/ /* Text #9 */ /***********/ .text_9 { padding: 70px 0; background: linear-gradient(180deg, var(--black-400) 0%, var(--black-300) 100%), var(--black-300); position: relative; } .text_9 .title { margin-bottom: 30px; } .text_9 .image { margin-left: -40px; margin-bottom: 60px; } .text_9 .image img { width: 100%; max-width: 450px; } .text_9 h2 { margin-bottom: 1.45em; } .text_9 h3 { color: var(--white); } .text_9 .content_card_title { flex: 1 1 82.5%; } .text_9 .content_card_text { padding-top: 25px; } .text_9_1 { background: transparent; } .text_9_1 .content_card { margin-bottom: 50px; } .text_9_1 .content_card_title { padding-top: 0; } .text_9_1 .content_card_text { padding-top: 15px; } .text_9_1 .image { margin: 0 20px 80px 0; } @media (min-width: 768px) { .text_9 { padding: 165px 0 225px; } .text_9 .title { margin-bottom: 100px; } .text_9 .image { margin-left: -190px; margin-right: 55px; margin-bottom: 0; } .text_9 .image img { max-width: 635px; } .text_9 .text { margin-top: -20px; } .text_9 .content_card { font-size: 16px; margin-bottom: 25px; } .text_9_1 .image { position: relative; margin: 0; } .text_9_1 .image_inner { position: absolute; left: -2.5%; top: 0; max-width: 39.5%; } .text_9_1 .image img { max-width: 100%; } .text_9_1 .text { margin-top: -10px; } .text_9_1 .content_card_text { padding-top: 30px; } } @media (min-width: 1200px) { .text_9 .content_card { margin-left: 35px; } .text_9 .content_card_image { max-width: 80px; } .text_9 .title { font-size: 24px; } .text_9_1 .content_card { margin-left: 15px; margin-bottom: 65px; } } /************/ /* Text #10 */ /************/ .text_10 { text-transform: uppercase; font-weight: 500; font-size: 14px; padding: 44px 0 0; letter-spacing: 0.05em; } .text_10 h2 { text-transform: none; } .text_10 h5 { color: var(--green); font-size: 20px; line-height: 1.2; } .text_10 li { position: relative; padding: 0 0 0 5.5em; margin-bottom: 50px; line-height: 1.4; } .text_10 li:before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: url(/images/icons/icons.svg#download) no-repeat 50% 50%/contain; width: 48px; height: 48px; } .text_10 li a { color: var(--gray-100); text-decoration: none; } .text_10_1 { padding: 68px 0 0; } .text_10_1 .container { max-width: 1240px; } .text_10_1 .title { margin-bottom: 45px; } .text_10_1 li { margin-bottom: 40px; } @media (min-width: 576px) { .text_10 .columns ul { -moz-columns: 2; columns: 2; -moz-column-gap: 3.5em; column-gap: 3.5em; } .text_10 .columns li { display: inline-block; width: 100%; } .text_10_1 ul { display: flex; justify-content: space-between; flex-wrap: wrap; } .text_10_1 li { width: 50%; } } @media (min-width: 768px) { .text_10 .columns ul { -moz-columns: 2; columns: 2; -moz-column-gap: 3.5em; column-gap: 3.5em; } .text_10 li:before { left: 0.15em; } .text_10 li { padding-left: 4.7em; margin-bottom: 78px; } .text_10_1 li { width: 300px; margin-bottom: 40px; } } /************/ /* Text #11 */ /************/ .text_11 { padding: 40px 0; } .text_11 .container { max-width: 1240px; } .text_11 h2 { font-size: 1.333334em; margin-bottom: 1.8em; color: var(--white); } .text_11 h3 { font-size: 1.133334em; margin-bottom: 1.6em; color: #e1e1e1; } .text_11 p { margin-bottom: 1.75em; } .text_11 ul { margin-bottom: 1.75em; } .text_11 ul li { position: relative; padding: 11px 0 11px 36px; margin-bottom: 0.5em; font-size: 0.84em; } .text_11 ul li:before { content: ""; position: absolute; left: 0; top: 15px; width: 10px; height: 10px; border-radius: 50%; background: var(--red); } .text_11 ol { counter-reset: counter; } .text_11 ol li { counter-increment: counter; position: relative; padding-left: 35px; font-size: 0.84em; line-height: 1.3; margin-bottom: 2.5em; } .text_11 ol li:before { content: counter(counter) "."; position: absolute; left: 0; top: 0; font-size: 1.6em; line-height: 1.2; font-weight: 700; } .text_11 ol h4 { font-size: 1.6em; margin-bottom: 1.5em; line-height: 1.2; } .text_11 ol p { margin-bottom: 2.75em; } @media (min-width: 768px) { .text_11 { padding-bottom: 80px; } } @media (min-width: 1200px) { .text_11 { padding-bottom: 120px; } } /************/ /* Text #12 */ /************/ .text_12 .content-collapsed .text_12_header { border-radius: 10px; } .text_12 .content-collapsed .text_12_text { max-height: 0 !important; } .text_12 .content-expanded .text_12_header .icon { transform: rotate(-180deg); } .text_12 .content-expanded .text_12_text { transition: 0.3s ease-in-out; } .text_12_header { background: rgba(var(--black-400-rgb), 0.01); border: 1px solid rgba(var(--white-rgb), 0.05); box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 10px 10px 0px 0px; transition: all 0.3s; cursor: pointer; } .text_12_header .icon { stroke-width: 3px; transition: all 0.3s; } .text_12_text { background: var(--black-100); border-radius: 0 0 10px 10px; font-size: 12px; line-height: 1.4; overflow: hidden; transition: 0.3s ease-in-out; } .text_12_text ol { counter-reset: ordered-list; } .text_12_text ol > li { margin-bottom: 25px; padding-left: 30px; position: relative; } .text_12_text ol > li:before { color: var(--white); content: counter(ordered-list) "."; counter-increment: ordered-list; font-size: 14px; font-weight: 700; left: 0; position: absolute; top: 0; } .text_12_text ol > li:last-child { margin-bottom: 0; } .text_12_text ul > li { position: relative; padding-left: 25px; margin-bottom: 5px; } .text_12_text ul > li:before { content: ""; position: absolute; left: 0; top: 5px; width: 8px; height: 8px; border-radius: 50%; background: var(--green); } .text_12_text ul > li:last-child { margin-bottom: 0; } .text_12_text table { width: 100%; border-collapse: collapse; margin: 1.5em 0; background: rgba(var(--white-rgb), 0.02); border-radius: 8px; overflow: hidden; border: 1px solid rgba(var(--white-rgb), 0.1); } .text_12_text table th, .text_12_text table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid rgba(var(--white-rgb), 0.05); vertical-align: top; } .text_12_text table th { color: var(--white); font-weight: 700; font-size: 14px; border-bottom: 2px solid rgba(var(--green-rgb), 0.3); } .text_12_text table td { color: var(--gray); font-size: 13px; line-height: 1.4; } .text_12_text table tr:last-child th, .text_12_text table tr:last-child td { border-bottom: none; } .text_12_text table tr:hover { background: rgba(var(--white-rgb), 0.03); } @media (max-width: 767px) { .text_12_text table { font-size: 11px; } .text_12_text table th, .text_12_text table td { padding: 8px 12px; } .text_12_text table th { font-size: 12px; } .text_12_text table td { font-size: 11px; } } .text_12_text p, .text_12_text ul { margin-bottom: 1em; } @media (min-width: 768px) { .text_12_text { font-size: 14px; } .text_12_text ol > li { padding-left: 45px; } } /************/ /* Text #13 */ /************/ .text_13 .box { background: rgba(var(--black-300-rgb), 0.01); border: 1px solid rgba(var(--white-rgb), 0.05); box-sizing: border-box; box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 20px; } /************/ /* Text #14 */ /************/ .text_14 { padding: 60px 0; } .text_14 h2 { margin-bottom: 1.875rem; } .text_14 p { margin-bottom: 1.5rem; } .text_14_bg { bottom: auto; } @media (min-width: 768px) { .text_14_image { position: absolute; left: 50%; width: 50%; max-width: 754px; } } /************/ /* Text #15 */ /************/ .text_15 { font-size: 2.4rem; } .text_15 > picture { margin-left: var(--container-gap); } @media (min-width: 768px) { .text_15 { font-size: 3.2rem; } } @media (min-width: 1600px) { .text_15 > picture { position: absolute; left: 0; top: 0; max-width: calc((100vw - 1300px - var(--container-gap)) / 2); margin: 0; } } /**************/ /* Teasers #1 */ /**************/ .teasers_1 .card { background: var(--black-100); border-radius: 20px; font-size: 14px; line-height: 1.4; text-align: center; min-height: 100%; } .teasers_1 .card_wrapper { padding: 0 10px; width: 100%; min-height: 100%; } .teasers_1 .cards { margin: 0 10px; } .teasers_1 .card_highlighted { background: var(--black-300); } .teasers_1 .tns-nav { margin-top: 50px; } .teasers_1 picture { height: 100px; } .teasers_1 picture img { -o-object-fit: contain; object-fit: contain; width: 100%; height: 100%; } .teasers_1 .tns-controls [data-controls=prev] { left: -20px; border-radius: 0 25px 25px 0; } .teasers_1 .tns-controls [data-controls=next] { right: -20px; border-radius: 25px 0 0 25px; } @media (max-width: 767.98px) { .teasers_1 .cards:after { content: "flickity"; display: none; /* hide :after */ } .teasers_1 .card_wrapper { max-width: 340px; } } @media (min-width: 768px) { .teasers_1 .row { margin-left: -15px; margin-right: -15px; } } /**************/ /* Teasers #2 */ /**************/ .teasers_2 .card { background: var(--black-100); border-radius: 20px; font-size: 14px; line-height: 1.4; } .teasers_2 picture { width: 60px; height: 60px; flex: 0 0 60px; } @media (min-width: 768px) { .teasers_2 .card { text-align: center; } } @media (min-width: 1200px) { .teasers_2 .card { text-align: left; } } /**************/ /* Teasers #3 */ /**************/ .teasers-3 { --animation-duration:25s; --items: 10; /* .carousel-item-1 { animation: marquee var(--animation-duration) linear infinite; } .carousel-item-2 { animation: marquee2 var(--animation-duration) linear infinite; animation-delay: calc(var(--animation-duration) / 2); }*/ } .teasers-3 .teaser { width: 170px; border-radius: 12px; border: 1px solid transparent; } .teasers-3 .teaser.border-green { border-color: rgba(var(--green-rgb), 0.48); } .teasers-3 .teaser.border-red { border-color: rgba(var(--red-rgb), 0.48); } .teasers-3 .flickity-viewport { overflow: visible; } .teasers-3 .container { max-width: 100%; } .teasers-3 .carousel { width: calc(200px * var(--items)); overflow: hidden; position: relative; margin: 0 auto; } .teasers-3 .carousel-inner { animation: marquee var(--animation-duration) linear infinite; } @media (min-width: 1200px) { .teasers-3 .carousel:before, .teasers-3 .carousel:after { content: ""; position: absolute; width: 25vw; top: 0; bottom: 0; z-index: 10; } .teasers-3 .carousel:before { left: 0; background: linear-gradient(to right, var(--black-400), rgba(var(--white-rgb), 0)); } .teasers-3 .carousel:after { right: 0; background: linear-gradient(to right, rgba(var(--white-rgb), 0), var(--black-400)); } } @keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } } @keyframes marquee2 { from { transform: translateX(0%); } to { transform: translateX(-200%); } } /*******************/ /* Page navigation */ /*******************/ .page-navigation { padding: 30px 0 10px; } .page-navigation .container { max-width: 1240px; } .page-navigation ul { margin: 0 -10px; } .page-navigation li { flex-direction: column; display: flex; margin-bottom: 20px; width: 100%; padding: 0 10px; min-height: 60px; } .page-navigation a { display: flex; align-items: center; justify-content: center; font-size: 16px; line-height: 1.1875; text-transform: uppercase; color: var(--gray-100); letter-spacing: 0.05em; text-decoration: none; background: var(--black-100); border: 1px solid transparent; padding: 10px; text-align: center; flex-grow: 1; border-radius: 30px; } .page-navigation .active a { border-color: var(--green); background: transparent; color: var(--white); } @media (min-width: 576px) { .page-navigation ul { display: flex; justify-content: space-between; flex-wrap: wrap; } .page-navigation li { max-width: 33.333%; } } @media (min-width: 768px) { .page-navigation li { max-width: 33.333%; } } @media (min-width: 1200px) { .page-navigation li { max-width: 320px; } .page-navigation a { padding-left: 50px; padding-right: 50px; } } /**************/ /* Buttons #1 */ /**************/ .buttons_1 { padding: 25px 0; text-align: center; background-repeat: repeat; background-size: auto; } @media (max-width: 575.98px) { .buttons_1 .btn + .btn { margin-top: 20px; } } @media (min-width: 576px) { .buttons_1 .btn { min-width: 200px; margin: 0 0.7em; } } @media (min-width: 768px) { .buttons_1 { padding: 5em 0; } .buttons_1 .btn { min-width: 250px; } } /**************/ /* Buttons #2 */ /**************/ .buttons_2 { text-align: center; background-repeat: repeat; background-size: auto; } .buttons_2 h2 { text-transform: uppercase; margin-bottom: 30px; } .buttons_2 .text { padding: 70px 0 50px; } .buttons_2 .image img { max-width: 200px; } .buttons_2 .btn { margin-bottom: 20px; } @media (min-width: 768px) { .buttons_2 { text-align: left; } .buttons_2 h2 { margin-bottom: 1.9em; } .buttons_2 .text { padding: 98px 0 50px 30px; } .buttons_2 .image { margin: -50px 0 0 80px; } .buttons_2 .image img { max-width: 100%; } .buttons_2 .btn { margin-right: 0.5em; } } @media (min-width: 992px) { .buttons_2 h2 { font-size: 36px; } } /**************/ /* Buttons #3 */ /**************/ .buttons_3 { background: var(--black-400); padding: 100px 0; font-size: 18px; } .buttons_3 h2 { margin-bottom: 1.5em; } @media (min-width: 768px) { .buttons_3 { padding: 9.5em 0; } } @media (min-width: 1200px) { .buttons_3 .text { font-size: 24px; } } /************/ /* Contacts */ /************/ .contacts { padding: 110px 0 40px; background-size: auto; background-position: 50% 100%; background-repeat: repeat-x; } .contacts .title { margin-bottom: 3.15em; } .contacts .content_card { margin-bottom: 60px; } .contacts .content_card_image { max-width: 50px; margin-right: 40px; } .contacts .content_card_image img { top: 0; } .contacts .content_card_title { padding-top: 10px; line-height: 1.45; letter-spacing: 0.05em; } .contacts h3 { margin-bottom: 1.5em; } .contacts .text { padding: 30px 0 0; } .contacts .text h2 { margin-bottom: 1.5em; } .contacts .social li { margin-bottom: 30px; } .contacts .social a { display: block; text-decoration: none; } .contacts .social a:hover .icon { opacity: 0.6; } .contacts .social a:active .icon { opacity: 0.1; } .contacts .social .icon { width: 48px; height: 48px; opacity: 0.2; vertical-align: middle; margin-right: 40px; } @media (min-width: 768px) { .contacts { padding: 20.75em 0 11.5em; } .contacts .content_card { margin-bottom: 20px; } .contacts .text { padding: 5.25em 0 0; } .contacts .social li { display: inline-block; vertical-align: top; margin-right: 3.8em; margin-bottom: 0; } .contacts .social .icon { width: 75px; height: 75px; margin-right: 0; } } /*******/ /* Map */ /*******/ .map { position: relative; padding-bottom: 20%; background-color: #adadad; height: 480px; } .map > div { position: absolute; left: 0; top: 0; right: 0; bottom: 0; } @media (min-width: 768px) { .map { padding-bottom: 70.65%; height: auto; } } @media (min-width: 1200px) { .map { padding-bottom: 0; height: 920px; } } /***************/ /* Overview #1 */ /***************/ .ov_1 { padding: 20px 0 70px; } .ov_1_title { margin-bottom: 40px; } .ov_1_options { margin-bottom: 40px; } .ov_1_item { margin-bottom: 9px; } .ov_1_item_header { border-bottom: 1px solid var(--gray-100); padding: 20px 0 15px; cursor: pointer; } .ov_1_item_header .col:last-child { flex-grow: 0; } .ov_1_item_header h3 { text-transform: uppercase; } .ov_1_item_header small { margin-left: 10px; } .ov_1_item .more { position: relative; width: 30px; height: 30px; } .ov_1_item .more .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); stroke: var(--green); stroke-width: 3px; width: 30px; height: 30px; } .ov_1_item_extra { overflow: hidden; transition: all 0.25s ease-in-out; margin: 0 -20px; } .ov_1_item_extra_inner { padding: 15px 0 0; } .ov_1_item_extra .table_wrapper { max-width: 100%; overflow: auto; padding: 0 20px; } .ov_1_item_extra table { width: 100%; color: var(--white); font-size: 14px; } .ov_1_item_extra tbody tr { border-bottom: 1px solid var(--black-100); } .ov_1_item_extra th { font-size: 12px; color: var(--gray-100); text-transform: uppercase; padding: 15px 15px 45px; } .ov_1_item_extra td { padding: 15px; vertical-align: middle; } .ov_1_item_extra td:first-child, .ov_1_item_extra th:first-child { padding-left: 0; } .ov_1_item_extra .icon_help { width: 20px; height: 20px; } .ov_1_item_extra .tooltip { display: inline-block; vertical-align: text-bottom; } .ov_1 .content-collapsed .ov_1_item_extra { max-height: 0 !important; } .ov_1 .content-expanded .ov_1_item_extra { transition: all 0.3s ease-in-out; } .ov_1 .content-expanded .more { transform: rotate(-180deg); } @media (min-width: 768px) { .ov_1_item_extra { margin: 0 -30px; } .ov_1_item_extra .table_wrapper { padding: 0 30px; } } @media (min-width: 1200px) { .ov_1 { padding: 192px 0 70px; } .ov_1_item_extra { margin: 0; } .ov_1_item_extra .table_wrapper { padding: 0; } .ov_1_item_extra table { font-size: 16px; } .ov_1_title { margin-bottom: 70px; } .ov_1_options { margin-bottom: 0; } .ov_1_item { margin-bottom: 49px; } } .ov_1_tabs_container { position: relative; overflow: hidden; } .ov_1_tabs_nav { margin-bottom: 40px; } .ov_1_tabs_nav .row { margin: 0; } .ov_1_tabs_nav_item { font-size: 18px; font-weight: 700; padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--gray-100); cursor: pointer; } .ov_1_tabs_nav_item:first-child { padding-left: 0; } .ov_1_tabs_nav_item:last-child { padding-right: 0; } .ov_1_tabs_nav_item.active { color: var(--green); border-bottom-color: var(--green); } .ov_1_tab { font-size: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: translate(0, 20%); opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; } .ov_1_tab.active { position: static; transform: translate(0); opacity: 1; visibility: visible; } .showcase { font-size: 14px; line-height: 1.4; letter-spacing: 0; /*.price { font-weight: 700; }*/ /*.description { color: var(--gray-100); font-size: 10px; text-transform: uppercase; }*/ } .showcase h3 { text-transform: uppercase; line-height: 30px; color: var(--white); white-space: nowrap; font-size: 24px; } .showcase .box { width: 100%; padding-top: 20px; top: 0; background: var(--black-400); } .showcase .box_inner { border-width: 1px; border-style: solid; border-radius: 10px; max-width: 480px; margin: 0 auto; position: relative; z-index: 10; } .showcase .box_heading { padding: 40px 20px; position: relative; } .showcase .data { display: flex; padding: 12px 20px; align-items: center; } .showcase .data:nth-child(even) { background: var(--black-300); } .showcase .label { color: var(--gray-100); flex: 1 1 50%; padding-right: 15px; font-size: 12px; } .showcase .value { flex: 1 1 50%; } .showcase .icon { width: 16px; height: 16px; } .showcase .button { padding: 20px 10px 10px; } .showcase .flickity-viewport { width: 100%; } .showcase .flickity-page-dots { position: static; margin-top: 30px; } .showcase .flickity-page-dots .dot { background: var(--gray-300); opacity: 1; } .showcase .flickity-page-dots .dot.is-selected { background: var(--green); } .showcase_arrow { position: absolute; top: 50%; width: 30px; height: 30px; transform: translateY(-50%); } .showcase_arrow .icon { width: 16px; height: 16px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .showcase_arrow.prev { right: 55px; } .showcase_arrow.next { right: 15px; } .showcase_carousel:after { content: "flickity"; display: none; } @media (max-width: 767.98px) { .showcase .box_1 .box_inner { box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); background: rgba(var(--gray-rgb), 0.01); border-color: rgba(var(--gray-rgb), 0.5); } .showcase .box_1 .box_inner:before { background: rgba(var(--gray-rgb), 1); } .showcase .box_1 .box_inner:hover { background: rgba(var(--gray-rgb), 0.05); border-color: rgba(var(--gray-rgb), 1); } .showcase .box_1 .box_inner h3 { color: var(--white); } .showcase .box_2 .box_inner { box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); background: rgba(var(--green-rgb), 0.01); border-color: rgba(var(--green-rgb), 0.5); } .showcase .box_2 .box_inner:before { background: rgba(var(--green-rgb), 1); } .showcase .box_2 .box_inner:hover { background: rgba(var(--green-rgb), 0.05); border-color: rgba(var(--green-rgb), 1); } .showcase .box_2 .box_inner h3 { color: var(--green); } .showcase .box_3 .box_inner { box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); background: rgba(var(--yellow-rgb), 0.01); border-color: rgba(var(--yellow-rgb), 0.5); } .showcase .box_3 .box_inner:before { background: rgba(var(--yellow-rgb), 1); } .showcase .box_3 .box_inner:hover { background: rgba(var(--yellow-rgb), 0.05); border-color: rgba(var(--yellow-rgb), 1); } .showcase .box_3 .box_inner h3 { color: var(--yellow); } } @media (min-width: 992px) { .ov_1_tabs_nav_item { font-size: 36px; } .showcase { display: flex; /*> .box { background:transparent; .data { background: transparent; border-top: 1px solid var(--black-200); padding-left: 0; margin-right: -30px; &:last-child { border-bottom: 1px solid var(--black-200); } } }*/ /*.box_inner:hover { border-color: rgba(var(--green-rgb), 0.3); h3 { color: var(--green); } }*/ /*.btn:hover { background: rgba(var(--green-rgb), 0.05); border: 1px solid rgba(var(--green-rgb), 0.3); color: var(--green); }*/ } .showcase h3 { font-size: 18px; } .showcase .box_0 { background: transparent; } .showcase .data { min-height: 45px; position: relative; } .showcase .data:before, .showcase .data:after { content: ""; position: absolute; top: 0; bottom: 0; background: inherit; width: 15px; } .showcase .data:before { right: 100%; } .showcase .data:after { left: 100%; } .showcase .data:nth-child(2) { min-height: 50px; } .showcase .data:nth-child(3) { min-height: 81px; } .showcase .data:nth-child(5) { min-height: 75px; } .showcase .box_heading { min-height: 110px; } .showcase .label { font-size: 14px; text-align: left; } .showcase .showcase_arrow { display: none; } .showcase .box:hover .data:before { margin-right: 1px; } .showcase .box:hover .data:after { margin-left: 1px; } .showcase .box_inner { border-color: transparent; text-align: center; } .showcase .box_1:hover .box_inner { box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); background: rgba(var(--gray-rgb), 0.01); border-color: rgba(var(--gray-rgb), 0.5); } .showcase .box_1:hover .box_inner:before { background: rgba(var(--gray-rgb), 1); } .showcase .box_1:hover .box_inner:hover { background: rgba(var(--gray-rgb), 0.05); border-color: rgba(var(--gray-rgb), 1); } .showcase .box_1:hover .box_inner h3 { color: var(--white); } .showcase .box_2:hover .box_inner { box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); background: rgba(var(--green-rgb), 0.01); border-color: rgba(var(--green-rgb), 0.5); } .showcase .box_2:hover .box_inner:before { background: rgba(var(--green-rgb), 1); } .showcase .box_2:hover .box_inner:hover { background: rgba(var(--green-rgb), 0.05); border-color: rgba(var(--green-rgb), 1); } .showcase .box_2:hover .box_inner h3 { color: var(--green); } .showcase .box_3:hover .box_inner { box-shadow: inset 0px 5px 40px rgba(var(--white-rgb), 0.05); background: rgba(var(--yellow-rgb), 0.01); border-color: rgba(var(--yellow-rgb), 0.5); } .showcase .box_3:hover .box_inner:before { background: rgba(var(--yellow-rgb), 1); } .showcase .box_3:hover .box_inner:hover { background: rgba(var(--yellow-rgb), 0.05); border-color: rgba(var(--yellow-rgb), 1); } .showcase .box_3:hover .box_inner h3 { color: var(--yellow); } .showcase_carousel:after { content: ""; } } @media (min-width: 1200px) { .ov_1_tabs_nav { margin-bottom: 70px; } .showcase h3 { font-size: 24px; } .showcase .box { font-size: 18px; } .showcase .box_inner { border-radius: 24px; } .showcase .label { font-size: 18px; } .showcase .data { min-height: 60px; } .showcase .data:nth-child(2) { min-height: 60px; } .showcase .data:nth-child(3) { min-height: 100px; } .showcase .data:nth-child(5) { min-height: 85px; } .showcase .button { padding: 70px 20px 20px; } } /***************/ /* Overview #2 */ /***************/ .ov_2 { padding: 140px 0 0; letter-spacing: 0; } .ov_2 .page_bg { top: 61px; } .ov_2 h1 { font-size: 24px; } .ov_2_nav { background: rgba(var(--white-rgb), 0.03); border-radius: 5px; border: 0.5px solid rgba(var(--white-rgb), 0.3); padding: 2px; } .ov_2 .tab:not(.active) .tab.active { visibility: hidden; opacity: 0; } .ov_2_nav_item { -webkit-overflow-scrolling: touch; border-radius: 3px; color: var(--gray-100); flex-grow: 1; font-size: 14px; font-weight: 700; overflow: auto; padding: 9px 20px; text-align: center; text-transform: uppercase; } .ov_2_nav_item.active { background: rgba(var(--white-rgb), 0.15); color: var(--white); } .ov_2_nav_round { padding: 0; border-radius: 40px; border-color: var(--black-100); background: transparent; } .ov_2_nav_round .ov_2_nav_item { font-size: 12px; font-weight: 400; padding: 12px 40px; background: transparent; } .ov_2_nav_round .ov_2_nav_item:first-child { border-radius: 40px 0 0 40px; } .ov_2_nav_round .ov_2_nav_item:last-child { border-radius: 0 40px 40px 0; } .ov_2_nav_round .ov_2_nav_item.active { background: var(--black-100); } .ov_2_cards > div { margin-bottom: 20px; } .ov_2_card { -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); background: rgba(var(--white-rgb), 0.03); border-radius: 10px; border: 1px solid transparent; padding: 20px; text-align: center; } .ov_2_card.higlighted { border-color: rgba(var(--green-rgb), 0.3); } .ov_2_card:hover { background: rgba(var(--white-rgb), 0.07); } .ov_2_card h4 { color: var(--white); font-size: 36px; font-weight: 700; } .ov_2_card .btn { margin-bottom: 30px; z-index: 10; } .ov_2_card .btn:last-child { margin-bottom: 0; margin-top: 20px; } .ov_2_card_marker { background: rgba(var(--green-rgb), 0.05); border-radius: 0 0 10px 10px; font-size: 12px; left: 50%; padding-left: 20px; position: absolute; text-align: center; top: 0; transform: translateX(-50%); } .ov_2_card_marker .icon { background: rgba(var(--green-rgb), 0.2); border-radius: 0 0 10px 0; height: 30px; margin-left: 20px; padding: 3px 6px; width: 35px; } .ov_2_card_label { font-size: 14px; } .ov_2_card_data_value { font-size: 36px; font-weight: 700; } .ov_2_card_data .ov_2_card_label { color: var(--white); } .ov_2_card_option { background: rgba(var(--white-rgb), 0.05); border-radius: 10px; margin-bottom: 10px; padding: 15px 35px; } .ov_2_card_option:last-child { margin-bottom: 0; } .ov_2_card_option.higlighted { background: rgba(var(--green-rgb), 0.1); } .ov_2_card_option + .btn { margin-bottom: 10px; margin-top: 20px; } .ov_2_card_option_value { font-size: 24px; font-weight: 700; } .ov_2_card .btn-primary, .ov_2_card .tabulator .tabulator-footer .tabulator-paginator button, .tabulator .tabulator-footer .tabulator-paginator .ov_2_card button { background: rgba(var(--white-rgb), 0.03); border-color: rgba(var(--white-rgb), 0.5); } .ov_2_card .btn-primary:hover, .ov_2_card .tabulator .tabulator-footer .tabulator-paginator button:hover, .tabulator .tabulator-footer .tabulator-paginator .ov_2_card button:hover { background: rgba(var(--white-rgb), 0.1); } .ov_2_card_link { font-size: 0; } .ov_2_card_content_link { position: relative; z-index: 10; display: inline-block; vertical-align: top; } .ov_2_compact .ov_2_card { text-align: left; } .ov_2_compact h4 { font-size: 24px; } .ov_2_compact .ov_2_card_label { font-size: 12px; color: var(--gray); } .ov_2_compact .ov_2_card_data_value { background: rgba(var(--white-rgb), 0.05); border-radius: 5px; font-size: 24px; padding: 11px; text-align: center; white-space: nowrap; min-width: 130px; } .ov_2_compact .ov_2_card_marker { left: auto; transform: none; right: 20px; } .ov_2_compact .timer_compact { height: 50px; } .ov_2_compact .btn { margin-bottom: 10px; } @media (min-width: 768px) { .ov_2 { padding: 200px 0 0; } .ov_2 .page_bg { top: 68px; } .ov_2 h1:not(.h3) { font-size: 32px; } .ov_2_cards > div { margin-bottom: 30px; } } @media (min-width: 992px) { .ov_2 h1:not(.h3) { font-size: 64px; } } /***************/ /* Overview #3 */ /***************/ .ov_3 header { position: relative; } .ov_3 nav { font-weight: 700; } .ov_3 nav a { color: var(--gray-100); text-decoration: none; display: block; white-space: nowrap; } .ov_3 nav a.active, .ov_3 nav a:hover { color: var(--white); } .ov_3 .search_form { pointer-events: none; } .ov_3 .search_form form { height: 100%; } .ov_3 .search_form input, .ov_3 .search_form button, .ov_3 .search_form label { pointer-events: all; height: 100%; } .ov_3 .search_form button, .ov_3 .search_form input { pointer-events: none; opacity: 0; } .ov_3 .search_form button, .ov_3 .search_form label { position: absolute; top: 0; } .ov_3 .search_form button:before, .ov_3 .search_form label:before { content: ""; padding-bottom: 100%; } .ov_3 .search_form button { left: 0; } .ov_3 .search_form label { right: 0; } .ov_3 .search_form label:hover .icon { cursor: pointer; fill: var(--white) !important; } .ov_3 .search_form input { border: none; } .ov_3 .search_form input:focus, .ov_3 .search_form input:focus + button { pointer-events: all; opacity: 1; } .ov_3 .intro { font-family: "EB Garamond", serif; font-size: 18px; line-height: 1.5; } .ov_3 article { border-radius: 10px; position: relative; } .ov_3 article:hover { opacity: 0.9; } .ov_3 img { border-radius: 10px 10px 0 0; } .ov_3 .bg-black-100 .btn-share:hover { background-color: var(--black-200); } .ov_3 footer { white-space: nowrap; } .ov_3 footer a { position: relative; z-index: 10; } .ov_3 .link { font-size: 0; } @media (min-width: 576px) { .ov_3 img { border-radius: 10px 0 0 10px; } } @media (min-width: 768px) { .ov_3 header, .ov_3 .search_form input, .ov_3 .wrapper { border-radius: 20px; } } /***************/ /* Overview #4 */ /***************/ .ov_4 .table { text-transform: uppercase; width: 100%; display: table; } .ov_4 .thead { display: table-header-group; } .ov_4 .tbody { display: table-row-group; } .ov_4 .th, .ov_4 .td { padding: 10px; vertical-align: middle; display: table-cell; } .ov_4 .th { font-size: 10px; color: var(--gray); } .ov_4 .td { font-size: 14px; color: var(--white); border-bottom: 1px solid var(--black-200); } .ov_4 .tr { display: table-row; text-decoration: none; } .ov_4 .tr:hover .td { background-color: var(--black-200); cursor: pointer; } .ov_4 .tr:hover strong { color: var(--green); } .ov_4 .search { max-width: 160px; min-width: 120px; } .ov_4 .search input { padding: 2px 5px 2px 35px; height: 30px; font-size: 12px; } .ov_4 .search button { width: 30px; height: 30px; } .ov_4 .search button svg { width: 16px; height: 16px; } .ov_4 .table_wrapper { overflow: auto; -webkit-overflow-scrolling: touch; } .ov_4_text { background-color: var(--black-200); border-radius: 10px; } .ov_4_card_header { border-radius: 10px 10px 0 0; } .ov_4_card_body { border-radius: 0 0 10px 10px; } @media (min-width: 768px) { .ov_4_text { border-top-left-radius: 0; border-top-right-radius: 0; } } /***************/ /* Overview #5 */ /***************/ .ov_5 .box { background: var(--black-300); border-radius: 20px; } .ov_5_chart { --angle:0; width: calc(100vw - 40px); } .ov_5_chart .arrow { position: absolute; left: 50%; bottom: 38px; width: 4px; margin-left: -2px; fill: var(--white); transform-origin: center bottom; transform: rotate(calc(var(--angle) * 1deg)); transition: all 0.3s; height: 50%; } .ov_5_chart .arrow svg { height: 120%; position: relative; top: 10%; } .ov_5_chart .label { position: absolute; font-size: 12px; color: var(--gray-100); text-transform: uppercase; } .ov_5_chart .label_1 { left: 7.5%; bottom: 15px; } .ov_5_chart .label_2 { left: 20%; top: 50px; } .ov_5_chart .label_3 { left: 50px; top: 20px; right: 50px; text-align: center; } .ov_5_chart .label_4 { right: 20%; top: 50px; text-align: right; } .ov_5_chart .label_5 { right: 7.5%; bottom: 15px; text-align: right; } .ov_5_chart .scale path { stroke: var(--black-400); } .ov_5_chart.state_1 { --angle:-75; } .ov_5_chart.state_1 .label_1 { color: var(--red); font-weight: 700; } .ov_5_chart.state_2 { --angle:-45; } .ov_5_chart.state_2 .label_2 { color: var(--red); font-weight: 700; } .ov_5_chart.state_3 { --angle:0; } .ov_5_chart.state_3 .label_3 { color: var(--white); font-weight: 700; } .ov_5_chart.state_4 { --angle:45; } .ov_5_chart.state_4 .label_4 { color: var(--green); font-weight: 700; } .ov_5_chart.state_5 { --angle:75; } .ov_5_chart.state_5 .label_5 { color: var(--green); font-weight: 700; } .ov_5_chart_wrapper { position: relative; max-width: 410px; margin: 0 auto; } .ov_5_chart_inner { position: relative; width: 100%; } .ov_5_chart_inner:before, .ov_5_chart_inner:after { content: ""; position: absolute; left: 50%; border-radius: 50%; transform: translateX(-50%); } .ov_5_chart_inner:before { bottom: 25px; width: 28px; height: 28px; border: 1px solid rgba(var(--white-rgb), 0.1); } .ov_5_chart_inner:after { box-shadow: 0 0 30px 10px var(--gray), 12px 7px 25px 5px var(--gray); bottom: 39px; } .ov_5_chart_data_item { padding: 15px; } @media (max-width: 767.98px) { .ov_5_chart_data_item { flex-grow: 1; text-align: center; border-right: 1px solid var(--black-200); border-bottom: 1px solid var(--black-200); } .ov_5_chart_data_item:last-child { border-right: none; } .ov_5_data:after { content: "flickity"; display: none; } .ov_5_data .flickity-prev-next-button.previous { left: -15px; } .ov_5_data .flickity-prev-next-button.next { right: -15px; } } @media (max-width: 991.98px) { .ov_5_charts:after { content: "flickity"; display: none; } .ov_5_chart { opacity: 0; transition: opacity 0.3s; } .ov_5_chart.is-selected { opacity: 1; } } @media (min-width: 768px) { .ov_5_chart_data { background-color: var(--black-200); border-radius: 50px; } } @media (min-width: 992px) { .ov_5_chart_sm { max-width: 295px; } } /***************/ /* Overview #7 */ /***************/ .ov_7_card { border-radius: 20px; background-color: var(--black-300); position: relative; } .ov_7_card:hover { background-color: var(--black-200); } .ov_7_card footer button { color: var(--white); } .ov_7_card footer button:not(:disabled):hover { color: var(--green); } .ov_7_card footer button:disabled .icon { fill: var(--green); stroke: var(--green); } .ov_7_card footer .icon { stroke: currentColor; fill: currentColor; } .ov_7_card .link { font-size: 0; } .ov_7_card button { position: relative; z-index: 10; } /***************/ /* Overview #8 */ /***************/ .ov_8 h4 { position: relative; z-index: 10; } .ov_8 .card { position: relative; background-color: var(--black-300); border-radius: 25px; min-height: 210px; box-shadow: 0px 0px 48px rgba(var(--black-300-rgb), 0.6); } .ov_8 .card.dark { background-color: var(--black-600); background: linear-gradient(180deg, var(--black-300) 0%, var(--black-400) 100%); } .ov_8 .card.highlighted { background-color: rgba(var(--green-rgb), 0.02); border: 3px dashed rgba(var(--green-rgb), 0.48); } .ov_8 .card.highlighted big { text-shadow: -1px -1px 0 var(--green), 1px -1px 0 var(--green), -1px 1px 0 var(--green), 1px 1px 0 var(--green); color: var(--black); font-weight: 900; } .ov_8 picture { position: absolute; right: 35px; bottom: 40px; width: 40%; max-width: 135px; } .ov_8 picture img { max-height: 130px; width: auto; margin-left: auto; } @media (max-width: 767.98px) { .ov_8 .flickity_carousel:after { content: "flickity"; display: none; } .ov_8 .flickity_carousel .row { opacity: 0; transition: all 0.25s; width: 100%; } .ov_8 .flickity_carousel .row.is-selected { opacity: 1; } .ov_8 .flickity_carousel .flickity-page-dots { margin-top: 12px; } } @media (min-width: 768px) and (max-width: 991.98px) { .ov_8 .card-option { font-size: 18px; } .ov_8 picture { right: 20px; } .ov_8 h4 { font-size: 16px; } .ov_8 .btn-link strong { font-size: 14px; } } @media (min-width: 1200px) { .ov_8 picture { right: 50px; } } /***************/ /* Overview #9 */ /***************/ .ov_9 .text_12_text { border-radius: 24px; } .ov_9 .table_footer { background-color: rgba(var(--green-rgb), 0.03); border-radius: 0 0 15px 15px; } /**************/ /* Tournament */ /**************/ .tournament { padding: 90px 0 100px; } .tournament .data_value { font-size: 36px; font-weight: 700; text-align: center; } .tournament .panel { position: relative; } .tournament .panel_title { background: rgba(var(--white-rgb), 0.05); border-radius: 10px; color: var(--white); font-size: 18px; font-weight: 700; cursor: pointer; } .tournament .panel_title .icon { stroke-width: 3px; stroke: var(--gray); width: 16px; height: 16px; } .tournament .active .panel_title { background: rgba(var(--white-rgb), 0.1); border-radius: 10px 10px 0px 0px; } .tournament .active .panel_title .icon { stroke: var(--white); transform: rotate(-180deg); } .tournament .panel_content { background-color: var(--black-200); border-radius: 0px 0px 10px 10px; overflow: hidden; } .tournament .panel:not(.active) .panel_content { display: none; } .tournament .table_wrapper { overflow: auto; } .tournament table { font-weight: 400; white-space: nowrap; width: 100%; } .tournament .panel_1 tbody { font-weight: 700; } .tournament .panel_1 td:first-child { width: 80%; } .tournament .panel_3 table { color: var(--white); } .tournament th { font-size: 14px; font-weight: 400; padding: 15px 20px; } .tournament td { font-size: 18px; line-height: 1.16; padding: 15px 20px; vertical-align: middle; } .tournament td:first-child { width: 40px; } .tournament tr:nth-child(odd) td { background: rgba(var(--black-100-rgb), 0.9); } .tournament tr.highlighted td { background: rgba(var(--green-rgb), 0.15); } .tournament tr:last-child td:first-child { border-radius: 0px 0px 0 10px; } .tournament tr:last-child td:last-child { border-radius: 0px 0px 10px 0; } .tournament_user_image { width: 40px; } .tournament_user_image .bg { padding-bottom: 100%; border-radius: 100%; } @media (max-width: 767.98px) { .tournament .data_label { color: var(--gray); } .tournament .data_value { background: rgba(255, 255, 255, 0.05); border-radius: 10px; padding: 15px; min-width: 185px; } } @media (max-width: 991.98px) { .tournament .data_value { font-size: 24px; } } @media (min-width: 768px) { .tournament { padding: 270px 0 100px; } .tournament .panel_title { font-size: 14px; line-height: 1.43; } .tournament h1:not(.h3) { font-size: 36px; } .tournament .panel_1 .panel_content { position: absolute; left: 0; right: 0; top: 100%; z-index: 10; padding-top: 20px; padding-bottom: 20px; } .tournament .panel_2 .panel_content { background: rgba(var(--white-rgb), 0.05); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 10px; } .tournament .panel_3 .panel_content { background: rgba(var(--black-rgb), 0.35); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border-radius: 10px; padding-top: 40px; padding-bottom: 70px; } .tournament .panel_3 tr:hover td { color: var(--green); } .tournament tr:nth-child(odd):not(.highlighted) td { background: rgba(var(--white-rgb), 0.03); } .tournament tr:last-child td:first-child, .tournament tr:last-child td:last-child { border-radius: 0; } } /***************/ /* Blog detail */ /***************/ .blog_detail h1 { font-size: 24px; } .blog_detail h2 { font-size: 20px; margin-bottom: 20px; } .blog_detail h3, .blog_detail h4 { font: 700 20px/1.5 "EB Garamond", serif; } .blog_detail h3 { margin-bottom: 20px; } .blog_detail h4 { margin-bottom: 10px; } .blog_detail p { font: 18px/1.5 "EB Garamond", serif; margin-bottom: 20px; } .blog_detail img { border-radius: 10px; height: auto; } .blog_detail ul { margin-bottom: 30px; } .blog_detail ul li { margin-bottom: 10px; padding-left: 30px; position: relative; } .blog_detail ul li:before { color: var(--green); content: "•"; left: 0; position: absolute; top: 0; } .blog_detail ul:last-child { margin-bottom: 0; } .blog_detail ol { counter-reset: ordered-list; font-size: 14px; margin-bottom: 40px; padding-top: 10px; } .blog_detail ol li { margin-bottom: 15px; padding-left: 45px; position: relative; } .blog_detail ol li:before { color: var(--gray-100); content: counter(ordered-list, decimal-leading-zero); counter-increment: ordered-list; left: 0; position: absolute; top: 0; } .blog_detail ol li:last-child { margin-bottom: 0; } .blog_detail table { width: 100%; } .blog_detail table td { padding: 0 10px; } .blog_detail table td:first-child { padding-left: 0; } .blog_detail table td:last-child { padding-right: 0; } .blog_detail table:has(table) { display: block; overflow-x: auto; white-space: nowrap; width: 100% !important; } .blog_detail .tags a { text-decoration: none; } .blog_detail .tags a:hover { text-decoration: underline; } .blog_detail .spoiler_trigger { border-bottom: 1px solid var(--gray-100); cursor: pointer; font-family: inherit; font-size: 18px; font-weight: 400; padding: 10px 40px 10px 10px; position: relative; margin-bottom: 0; } .blog_detail .spoiler_trigger:after { background: var(--gray-100); content: ""; height: 16px; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 12'%3E%3Cpath fill='transparent' stroke='currentColor' stroke-width='3' d='M1.06 1.553l8.928 8.944M17.051 1.298l-8.928 8.945'/%3E%3C/svg%3E") no-repeat 50% 50%; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 12'%3E%3Cpath fill='transparent' stroke='currentColor' stroke-width='3' d='M1.06 1.553l8.928 8.944M17.051 1.298l-8.928 8.945'/%3E%3C/svg%3E") no-repeat 50% 50%; position: absolute; right: 10px; top: 12px; width: 16px; } .blog_detail .spoiler_trigger.s-active, .blog_detail .spoiler_trigger:hover { color: var(--green); } .blog_detail .spoiler_trigger.s-active { border-bottom-color: var(--green); } .blog_detail .spoiler_trigger.s-active:after { transform: rotate(-180deg); background: var(--white); } .blog_detail .spoiler_content { border-radius: 0px 0px 10px 10px; display: none; background: var(--black-100); padding: 20px; } .blog_detail_sidebar { z-index: 1; } @media (min-width: 768px) { .blog_detail .wrapper { border-radius: 20px; } .blog_detail h1 { font-size: 36px; } .blog_detail h2 { font-size: 24px; margin-bottom: 30px; } .blog_detail h3, .blog_detail h4 { font-size: 24px; } .blog_detail h3 { margin-bottom: 30px; } .blog_detail h4 { margin-bottom: 10px; } .blog_detail p { margin-bottom: 30px; font-size: 24px; } .blog_detail .spoiler_content { font-size: 20px; padding: 30px 50px; } .blog_detail_image img { border-radius: 20px 20px 0 0; } } /***********/ /* Lottery */ /***********/ .page_green_bg { background: linear-gradient(0deg, rgba(14, 14, 14, 0) 0%, rgba(92, 224, 46, 0.05) 100%); max-height: 2018px; } .page_green_bg_md { max-height: 60vh; } /***************/ /* Breadcrumbs */ /***************/ .breadcrumbs { background-color: var(--black-400); margin-top: 70px; font-size: 12px; line-height: 1.4; } .breadcrumbs li { display: inline; } .breadcrumbs li:after { content: "/"; margin: 0 5px; color: var(--gray-100); font-size: 1.2em; } .breadcrumbs li:last-child { font-size: 1.2em; } .breadcrumbs li:last-child:after { display: none; } .breadcrumbs a { color: var(--gray-100); text-decoration: none; } .breadcrumbs a:hover { color: var(--green); } @media (min-width: 768px) { .breadcrumbs { margin-top: 89px; } } @media (min-width: 992px) { .breadcrumbs { margin-top: 109px; font-size: 14px; } } @media (min-width: 1200px) { .breadcrumbs { margin-top: 179px; } } /*******/ /* FAQ */ /*******/ .faq .accordion-item { border-bottom: 1px solid var(--gray-300); color: var(--gray); background-color: var(--black-200); cursor: pointer; } .faq .accordion-item .icon { stroke: var(--gray); stroke-width: 2px; } .faq .accordion-item:hover { color: var(--white); } .faq .accordion-item:hover .icon { stroke: var(--white); } .faq .content-expanded .accordion-item { color: var(--green); background-color: transparent; } .faq .content-expanded .accordion-item .icon { stroke: var(--green); transform: scaleY(-1); } .faq .accordion-content picture { margin-bottom: 2.75em; } .faq .accordion-content img { width: 100%; } .faq .accordion-content-footer .box { background: var(--black-300); border-radius: 24px; margin-bottom: 2.85em; } .faq .accordion-content-footer .btn { border-radius: 100%; padding: 0; width: 48px; height: 48px; } .faq .accordion-content-footer .btn svg { stroke: none; } .faq .accordion-content-footer .chat_trigger { position: relative; right: auto; bottom: auto; flex: 0 0 60px; } .faq .accordion-content-buttons { max-width: 220px; } .faq .search-active .search-card:not(.highlight) { display: none; } .faq_header picture { flex: 0 0 96px; } /***************/ /* Article FAQ */ /***************/ /* Раскрытие, цвета и поворот шеврона берутся у общего аккордеона (_parts.scss). Здесь только типографика: без неё вопросы на странице блога унаследовали бы .blog_detail h3 — EB Garamond 20px, — и один и тот же блок выглядел бы на двух страницах статьи по-разному. */ .article_faq h2 { font-size: 20px; margin-bottom: 10px; } .article_faq h3 { color: inherit; font: 700 16px/1.4 "Roboto", sans-serif; margin-bottom: 0; } .article_faq p { font: 16px/1.5 "Roboto", sans-serif; margin-bottom: 15px; } .article_faq p:last-child { margin-bottom: 0; } @media (min-width: 768px) { .article_faq h2 { font-size: 24px; margin-bottom: 20px; } .article_faq h3 { font-size: 18px; } .article_faq p { font-size: 18px; } } @media (min-width: 768px) { .faq .accordion-item { background: transparent; } .faq .box_md { background: var(--black-300); border-radius: 24px; } .faq .accordion-content-footer .box { margin-bottom: 0; } } @media (min-width: 1200px) { .faq_header h2 { font-size: 36px; } .faq_header picture { flex: 0 0 128px; } } /**************/ /* Calculator */ /**************/ .calculator .box { margin: -4rem calc(var(--container-gap) * -1) 0; padding-top: 10rem; padding-left: var(--container-gap); padding-right: var(--container-gap); } .calculator .box-2 { border-top-left-radius: 0; border-top-right-radius: 0; } .calculator .table { overflow: auto; -webkit-overflow-scrolling: touch; } .calculator .table table { min-width: 800px; } .calculator .btn-link { stroke-width: 3px; stroke: currentColor; } .calculator th, .calculator td { border-bottom: 1px solid var(--black-100); padding: 2.5rem; width: 16%; } .calculator th:first-child, .calculator td:first-child { padding-left: 0; } .calculator th:last-child, .calculator td:last-child { padding-right: 0; width: 20%; } /* Block #01 */ .b-01 .card { border-radius: 3.2rem; } .b-01 .card h3 { font-weight: 400; font-size: 2.4rem; } .b-01 .card .icon { width: 3rem; height: 3rem; flex-shrink: 0; } @media (min-width: 768px) { .b-01 .card { border-radius: 4.8rem; } .b-01 .card h3 { font-size: 3.6rem; } .b-01 .card .icon { width: 9rem; height: 9rem; } } /* Block #02 */ .b-02 p { text-wrap: balance; } .b-02 .figure-1 { grid-area: 1/-1; width: 389px; max-width: 80vw; } .b-02 .figure-2 { width: 224px; max-width: 25vw; } .b-02 .box-1 { display: grid; justify-items: center; } .b-02 .box-2 { grid-area: 1/-1; } .b-02 .box-3 { display: grid; justify-items: center; align-items: center; } .b-02 .box-3 > div { grid-area: 1/-1; } .b-02 .box-3 > div:first-child { opacity: 0.06; } .b-02 .box-4 { background-color: rgba(var(--green-rgb), 0.05); border-radius: 1rem; } /* Block #03 */ .b-03 .card { position: relative; background-color: var(--black-300); border-radius: 25px; min-height: 210px; box-shadow: 0px 0px 48px rgba(var(--black-300-rgb), 0.6); } .b-03 .card.dark { background-color: var(--black-600); background: linear-gradient(180deg, var(--black-300) 0%, var(--black-400) 100%); } .b-03 .card.highlighted { background-color: rgba(var(--green-rgb), 0.02); border: 3px dashed rgba(var(--green-rgb), 0.48); } .b-03 .card.highlighted big { text-shadow: -1px -1px 0 var(--green), 1px -1px 0 var(--green), -1px 1px 0 var(--green), 1px 1px 0 var(--green); color: var(--black); font-weight: 900; } /* Block #04 */ .b-04 { overflow: hidden; } .b-04 > picture img { -o-object-position: bottom center; object-position: bottom center; } .b-04 [data-content-trigger] .icon { stroke-width: 3px; } .b-04 [data-content-container] { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.35s cubic-bezier(0.4, 0, 0.6, 1); max-height: unset !important; } .b-04 .content-expanded [data-content-container] { grid-template-rows: 1fr; } .b-04 [data-content-spacer] { overflow: hidden; } /* Block #05 */ .b-05 { letter-spacing: 0; } .b-05 .box { margin-bottom: 5px; } @media (min-width: 768px) { .b-05 .box { border-radius: 0.75rem; } } @media (max-width: 1599px) { .b-05 header { display: none; } .b-05 .box { padding-top: 1rem; padding-bottom: 1rem; margin-bottom: 1.5rem; } .b-05 .box > div { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; } } @media (min-width: 1600px) { .b-05 .container { display: grid; grid-template-columns: repeat(6, auto) max-content; } .b-05 .row { display: grid; grid-column: 1/8; grid-template-columns: subgrid; align-items: center; padding-left: 1.875rem; padding-right: 1.875rem; } .b-05 .row > div { max-width: unset; width: auto; } .b-05 .label { display: none; } } /* Block #06 */ .b-06 .flickity-viewport { width: 100%; display: flex; } .b-06 .flickity-page-dots { position: relative; bottom: 0; margin-top: 1.5rem; } .b-06 .content ul li::before { background: var(--gray); } .b-06 .card { border-top: 0.5rem solid var(--black-100); } .b-06 .active { border-top-color: var(--green) !important; } .b-06 .active .card-label { display: flex !important; } .b-06 .card-label { display: none; } @media (max-width: 1439px) { .b-06 [data-flickity]:after { content: "flickity"; display: none; } } /* Block #07 */ .b-07 article { background-color: var(--black-200); border-bottom: 2px solid var(--black-300); } .b-07 header { border-top: 2px solid transparent; } .b-07 .content-wrapper { max-height: 0px; transition: max-height 0.35s; overflow: hidden; } .b-07 .content-collapsed .content-wrapper { max-height: 0px !important; } .b-07 .content-expanded { border-bottom-color: var(--green); } .b-07 .content-expanded header { background-color: transparent; color: var(--green); } .b-07 .content-expanded header .icon { transform: scaleY(-1); } .b-07 .row { gap: 5px; } @media (max-width: 767.98px) { .b-07 header { font-size: 1.6rem; } } @media (min-width: 768px) { .b-07 article, .b-07 header { border-radius: 10px; } .b-07 .row { gap: 20px; } } @media (min-width: 1200px) { .b-07 article { max-width: calc(50% - 10px); } } /* Block #08 */ .b-08 .picture-2 { position: absolute; left: 0; top: 0; transform: translate(-70%, -15%); } @media (min-width: 992px) { .b-08 .container { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: repeat(2, auto); } .b-08 h1 { grid-area: 1/1/1/9; } .b-08 .picture-1 { grid-area: 1/9/3/13; } .b-08 p { grid-area: 2/1/2/9; text-wrap: balance; } } /* Block #09 */ .b-09 .box, .b-09 .card { background-image: linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%); background-repeat: repeat-x, repeat-x, repeat-y, repeat-y; } .b-09 .card { --bg-size: 12px; --bg-color: var(--black-400); border-radius: 12px; background-position: 19% top, 19% bottom, left 9%, right 9%; background-size: 30% var(--bg-size), 30% var(--bg-size), var(--bg-size) 19%, var(--bg-size) 19%; } .b-09 .card-1 .box { --bg-color: var(--orange-100); } .b-09 .card-2 .box { --bg-color: var(--blue-100); } .b-09 .box { --bg-size: 6px; border-radius: inherit; background-position: 10% top, 10% bottom, left 32%, right 32%; background-size: 19% var(--bg-size), 19% var(--bg-size), var(--bg-size) 42%, var(--bg-size) 42%; } .b-09 .content ul > li::before { background-color: currentColor; } @media (min-width: 768px) { .b-09 .card { background-position: 8% top, 8% bottom, left 9%, right 9%; background-size: 19% var(--bg-size), 19% var(--bg-size), var(--bg-size) 15.5%, var(--bg-size) 15.5%; } .b-09 .box { background-position: 18% top, 18% bottom, left 32%, right 32%; background-size: 10.5% var(--bg-size), 10.5% var(--bg-size), var(--bg-size) 42%, var(--bg-size) 42%; } } /* Block #10 */ .b-10 .card { border-radius: 24px; overflow: hidden; isolation: isolate; } .b-10 .number { position: absolute; right: 0; top: 0; } .b-10 .number::before { content: ""; position: absolute; inset: -80px 0 0 -30px; background-color: var(--green); z-index: -1; width: 150px; aspect-ratio: 1; transform: rotate(-45deg); } .b-10 .figure { position: absolute; right: 0; top: 0; transform: translateY(-30%); } /* Block #11 */ .b-11 .box, .b-11 .card { background-image: linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%); background-repeat: repeat-x, repeat-x, repeat-y, repeat-y; } .b-11 .card { --bg-size: 12px; --bg-color: var(--black-400); border-radius: 12px; background-position: 19% top, 19% bottom, left 9%, right 9%; background-size: 30% var(--bg-size), 30% var(--bg-size), var(--bg-size) 19%, var(--bg-size) 19%; } .b-11 .card-1 .box { --bg-color: var(--orange-100); } .b-11 .card-2 .box { --bg-color: var(--blue-100); } .b-11 .box { --bg-size: 6px; border-radius: inherit; background-position: 10% top, 10% bottom, left 32%, right 32%; background-size: 19% var(--bg-size), 19% var(--bg-size), var(--bg-size) 42%, var(--bg-size) 42%; } .b-11 .content ul > li::before { background-color: currentColor; } .b-11 picture { position: relative; z-index: 1; } @media (min-width: 768px) { .b-11 .card { background-position: 8% top, 8% bottom, left 9%, right 9%; background-size: 19% var(--bg-size), 19% var(--bg-size), var(--bg-size) 15.5%, var(--bg-size) 15.5%; } .b-11 .box { background-position: 18% top, 18% bottom, left 32%, right 32%; background-size: 10.5% var(--bg-size), 10.5% var(--bg-size), var(--bg-size) 42%, var(--bg-size) 42%; } .b-11 picture { position: absolute; right: 100%; top: 0; width: 69%; display: flex; align-items: center; } } /* Block #12 */ .b-12 .card, .b-12 .b-09 .box, .b-09 .b-12 .box, .b-12 .b-11 .box, .b-11 .b-12 .box { background-image: linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(to right, var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%), linear-gradient(var(--bg-color) 50%, transparent 50%); background-repeat: repeat-x, repeat-x, repeat-y, repeat-y; } .b-12 .card { --bg-size: 12px; --bg-color: var(--black-400); border-radius: 12px; background-position: 19% top, 19% bottom, left 9%, right 9%; background-size: 30% var(--bg-size), 30% var(--bg-size), var(--bg-size) 19%, var(--bg-size) 19%; } @media (min-width: 768px) { .b-12 .card { background-position: 8% top, 8% bottom, left 9%, right 9%; background-size: 10% var(--bg-size), 10% var(--bg-size), var(--bg-size) 15.5%, var(--bg-size) 15.5%; } } /* Block #13 */ .b-13 .figure { position: absolute; top: 50%; transform: translateY(-50%); min-width: 50%; } .b-13 .figure-1 { right: 50%; } .b-13 .figure-2 { left: 50%; } /* Block #14 */ .b-14 { z-index: 1; } .b-14 .figure { position: absolute; } .b-14 .figure-1 { right: 16.75%; top: -30px; } .b-14 .figure-2 { z-index: 1; top: -10px; right: 6.25%; } .b-14 .figure-3 { right: 10.5%; bottom: -30px; } .b-14 .box { max-width: 1520px; border-radius: 4.8rem; } /* Block #15 */ .b-15 .box { border-style: solid; border-color: var(--black-100); border-width: 1px 0 0 1px; } @media (max-width: 767.98px) { .b-15 .row > div:first-child .box { border-top-width: 0; } .b-15 .row > div:last-child .box { border-bottom-width: 1px; } } @media (min-width: 768px) { .b-15 .row { margin: 0; } .b-15 .row > div { padding: 0; } .b-15 .row > div:nth-child(1) .box, .b-15 .row > div:nth-child(2) .box { border-top-width: 0; } .b-15 .row > div:nth-child(odd) .box { border-left-width: 0; padding-left: 0 !important; } } /* Block #16 */ .b-16 { --radius: 2.5rem; } .b-16 dl { counter-reset: counter 0; } .b-16 dt { counter-increment: counter; padding: 1.5rem 2rem; transition: all 0.25s ease-out; cursor: pointer; } .b-16 dt::before { content: counter(counter, decimal-leading-zero) "."; font-size: 0.625em; margin-right: 1em; } .b-16 dt svg { fill: currentColor !important; } .b-16 dt.s-active { background-color: var(--green); color: var(--black-100); } @media (hover: hover) { .b-16 dt:hover { background-color: var(--green); color: var(--black-100); } } .b-16 dd { padding: 3rem 2rem; border-radius: var(--radius); background-color: var(--black-100); display: none; border-bottom: 6px solid var(--green); margin-bottom: 24px; } @media (min-width: 768px) { .b-16 { --radius: 1.2rem; } .b-16 dt { border-radius: var(--radius); } } /* Block #17 */ .b-17 .figure { position: absolute; top: 50%; transform: translateY(-50%); min-width: 50%; } .b-17 .figure-1 { right: 50%; } .b-17 .figure-2 { left: 50%; } /* Article body ------------------------------------------------------------ */ .article_disclaimer { max-width: 673px; line-height: 1.5; } .article_body { --measure: 673px; } .article_body img:not(.icon) { height: auto; } .article_body p, .article_body ul, .article_body ol, .article_body h2 { max-width: var(--measure); } .article_body p:has(img) { max-width: none; } .article_body p, .article_body li { line-height: 1.6; } .article_body h2 { font-size: 2.6rem; letter-spacing: normal; margin-top: 2.2em; margin-bottom: 0.6em; } .article_body table { display: block; max-width: 100%; overflow-x: auto; } .article_standfirst { max-width: 560px; } /***********/ /* Cabinet */ /***********/ .cabinet { padding: 30px 20px; letter-spacing: 0.05em; position: relative; } .cabinet .container { padding: 0; max-width: none; } @media (max-width: 767.98px) { .cabinet { padding-bottom: 90px; } .cabinet .row { margin-left: -10px; margin-right: -10px; } .cabinet [class^=col]:not(.color-white):not(.color-red):not(.color-green) { padding-left: 10px; padding-right: 10px; } } @media (min-width: 768px) { .cabinet { margin-left: 36%; padding: 5vh 3vw; min-height: 100vh; } } @media (min-width: 1240px) { .cabinet { margin-left: 450px; } } @media (min-width: 1600px) { .cabinet { padding: 50px; } } /**************/ /* First step */ /**************/ .cabinet_first_step { text-align: center; position: static; margin: 0 -20px; padding: 20px; min-height: 50vh; } .cabinet_first_step h1 { font-weight: 400; font-size: 26px; margin-bottom: 2em; } @media (min-width: 768px) { .cabinet_first_step { margin: 0 -3vw; padding: 5vh 3vw; } } @media (min-width: 992px) { .cabinet_first_step h1 { font-size: 48px; } } @media (min-width: 1600px) { .cabinet_first_step { margin: 0 -50px; } } /**************/ /* Navigation */ /**************/ .cabinet_nav { font-size: 0; margin: 0 0 40px; position: relative; } .cabinet_nav nav { margin: 0 -10px; } .cabinet_nav li { display: inline-block; vertical-align: top; } .cabinet_nav li a { display: block; font-size: 14px; letter-spacing: 0.05em; font-weight: 400; color: var(--gray-100); position: relative; padding: 15px; text-decoration: none; } .cabinet_nav li a:after { content: ""; position: absolute; left: 15px; right: 15px; opacity: 0; height: 1px; background: var(--green); bottom: 0; } .cabinet_nav li a:hover { color: var(--white); } .cabinet_nav .active a { color: var(--white); } .cabinet_nav .active a:after { opacity: 1; } .cabinet_nav .logout { padding: 0; } .cabinet_nav .logout .icon { width: 40px; height: 40px; margin-left: 20px; } @media (min-width: 768px) { .cabinet_nav li a { font-size: 12px; padding-left: 10px; padding-right: 10px; } .cabinet_nav li a:after { left: 10px; right: 10px; } } @media (min-width: 992px) { .cabinet_nav nav { margin: 0 -15px; } .cabinet_nav li a { font-size: 14px; padding-left: 15px; padding-right: 15px; } .cabinet_nav li a:after { left: 15px; right: 15px; } } /*********************/ /* Cabinet user menu */ /*********************/ .cabinet_user_menu { position: relative; z-index: 50; } .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_trigger .icon_open { display: none; } .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_trigger .icon_close { display: block; } .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_trigger { border-top-right-radius: 0; border-bottom-right-radius: 0; } .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_inner { opacity: 1; visibility: visible; } .cabinet_user_menu_trigger { background: var(--black-200); border-radius: 12px; padding: 6px; position: relative; z-index: 10; min-height: 48px; text-align: left; max-width: 100%; color: var(--gray-100); text-decoration: none; } .cabinet_user_menu_trigger:hover { background: var(--black-100); } .cabinet_user_menu_trigger picture { width: 36px; height: 36px; flex: 0 0 auto; } .cabinet_user_menu_trigger picture img { border-radius: 100%; } .cabinet_user_menu_trigger .icon_close { display: none; } .cabinet_user_menu_trigger strong { min-width: 0; } .cabinet_user_menu_inner { position: absolute; right: 0; top: -20px; background: var(--black-100); padding: 75px 25px 30px; border-radius: 10px; min-width: 450px; opacity: 0; visibility: hidden; transition: all 0.15s; } .cabinet_user_menu_inner .cabinet_user_menu_trigger, .cabinet_user_menu_inner .trigger_icon { background-color: var(--gray-300); } .cabinet_user_menu_inner .cabinet_user_menu_trigger:hover, .cabinet_user_menu_inner .trigger_icon:hover { background-color: var(--black-200); } .cabinet_nav .cabinet_user_menu { max-width: 220px; } @media (max-width: 1199.98px) { .cabinet_user_menu .icon_open { display: none; } .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_trigger picture { display: none; } .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_trigger .icon_close { display: block; } } /**********/ /* Header */ /**********/ .cabinet_header .title_box { border-bottom: 1px solid var(--green); font-size: 16px; display: inline-block; vertical-align: top; padding-bottom: 15px; margin-bottom: 30px; } .cabinet_header .title_box .icon { width: 16px; height: 16px; position: relative; top: 2px; fill: var(--green); margin-right: 15px; } .cabinet_header .heading { margin-bottom: 30px; padding-top: 0; text-transform: none; } .cabinet_header .button { margin-bottom: 30px; } .cabinet .data { margin-bottom: 30px; } .cabinet .data_label { color: var(--gray); margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cabinet .data_value { font-size: 24px; font-weight: 400; color: var(--white); line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cabinet .data_box { border: 1px solid rgba(var(--gray-rgb), 0.2); border-radius: 10px; padding: 20px; } .cabinet .data_box .data_value { font-size: 18px; } .cabinet_header .mt-new { margin-left: 16px; display: flex; padding: 0 6px; align-items: center; border-radius: 6px; background: #5CE02E; color: #0F0F0F; font-size: 12px; font-weight: 700; text-transform: uppercase; } @media (max-width: 767.98px) { .cabinet .data_mobile_box { border: 1px solid rgba(var(--gray-rgb), 0.2); border-radius: 10px; padding: 20px; } .cabinet .data_mobile_box .data_value { font-size: 18px; } } @media (min-width: 768px) { .cabinet .data_label { font-size: 16px; } } @media (min-width: 992px) { .cabinet .data_total { padding: 30px 0; } .cabinet .data_box { padding: 30px; } } @media (min-width: 1200px) { .cabinet .data_total .data_value { font-size: 36px; } .cabinet .data_box .data_value { font-size: 24px; } } @media (min-width: 1440px) { .cabinet .data_box { padding-left: 60px; padding-right: 60px; } } /*********/ /* Chart */ /*********/ .cabinet_chart { padding: 0 0 30px; } .cabinet_chart_wrapper { position: relative; border: 1px solid var(--gray-300); height: 190px; } @media (min-width: 768px) { .cabinet_chart { padding: 20px 0 50px; } .cabinet_chart_wrapper { border-radius: 10px; height: 280px; } } /**********/ /* Filter */ /**********/ .cabinet .filter { padding-top: 30px; } .cabinet .filter_item { margin-right: 10px; } .cabinet .filter_item:last-child { margin-right: 0; } .cabinet .filter .radio { padding: 0; } .cabinet .filter .radio [type=radio] + label { font-size: 14px; padding: 7px 15px 5px 30px; border-radius: 50px; white-space: nowrap; } .cabinet .filter .radio [type=radio] + label:before { width: 10px; height: 10px; border: none; background: var(--white); left: 9px; top: 9px; } .cabinet .filter .green [type=radio] + label:before { background: var(--green); } .cabinet .filter .red [type=radio] + label:before { background: var(--red); } .cabinet .filter .radio [type=radio] + label:after { display: none; } .cabinet .filter .radio [type=radio]:checked + label { background: var(--black-100); } @media (min-width: 768px) { .cabinet .filter { padding-top: 0; } .cabinet .filter_item { margin-right: 30px; } } /* Filter elements */ .cabinet .selectbox, .cabinet .inputbox { margin-bottom: 30px; } /* Search */ @media (min-width: 768px) { .cabinet .search { margin-bottom: 20px; } } @media (min-width: 1200px) { .cabinet .search { margin-bottom: 0; } } /********/ /* Form */ /********/ .cabinet .cabinet_header + .form { padding-top: 30px; } .cabinet .form .submit { flex: 0 1 200px; } @media (min-width: 768px) { .cabinet .cabinet_header + .form { padding-top: 70px; } } @media (min-width: 1200px) { .cabinet .form .row .row { margin: 0 10px 0 -40px; } .cabinet .form .row .row > div { padding-left: 40px; padding-right: 40px; } } /*****************/ /* Payment cards */ /*****************/ .payment_cards_header { font-size: 12px; margin-bottom: 30px; } .payment_cards_header h4 { font-size: 16px; font-weight: 300; } .payment_cards_header .tooltip { vertical-align: super; cursor: pointer; } .payment_cards_header .icon_help { width: 20px; height: 20px; } @media (min-width: 576px) { .payment_cards_list { margin: 0 -10px; } } @media (min-width: 992px) { .payment_cards_lg { padding-top: 20px; } } @media (min-width: 1360px) { .payment_cards_lg .payment_cards_list { margin: 0 -20px; } } /********/ /* Feed */ /********/ .cabinet_feed { font-size: 12px; font-weight: 400; } .cabinet_feed .badge-lg { min-width: 80px; } .cabinet_feed .tabs_container { overflow: visible; } .tabs_container .tab { display: none; min-height: 0; opacity: 1; position: static; visibility: visible; } .tabs_container .tab.active { display: block; position: static; } .cabinet_feed_heading { font-size: 14px; color: var(--gray-100); padding: 30px 0 20px; } .cabinet_feed_item { background: var(--black-200); margin-bottom: 10px; border-radius: 10px; transition: all 0.2s ease-in-out; } .cabinet_feed_item:hover { background: var(--black-300); transition: all 0.25s ease-in-out; } .cabinet_feed_item_header { padding: 15px 10px; cursor: pointer; } .cabinet_feed_item_header .row { align-items: center; } .cabinet_feed_item_header .col { padding: 0; } .cabinet_feed_item_header .col:last-child { text-align: right; flex-grow: 0; } .cabinet_feed_item_header .box { padding: 0 10px; } .cabinet_feed_item h4 { color: var(--white); font-size: 14px; } .cabinet_feed_item h4.country { display: flex; } .cabinet_feed_item h4.country .icon { width: 24px; height: 24px; flex-shrink: 0; margin-right: 10px; } .cabinet_feed_item_header p { padding-top: 5px; } .cabinet_feed_item .price { white-space: nowrap; font-size: 12px; margin-bottom: 0; } .cabinet_feed_item .date { font-size: 18px; color: var(--gray-100); } .cabinet_feed_item .more { position: relative; font-size: 0; line-height: 26px; padding: 0; min-width: 28px; border: 1px solid var(--gray-300); cursor: pointer; display: inline-block; vertical-align: top; color: var(--gray-100); } .cabinet_feed_item .more .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 12px; height: 12px; stroke: var(--gray-100); stroke-width: 3; } .cabinet_feed_item .edit { position: relative; font-size: 0; line-height: 26px; padding: 0; min-width: 28px; border: 1px solid var(--gray-300); cursor: pointer; display: inline-block; vertical-align: top; color: var(--gray-100); text-decoration: none; } .cabinet_feed_item .edit .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-90deg); width: 12px; height: 12px; stroke: var(--gray-100); stroke-width: 3; margin-left: 1px; } .cabinet_feed_item:hover .edit .icon { stroke: var(--white); } .cabinet_feed .content-collapsed .cabinet_feed_item_extra { max-height: 0 !important; } .cabinet_feed_item_extra { overflow: hidden; transition: all 0.25s ease-in-out; } .cabinet_feed_item_extra_inner { padding: 17px 17px 0 20px; border-top: 1px solid var(--gray-300); } .cabinet_feed_item_extra .data { margin-bottom: 20px; } .cabinet_feed_item_extra .data_label { font-size: 12px; margin-bottom: 5px; } .cabinet_feed_item_extra .data_value { font-size: 14px; font-weight: 700; } .cabinet_feed_item_extra .col { min-width: 50%; flex-grow: 0; } .cabinet_feed .extra_content_heading { color: var(--white); display: flex; cursor: pointer; } .cabinet_feed .extra_content_heading .icon { stroke: var(--white); stroke-width: 3px; width: 18px; height: 18px; margin-right: 15px; } .cabinet_feed .extra_content_heading:after { content: ""; border-bottom: 1px solid var(--black-200); display: block; flex-grow: 1; margin-left: 10px; margin-bottom: 5px; } .cabinet_feed .cabinet_feed_item.content-expanded { background: var(--black-300); } .cabinet_feed .content-expanded .cabinet_feed_item_extra { transition: all 0.3s ease-in-out; max-height: 600px; } .cabinet_feed .content-expanded .more { color: var(--white); } .cabinet_feed .content-expanded .more .icon { transform: rotate(-180deg) translate(50%, 50%); stroke: var(--white); } .cabinet_feed_extra_content { overflow: hidden; transition: all 0.25s ease-in-out; } .content-expanded .cabinet_feed_extra_content { transition: all 0.3s ease-in-out; max-height: 600px; } .content-collapsed .cabinet_feed_extra_content { max-height: 0 !important; } .content-expanded .extra_content_heading .icon { transform: rotate(-180deg); } @media (min-width: 768px) { .cabinet_feed { font-size: 14px; } .cabinet_feed .badge-lg { min-width: 120px; } .cabinet_feed h4 { font-size: 16px; } .cabinet_feed_item { padding-left: 15px; padding-right: 15px; } .cabinet_feed_item .price { font-size: 16px; } .cabinet_feed_item .more { line-height: 38px; min-width: 40px; } .cabinet_feed_item .more .icon { width: 18px; height: 18px; } .cabinet_feed_item .edit { line-height: 38px; min-width: 40px; } .cabinet_feed_item .edit .icon { width: 18px; height: 18px; } .cabinet_feed_item_header .box { padding: 0 15px; display: flex; flex-direction: column; justify-content: center; flex-grow: 1; } .cabinet_feed_item_header .col:first-child .box:not([class*=col]) { min-width: 50%; } } @media (min-width: 992px) { .cabinet_feed_item .price { padding-top: 0; } .cabinet_feed_item_extra .col { min-width: 33.333%; } .cabinet_feed .col-custom-1 { padding-left: 70px; } } @media (min-width: 1200px) { .cabinet_feed h4 { font-size: 18px; } .cabinet_feed_item_header { padding: 30px 30px 30px 30px; } .cabinet_feed_item .price { font-size: 18px; } .cabinet_feed_item .more { font-size: 18px; line-height: 30px; padding: 5px 40px 5px 10px; border: none; } .cabinet_feed_item .more .icon { left: auto; right: 0; transform: translateY(-50%); } .cabinet_feed .content-expanded .more .icon { transform: rotate(-180deg) translateY(50%); } .cabinet_feed_item .edit { font-size: 18px; line-height: 30px; padding: 5px 40px 5px 10px; border: none; } .cabinet_feed_item .edit .icon { left: auto; right: 0; transform: translateY(-50%) rotate(-90deg); } .cabinet_feed_item_extra_inner { padding: 30px 30px 0 40px; } .cabinet_feed_item_extra .data { margin-bottom: 40px; } .cabinet_feed_item_extra .data_label { font-size: 14px; } .cabinet_feed_item_extra .data_value { font-size: 18px; } .cabinet_feed .col-custom-1 { padding-left: 115px; } } @media (min-width: 1440px) { .cabinet_feed_item_header .col:first-child .box:not([class*=col]) { min-width: 33.333%; } .cabinet_feed_item_extra .col { min-width: 25%; } } /*************/ /* Affiliate */ /*************/ .affiliate_header { margin-bottom: 20px; } /* Filter trigger */ .affiliate_header .filter_trigger { background: var(--gray-300); border-radius: 30px; font-size: 14px; line-height: 22px; padding: 11px; color: var(--white); text-transform: uppercase; font-weight: 700; min-width: 200px; width: 100%; cursor: pointer; } .affiliate_header .filter_trigger .count { border-radius: 100%; background-color: var(--green); color: var(--gray-300); font-size: 12px; line-height: 22px; padding: 0 5px; min-width: 22px; text-align: center; margin-right: 10px; } .affiliate_header .filter_trigger .icon { width: 16px; height: 16px; stroke: var(--gray-100); stroke-width: 2px; transform: rotate(-90deg); margin-left: auto; } .affiliate_header .filter_trigger .label { position: relative; top: 2px; } /* Reset */ .affiliate_header .reset { color: var(--gray-100); font-size: 12px; letter-spacing: 0; padding: 5px; margin-right: -5px; cursor: pointer; } .affiliate_header .reset .icon { stroke: var(--gray-100); stroke-width: 2px; width: 20px; height: 20px; padding: 5px; border-radius: 100%; background-color: var(--gray-300); margin-left: 10px; } .affiliate_header .reset:hover .icon { background-color: var(--black-300); } /* Search */ .affiliate_header .search { margin-bottom: 10px; } /* Table */ .affiliate_table_wrapper { overflow: auto; } .affiliate_table_header { font-size: 16px; font-weight: 700; color: var(--gray-100); background: var(--black-200); border-radius: 10px 10px 0px 0px; } .affiliate_table_header .row { margin: 0; } .affiliate_table_header .col { padding: 5px; text-align: center; font-size: 14px; } .affiliate_table_header .col:first-child { border-radius: 10px 0 0 0; } .affiliate_table_header .col:last-child { border-radius: 0 10px 0 0; } .affiliate_table_header .sort_trigger { cursor: pointer; white-space: nowrap; } .affiliate_table_header .sort_trigger:before { content: ""; border: 4px solid transparent; border-top: 8px solid var(--green); vertical-align: top; position: relative; top: 6px; margin-right: 5px; display: none; } .affiliate_table_header .sort_trigger_invert:before { border-top-width: 4px; border-top-color: transparent; border-bottom: 8px solid var(--green); top: 2px; } .affiliate_table_header .sort_trigger.active { color: var(--green); } .affiliate_table_header .sort_trigger.active:before { display: inline-block; } .affiliate_table { font-size: 12px; color: var(--white); background: rgba(var(--white-rgb), 0.05); border-radius: 5px; overflow: hidden; } .affiliate_table .row { margin: 0; padding: 0 15px; } .affiliate_table .row > div { padding: 15px 5px; } .affiliate_table .flag .icon { width: 20px; height: 20px; margin-right: 5px; margin-top: -3px; } .affiliate_table .row > .separator { min-width: 100%; padding: 0 0 5px; } .affiliate_table .row > .separator:before { content: ""; position: absolute; left: -15px; right: -10px; top: 0; height: 1px; background: rgba(var(--gray-300-rgb), 0.5); } .affiliate_table .col_label { font-size: 12px; line-height: 1; letter-spacing: 0.05em; color: var(--gray-100); margin-bottom: 5px; } .affiliate_table .col_label, .affiliate_table .col_value { padding: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 400; } .affiliate_table .extra_trigger { flex-grow: 0; padding-right: 0; padding-left: 0; } .affiliate_table .icon_wrapper { position: relative; font-size: 0; height: 26px; padding: 0; min-width: 26px; width: 26px; border: 1px solid var(--gray-300); cursor: pointer; border-radius: 5px; } .affiliate_table .icon_wrapper .icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-90deg); width: 12px; height: 12px; stroke: var(--gray-100); stroke-width: 3; } .affiliate_table .trigger { position: absolute; left: -100vw; top: 0; right: -15px; bottom: 0; } @media (max-width: 991.98px) { .affiliate_table { margin-bottom: 10px; } .affiliate_table .extra { display: none; } .affiliate_table.content-expanded { background: rgba(var(--white-rgb), 0.02); } .affiliate_table.content-expanded .extra { display: block; } .affiliate_table.content-expanded .icon_wrapper .icon { transform: translate(-50%, -50%) rotate(0); stroke: var(--white); } } @media (min-width: 992px) { .affiliate_tab { overflow: auto; } .affiliate_tab_inner { display: table; width: 100%; } .affiliate_tab_inner .row { display: table-row; } .affiliate_tab_inner .row > div { order: 1; display: table-cell; width: auto; padding: 10px; line-height: 20px; border-right: 1px solid rgba(var(--gray-300-rgb), 0.5); border-bottom: 1px solid rgba(var(--gray-300-rgb), 0.5); } .affiliate_tab_inner .cell-active { background: rgba(var(--white-rgb), 0.02); } .affiliate_table_header { display: table-header-group !important; } .affiliate_table_header .col:last-child { border-right: none; } .affiliate_table { background: var(--black-300); border-radius: 0; display: table-row-group; } .affiliate_table .row > div:first-child { border-left: 1px solid rgba(var(--gray-300-rgb), 0.5); } .affiliate_table:last-child { border-radius: 0 0 10px 10px; } .affiliate_table:last-child .first { border-radius: 0 0 0 10px; } .affiliate_table:last-child .last { border-radius: 0 0 10px 0; } .affiliate_table .col_label { display: none; } .affiliate_table .flag .icon { margin-top: 0; } } @media (min-width: 1200px) { .affiliate_tab_inner .row > div { padding: 15px; } .affiliate_table_header .sort_trigger:before { border-width: 6px; border-top-width: 12px; top: 3px; } .affiliate_table_header .sort_trigger_invert:before { border-top-width: 6px; border-bottom-width: 12px; top: -3px; } } /* Grid */ .affiliate_grid .card { position: relative; background: var(--black-300); border-radius: 10px; padding: 20px; transition: all 0.25s; margin-bottom: 30px; border: 1px solid transparent; letter-spacing: 0; } .affiliate_grid .card.card-demo-invest { border-color: rgba(226, 226, 226, 0.64); background: rgba(226, 226, 226, 0.04); } .affiliate_grid .card.card-real-invest { border-color: rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.04); } .affiliate_grid .card_header { border-bottom: 0.5px solid var(--gray-300); padding-bottom: 10px; margin-bottom: 20px; } .affiliate_grid .card_header_inner { flex: 0 1 auto; min-width: 0; padding-right: 15px; } .affiliate_grid .card_data { position: absolute; left: 0; right: 0; top: 0; padding: 0 20px; } .affiliate_grid .card_data .title { font-size: 12px; } .affiliate_grid .card_data .data_small .label { font-size: 10px; } .affiliate_grid .card_data .data_small .value { font-size: 14px; } .affiliate_grid .card_data .label { opacity: 0.5; margin-right: 10px; } .affiliate_grid .card_body { margin: 0 -20px; height: 140px; position: relative; } .affiliate_grid .card_text { font-size: 12px; text-transform: uppercase; font-weight: 700; top: 20px; opacity: 0; background: rgba(var(--black-500-rgb), 0.6); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); transition: all 0.25s; } .affiliate_grid .card_footer .row { margin: 0 -5px; } .affiliate_grid .card_footer .row > div { padding-left: 5px; padding-right: 5px; } .affiliate_grid .card_footer .data { background: rgba(var(--black-200-rgb), 0.5); border-radius: 5px; padding: 20px 10px; text-align: center; } .affiliate_grid .card_footer .value { margin-bottom: 5px; } .affiliate_grid .data { margin: 0 0 5px; } .affiliate_grid .image { width: 50px; min-width: 50px; height: 50px; border-radius: 5px; margin-right: 15px; } .affiliate_grid .name { font-size: 14px; margin-bottom: 5px; font-weight: 700; color: var(--white); } .affiliate_grid .country { color: var(--gray-100); font-size: 11px; } .affiliate_grid .country .icon { margin-right: 5px; width: 20px; height: 20px; } .affiliate_grid .label { font-size: 12px; font-weight: 400; } .affiliate_grid .value { font-size: 14px; font-weight: 700; } .affiliate_grid .value small { font-size: 10px; } .affiliate_grid .card_label { position: absolute; right: 20px; top: 0; border-radius: 0px 0 10px 10px; background: rgba(var(--green-rgb), 0.2); } .affiliate_grid .card_label .icon { width: 30px; height: 30px; fill: var(--green); background: rgba(var(--green-rgb), 0.2); border-radius: 0px 0px 10px 10px; padding: 7px; } .affiliate_grid .card_label_text { padding: 10px; font-size: 10px; line-height: 1; display: none; } .affiliate_grid .link { font-size: 0; } .affiliate_grid .card:hover { background: var(--black-500); } .affiliate_grid .card:hover .card_text { opacity: 1; } @media (min-width: 1200px) { .affiliate_grid .card_footer .row { margin: 0 -10px; } .affiliate_grid .card_footer .row > div { padding-left: 10px; padding-right: 10px; } } @media (min-width: 1440px) { .affiliate_grid .card_label_text { display: block; } .affiliate_grid .card_label .icon { border-radius: 0px 0px 10px 0; } } @media (min-width: 1600px) { .affiliate_grid .value { font-size: 18px; } .affiliate_grid .col-lg-6 { max-width: 33.333%; } } /*******************/ /* Cabinet buttons */ /*******************/ .cabinet_buttons .btn { margin-bottom: 15px; } /*****************/ /* Trader detail */ /*****************/ .trader_detail { background: var(--black-300); border-radius: 10px 10px 0px 0px; padding: 20px; letter-spacing: 0; } @media (min-width: 1200px) { .trader_detail { padding: 40px 40px 20px; } } .trader_detail .container > .row { margin-left: -20px; margin-right: -20px; } .trader_detail .container > .row > div { padding-left: 20px; padding-right: 20px; margin-bottom: 20px; } .trader_detail .box_1 { height: 100%; } .trader_detail .box_1 .chart { min-height: 200px; position: relative; margin-bottom: 20px; flex-grow: 1; } .trader_detail .box_1 .data { background: rgba(var(--black-200-rgb), 0.5); border-radius: 5px; padding: 22px; margin-bottom: 0; flex: 1 0 auto; min-width: 0; justify-content: center; } .trader_detail .box_1 .data + .data { margin-left: 20px; } .trader_detail .box_1 .label { font-size: 12px; color: var(--gray-100); margin-right: 10px; margin-bottom: 5px; } .trader_detail .box_1 .value { font-size: 14px; font-weight: 700; color: var(--white); } @media (min-width: 768px) { .trader_detail .box_1 .label { margin-bottom: 0; } } .trader_detail .box_3 .data { display: flex; justify-content: space-between; flex-wrap: wrap; font-size: 14px; margin-bottom: 20px; } .trader_detail .box_3 .data:last-child { margin-bottom: 0; } .trader_detail .box_3 .bar { background: var(--black-200); border-radius: 50px; position: relative; width: 100%; height: 10px; border-radius: 10px; margin-top: 10px; } .trader_detail .box_3 .bar .inner { position: absolute; left: 3px; top: 3px; bottom: 3px; background: var(--green); } .trader_detail_tabs_nav { position: relative; overflow: hidden; background: var(--black-300); } .trader_detail_tabs_item { border-radius: 10px 10px 0px 0px; padding: 20px 30px; font-size: 14px; line-height: 20px; } .trader_detail_tabs_item.active, .trader_detail_tabs_item:hover { background: var(--black-500); cursor: pointer; } .trader_detail_tabs_container { position: relative; overflow: hidden; } .trader_detail_tab { font-size: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform: translate(0, 20%); opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; } .trader_detail_tab.active { position: static; transform: translate(0); opacity: 1; visibility: visible; } .trader_detail_tabs_nav .flickity-viewport { margin: 0 20px; overflow: visible; } .trader_detail_tab { padding: 20px 0; background-color: var(--black-500); } .trader_detail_tab .chart { margin-bottom: 40px; } .trader_detail_table_wrapper { overflow: auto; margin-bottom: 40px; } .trader_detail_table { text-align: center; font-size: 14px; display: table; width: 100%; color: var(--gray-100); } .trader_detail_table .cell { display: table-cell; white-space: nowrap; } .trader_detail_table_header .cell, .trader_detail_table_row .cell, .trader_detail_table_total .cell { padding: 14px 20px; line-height: 20px; } .trader_detail_table_header .cell, .trader_detail_table_row .cell { border-bottom: 1px solid rgba(var(--gray-300-rgb), 0.5); } .trader_detail_table_row .cell { background: var(--black-300); } .trader_detail_table_header .cell { border-top: 1px solid rgba(var(--gray-300-rgb), 0.5); background: var(--black-200); font-weight: 700; } .trader_detail_table_header .cell:first-child { border-radius: 10px 0 0 0; } .trader_detail_table_header .cell:last-child { border-radius: 0 10px 0 0; } .trader_detail_table_header .cell:first-child, .trader_detail_table_header .cell:last-child, .trader_detail_table_row .cell:first-child, .trader_detail_table_row .cell:last-child { border-left: 1px solid rgba(var(--gray-300-rgb), 0.5); border-right: 1px solid rgba(var(--gray-300-rgb), 0.5); } .trader_detail_table_row, .trader_detail_table_total { display: table-row; } .trader_detail_table_header { display: table-header-group; } .trader_detail_table_row.last .cell:first-child { border-radius: 0 0 0 10px; } .trader_detail_table_total { background: transparent; } .trader_detail_table_total .cell { border: none; background: transparent; } .trader_detail_table_total .cell:last-child { background: rgba(var(--green-rgb), 0.05); border-radius: 0 0 10px 10px; } .trader_detail_tabs .content { font-size: 16px; } .trader_detail_tabs .content p, .trader_detail_tabs .content ul, .trader_detail_tabs .content ol { margin-bottom: 1.5em; } .trader_detail_tabs .content ul, .trader_detail_tabs .content ol { margin-left: 30px; } .trader_detail_tabs .content ul { list-style: disc; } .trader_detail_tabs .content ol { list-style: decimal; } .trader_detail_tabs .content h2, .trader_detail_tabs .content h3, .trader_detail_tabs .content h4, .trader_detail_tabs .content h5, .trader_detail_tabs .content h6 { margin-bottom: 1em; } @media (min-width: 1200px) { .trader_detail_tabs_nav .flickity-viewport { margin-left: 40px; margin-right: 40px; } .trader_detail_tab { padding: 40px; } .trader_detail_tabs .content { font-size: 18px; } } .data_table { background: var(--black-400); border-radius: 10px; padding: 20px; font-size: 14px; line-height: 1.4; margin-bottom: 20px; } .data_table_row { margin-bottom: 20px; } .data_table_row:last-child { margin-bottom: 0; } .data_table .data { display: flex; justify-content: space-between; margin-bottom: 0; } .data_table .label { color: var(--gray-100); margin-right: 15px; } @media (min-width: 1200px) { .data_table { padding: 40px; } } .trader_detail_statistic { padding-top: 30px; font-size: 12px; color: var(--gray-200); } .trader_detail_tabs_heading { color: var(--white); font-weight: 700; font-size: 18px; text-align: center; margin-bottom: 30px; } .trader_detail_statistic .data { display: flex; align-items: center; padding: 5px 40px; margin: 0 -40px; } .trader_detail_statistic .data:hover { background: var(--black-300); } .trader_detail_statistic .trader_detail_statistic_heading:hover { background: transparent; cursor: default; } .trader_detail_statistic_heading .label { padding: 5px; } .trader_detail_statistic_heading > .col_1 .label { padding-left: 0; } .trader_detail_statistic .label { font-size: 14px; color: var(--gray-100); } .trader_detail_statistic .line { padding: 5px; border-radius: 20px; display: flex; width: 100%; } .trader_detail_statistic .col_1 { flex: 1 1 120px; min-width: 120px; } .trader_detail_statistic .col_2 { flex: 1 1 25%; min-width: 0; margin-left: 5px; margin-right: 5px; } .trader_detail_statistic .col_3 { flex: 1 1 25%; min-width: 0; margin-right: 5px; margin-left: 5px; } .trader_detail_statistic .col_4 { flex: 1 1 25%; min-width: 0; margin-left: 5px; } .trader_detail_statistic .line_gray .line_inner { color: var(--gray); } .trader_detail_statistic .line_green .line_inner { color: var(--green); } .trader_detail_statistic .line_red .line_inner { color: var(--red); } .trader_detail_statistic .value { font-size: 12px; font-weight: 700; line-height: 15px; } @media (min-width: 768px) { .trader_detail_statistic .col_1 { flex: 1 1 180px; min-width: 180px; } } @media (min-width: 992px) { .trader_detail_statistic_heading > div { padding: 0 5px 10px; } .trader_detail_statistic_heading > .col_1 { padding-left: 0; } .trader_detail_statistic_heading .label { padding: 0; } .trader_detail_statistic .data strong { padding: 0; } .trader_detail_statistic .line_inner { height: 15px; border-radius: 20px; width: 100%; min-width: 15px; position: relative; } .trader_detail_statistic .line_gray .line_inner { background-color: var(--gray-100); } .trader_detail_statistic .line_green .line_inner { background-color: var(--green); } .trader_detail_statistic .line_red .line_inner { background-color: var(--red); } .trader_detail_statistic .line { background: var(--black-200); } .trader_detail_statistic .line_2 { justify-content: flex-end; } .trader_detail_statistic .value { position: absolute; top: 0; bottom: 0; } .trader_detail_statistic .col_2 .value { right: 100%; margin-right: 15px; } .trader_detail_statistic .col_3 .value { right: 100%; margin-right: 10px; } .trader_detail_statistic .col_4 .value { left: 100%; margin-left: 10px; } .trader_detail_statistic .col_3 .value, .trader_detail_statistic .col_4 .value { opacity: 0; transition: all 0.25s; } .trader_detail_statistic .data:hover .col_3 .value, .trader_detail_statistic .data:hover .col_4 .value { opacity: 1; } .trader_detail_statistic .col_1 { flex: 1 1 180px; min-width: 180px; } .trader_detail_statistic .col_2 { flex: 1 1 25%; margin-left: 20px; margin-right: 30px; } .trader_detail_statistic .col_3 { flex: 1 1 25%; margin-right: 5px; margin-left: 30px; } .trader_detail_statistic .col_4 { flex: 1 1 25%; margin-left: 5px; } } .invest-marker { display: flex; flex-direction: column; gap: 8px; } .invest-marker .invest { display: flex; justify-content: space-between; align-items: center; border-radius: 12px; } .invest-marker .invest .label { padding: 2px 8px; } .invest-marker .invest .label p { font-size: 12px; font-weight: 400; line-height: 16px; letter-spacing: -0.24px; white-space: nowrap; } .invest-marker .invest .logo { display: flex; align-items: center; } .invest-marker .real-invest { width: 100%; background: rgba(54, 192, 6, 0.08); } .invest-marker .real-invest .label p { color: #36C006; } .invest-marker .demo-invest { width: 100%; background: rgba(226, 226, 226, 0.08); } .invest-marker .demo-invest .label p { color: #E2E2E2; } .card_header_invest { position: absolute; top: 8px; right: 8px; } .invest-tab-switch { width: 100%; border-radius: 8px; border: 1px solid rgba(226, 226, 226, 0.12); background-color: transparent; display: flex; padding: 2px; } .invest-tab-switch_item { flex: 1 1 50%; border-radius: 6px; padding: 8px 12px; transition: all 0.3s ease; color: #9D9D9D; text-align: center; font-size: 16px; font-weight: 500; line-height: 20px; letter-spacing: -0.32px; text-transform: capitalize; } .invest-tab-switch_item.active { background: rgba(226, 226, 226, 0.12); color: var(--e2); } /***************/ /* PropTrading */ /***************/ .prop_trading p { margin: 0; } .prop_trading .cabinet_header .heading .title { color: var(--e2); font-size: 48px; font-weight: 700; } .prop_trading .cabinet_header .heading .subtitle { margin-top: 16px; color: var(--a1); font-size: 24px; font-weight: 400; line-height: 32px; } .prop_trading .start_challenge { margin-top: 32px; container: prop-challenge/inline-size; } .prop_trading .start_challenge .start_amount { width: 100%; display: flex; padding: 24px; align-items: center; gap: 24px; align-self: stretch; border-radius: 12px; background: var(--black-300); } .prop_trading .start_challenge .start_amount .amount { display: flex; width: 30%; padding: 12px 24px; align-items: center; gap: 16px; border-radius: 6px; background: var(--black-100); white-space: nowrap; flex-wrap: wrap; } .prop_trading .start_challenge .start_amount .amount .title p { color: var(--e2); font-size: 16px; font-weight: 400; line-height: 18px; } .prop_trading .start_challenge .start_amount .amount .sum p { color: #36C006; text-align: right; font-size: 24px; font-weight: 700; line-height: 32px; } @media (max-width: 1199.98px) { .prop_trading .start_challenge .start_amount .amount { width: 100%; background: none; justify-content: space-between; padding: 0; } } .prop_trading .start_challenge .start_amount .slider-container { width: 70%; } .prop_trading .start_challenge .start_amount .slider-container .slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; height: 0; padding: 0; border: 1px solid #000; background: var(--black); cursor: pointer; } .prop_trading .start_challenge .start_amount .slider-container .slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 16px; background: url("../images/svg/slider.svg") center no-repeat; cursor: pointer; border: 2px solid #36C006; border-radius: 2px; box-shadow: -600px 0 0 600px #36C006; } .prop_trading .start_challenge .start_amount .slider-container .slider::-moz-range-thumb { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 24px; height: 24px; background: url("../images/svg/slider.svg") center no-repeat; cursor: pointer; border: 2px solid #36C006; border-radius: 2px; box-shadow: -600px 0 0 600px #36C006; } .prop_trading .start_challenge .start_amount .slider-container .slider::-webkit-slider-runnable-track { background: transparent; cursor: pointer; overflow: hidden; border-radius: 8px; height: 16px; } @media (max-width: 1199.98px) { .prop_trading .start_challenge .start_amount .slider-container { width: 100%; } } @media (max-width: 1199.98px) { .prop_trading .start_challenge .start_amount { flex-wrap: wrap; } } .prop_trading .start_challenge .steps { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; margin: 32px 0; } @container prop-challenge (min-width: 1023px) { .prop_trading .start_challenge .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .prop_trading .start_challenge .steps .step { min-width: 0; width: 100%; align-self: stretch; } .prop_trading .start_challenge .steps .step .title { color: var(--e2); font-size: 32px; font-weight: 600; line-height: 48px; white-space: normal; } .prop_trading .start_challenge .steps .step .subtitle { margin-top: 12px; color: var(--a1); font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.32px; } .prop_trading .start_challenge .steps .step .card { margin-top: 24px; display: flex; padding: 24px; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; border-radius: 12px; border: 6px dashed var(--black-100); background: var(--black-100); } .prop_trading .start_challenge .steps .step .card .info { width: 100%; } .prop_trading .start_challenge .steps .step .card .info .point { display: flex; padding: 8px; justify-content: space-between; align-items: center; align-self: stretch; border-radius: 12px; background: var(--alabaster-solid); margin-top: 8px; } .prop_trading .start_challenge .steps .step .card .info .point .name { display: flex; padding: 6px 12px; align-items: center; gap: 12px; } .prop_trading .start_challenge .steps .step .card .info .point .name p { color: var(--a1); font-size: 14px; font-weight: 400; letter-spacing: 0.28px; } .prop_trading .start_challenge .steps .step .card .info .point .value { display: flex; padding: 12px 24px; justify-content: flex-end; align-items: center; gap: 12px; border-radius: 8px; background: var(--black-100); } .prop_trading .start_challenge .steps .step .card .info .point .value p { color: var(--e2); font-size: 16px; font-weight: 600; } .prop_trading .start_challenge .steps .step .card .info .point:first-child { margin: 0; } .prop_trading .start_challenge .steps .step .description p { color: var(--a1); font-size: 16px; font-weight: 400; line-height: 20px; letter-spacing: 0.32px; } .prop_trading .start_challenge .steps .step .benefits ul li { position: relative; padding-left: 1em; margin-bottom: 0.5em; color: var(--e2); font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: 0.32px; } .prop_trading .start_challenge .steps .step .benefits ul li:before { content: ""; position: absolute; left: 0; top: 0.5em; width: 0.25em; height: 0.25em; border-radius: 50%; background-color: currentColor; } .prop_trading .card-header { display: flex; padding: 24px; align-items: center; gap: 16px; align-self: stretch; border-radius: 12px 12px 0 0; background: var(--black-200); } .prop_trading .card-header p { color: var(--e2); font-size: 20px; font-weight: 700; line-height: 24px; text-transform: uppercase; } .prop_trading .card-content { padding: 32px; gap: 32px; background: var(--black-200); } .prop_trading .card-content .step-info-mobile { display: none; margin-bottom: 16px; } @media (max-width: 991.98px) { .prop_trading .card-content .step-info-mobile { display: block; } .prop_trading .card-content .step-info-mobile .tp_challenge_steps > div { border: 2px dashed var(--gray-100); color: var(--gray-100); } .prop_trading .card-content .step-info-mobile .tp_challenge_steps > div.is-active { background-color: var(--green); color: var(--black-100); border-color: var(--black-100); } .prop_trading .card-content .step-info-mobile .tp_challenge_steps > div.is-active ~ div { border-color: var(--green); color: var(--green); } } .prop_trading .card-content .title { color: var(--e2); font-size: 20px; font-weight: 600; } @media (max-width: 991.98px) { .prop_trading .card-content .title { text-align: center; } } .prop_trading .card-content .objectives { margin-top: 16px; display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; } .prop_trading .card-content .objectives .table { width: 48%; display: flex; overflow: hidden; flex-direction: column; border-radius: 12px; background: var(--black-100); } .prop_trading .card-content .objectives .table-row { display: flex; justify-content: space-between; align-items: center; padding: 12px; color: var(--e2); font-size: 14px; font-weight: 400; border-bottom: 1px solid var(--black-200); } .prop_trading .card-content .objectives .table-row:first-child { background: var(--alabaster-solid); color: #9D9D9D; font-size: 12px; font-weight: 600; } .prop_trading .card-content .objectives .table-row:first-child .result .icon { stroke: #9D9D9D; } .prop_trading .card-content .objectives .table-row:last-child { border-bottom: none; } .prop_trading .card-content .objectives .table-row .label { width: 40%; padding: 6px 12px; } .prop_trading .card-content .objectives .table-row .value { width: 40%; padding: 6px 12px; text-align: right; } .prop_trading .card-content .objectives .table-row .result { width: 20%; text-align: right; } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .table { width: 100%; } } .prop_trading .card-content .objectives .funds { width: 48%; } .prop_trading .card-content .objectives .funds .step-info .tp_challenge_steps > div { border: 2px dashed var(--gray-100); color: var(--gray-100); } .prop_trading .card-content .objectives .funds .step-info .tp_challenge_steps > div.is-active { background-color: var(--green); color: var(--black-100); border-color: var(--black-100); } .prop_trading .card-content .objectives .funds .step-info .tp_challenge_steps > div.is-active ~ div { border-color: var(--green); color: var(--green); } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .step-info { display: none; } } .prop_trading .card-content .objectives .funds .funds-info { margin-top: 40px; display: flex; align-items: center; } .prop_trading .card-content .objectives .funds .funds-info .data { display: flex; } .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data { display: flex; min-width: 150px; padding: 82.5px 16px; flex-direction: column; justify-content: center; align-items: flex-start; flex: 1 0 0; align-self: stretch; border-radius: 16px; background: var(--black-100); margin-top: 0; white-space: nowrap; } .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data .label { color: #9D9D9D; font-size: 10px; font-weight: 400; text-transform: uppercase; } .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data .value { font-size: 24px; font-weight: 500; } .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data:first-child { margin-right: 8px; } @media (max-width: 1199.98px) { .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data:first-child { margin-right: 0; margin-bottom: 10px; } } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data { padding: 0; background: none; } .prop_trading .card-content .objectives .funds .funds-info .data .tp_account_status_chart_data:first-child { margin-right: 0; margin-bottom: 24px; } } @media (max-width: 1199.98px) { .prop_trading .card-content .objectives .funds .funds-info .data { display: block; padding: 0; } } .prop_trading .card-content .objectives .funds .funds-info .chart { padding: 0; } .prop_trading .card-content .objectives .funds .funds-info .chart #chart-funds { width: 180px; height: 180px; } .prop_trading .card-content .objectives .funds .funds-info .chart #chart-funds .highcharts-background { fill: none !important; } .prop_trading .card-content .objectives .funds .funds-info .chart #chart-funds .highcharts-credits { display: none !important; } .prop_trading .card-content .objectives .funds .funds-info .chart #chart-funds .chart-label { fill: var(--gray-100); text-align: center; font-family: Roboto, sans-serif; font-size: 12px; font-weight: 400; text-transform: uppercase; margin-bottom: 2px; } .prop_trading .card-content .objectives .funds .funds-info .chart #chart-funds .chart-value { fill: var(--e2); text-align: center; font-family: Roboto, sans-serif; font-size: 18px; font-weight: 500; } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .funds-info { flex-wrap: wrap; } } .prop_trading .card-content .objectives .funds .refresh-info { margin-top: 40px; display: flex; padding: 24px; flex-direction: column; justify-content: center; align-items: center; gap: 24px; flex: 1 0 0; align-self: stretch; border-radius: 12px; border: 6px dashed var(--black-100); background: var(--black-100); } .prop_trading .card-content .objectives .funds .refresh-info .title { display: flex; align-items: center; } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .refresh-info .title .icon { height: 64px; width: 64px; } } .prop_trading .card-content .objectives .funds .refresh-info .title p { color: var(--e2); text-align: center; font-size: 32px; font-weight: 700; } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .refresh-info .title p { width: 100%; font-size: 20px; font-weight: 600; } } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .refresh-info .title { flex-wrap: wrap; justify-content: center; } } .prop_trading .card-content .objectives .funds .refresh-info .description { color: var(--a1); text-align: center; font-size: 20px; font-weight: 400; line-height: 25px; } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds .refresh-info .description { font-size: 14px; font-weight: 400; line-height: 16px; letter-spacing: 0.28px; } } @media (max-width: 991.98px) { .prop_trading .card-content .objectives .funds { width: 100%; } } .prop_trading .card-content .refresh-button { margin-top: 32px; display: flex; padding: 20px 24px; justify-content: center; align-items: center; gap: 12px; align-self: stretch; text-wrap: unset; } .prop_trading .card-content .refresh-button .icon { margin-right: 10px; } @media (max-width: 991.98px) { .prop_trading .card-content .refresh-button .icon { margin-right: 0 !important; } } .prop_trading .card-content .trade { margin-top: 32px; } .prop_trading .card-content .trade-header { display: flex; align-items: center; padding: 0 10px; } .prop_trading .card-content .trade-header .icon { cursor: pointer; } .prop_trading .card-content .trade-header .title { padding-left: 10px; color: var(--e2); font-size: 18px; font-weight: 600; cursor: pointer; } .prop_trading .card-content .trade-header .btn { cursor: pointer; } @media (max-width: 991.98px) { .prop_trading .card-content .trade-header { padding: 0; } } .prop_trading .card-content .trade-content .trade-field { display: flex; padding: 6px 0; justify-content: space-between; align-items: center; align-self: stretch; border-radius: 12px; background: var(--black-100); } .prop_trading .card-content .trade-content .trade-field .title { text-align: left; padding: 12px 20px; color: var(--gray-100); font-size: 14px; font-weight: 700; } .prop_trading .card-content .trade-content .trade-field .value { padding: 12px 20px; color: var(--gray); font-size: 14px; font-weight: 400; white-space: nowrap; border: none; cursor: default; } .prop_trading .card-content .trade-content .trade-field:nth-child(2) { margin: 6px 0; } .prop_trading .card-content .trade-content .trade-actions { display: flex; margin-top: 12px; padding: 6px 0; } .prop_trading .card-content .trade-content .trade-actions a { color: #36C006; font-size: 16px; font-weight: 400; text-decoration-line: underline; text-decoration-style: solid; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } .prop_trading .card-content .trade-content .trade-actions p { margin: 0 32px; color: var(--gray-100); font-size: 14px; font-weight: 700; } @media (max-width: 991.98px) { .prop_trading .card-content .trade-content .trade-actions { display: block; } .prop_trading .card-content .trade-content .trade-actions p { visibility: hidden; } } .prop_trading .card-footer { display: flex; padding: 16px 32px; flex-direction: column; align-items: flex-start; gap: 16px; border-radius: 0 0 12px 12px; background: var(--alabaster-solid); } .prop_trading .card-footer .title { display: flex; align-items: center; color: var(--e2); font-size: 16px; font-weight: 700; line-height: 90%; font-variant: all-small-caps; } .prop_trading .card-footer .title .icon { margin-right: 16px; } .prop_trading .card-footer ul li { position: relative; padding-left: 1em; color: var(--e2); font-size: 12px; font-weight: 400; } .prop_trading .card-footer ul li:before { content: ""; position: absolute; left: 0; top: 0.5em; width: 0.25em; height: 0.25em; border-radius: 50%; background-color: currentColor; } .prop_trading .terms { margin-top: 64px; } .prop_trading .b-07 header { cursor: pointer; } .prop_trading .b-07 .content-wrapper .content { font-size: 14px; letter-spacing: 0.28px; color: var(--a1); } .prop_trading .b-07 .content-wrapper .content ul { margin-top: 12px; margin-bottom: 0; } .prop_trading .b-07 .content-wrapper .content ul li { position: relative; padding-left: 1em; color: var(--e2); } .prop_trading .b-07 .content-wrapper .content ul:first-child { margin-top: 0; } .prop_trading .b-07 .content-wrapper .content .answer ul { margin-top: 0 !important; } .prop_trading .b-07 .content-wrapper .content .answer ul li { color: var(--a1) !important; } /* Tournament cards follow the content width left by the cabinet sidebar. */ .tournament-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 24px; } .tournament-grid .tournament-card-cell { position: relative; min-width: 0; } .tournament-grid .ov_2_card { position: relative; height: 100%; } /***********/ /* Sidebar */ /***********/ .sidebar { background: var(--black-200); border-bottom: 1px solid var(--gray-300); position: relative; } .sidebar .logo { max-width: 100px; display: block; position: relative; z-index: 60; } .sidebar .language { margin-left: 20px; background-color: var(--black-100); border-radius: 6px; } .sidebar .language .icon { width: 20px; height: 20px; margin-right: 0; } .sidebar .language_label { padding: 12px; } .sidebar .language_list { right: auto; left: -10px; text-align: left; } .sidebar .language_list ul { border-radius: 6px; } .sidebar .buttons { font-size: 0; } .sidebar .row { margin: 0 -10px; } .sidebar .row > [class^=col] { padding: 0 10px; } .sidebar .icon_help { width: 20px; height: 20px; fill: var(--black-100); } .sidebar .trigger_icon { background-color: var(--black-100); width: 40px; height: 40px; border-radius: 6px; } .sidebar .trigger_icon picture img { border-radius: 100%; } .sidebar .cabinet_user_menu_trigger { background-color: var(--black-100); min-height: 40px; border-radius: 6px; } .sidebar .cabinet_user_menu_trigger picture { width: 28px; height: 28px; } .sidebar .cabinet_user_menu_trigger picture img { border-radius: 100%; } .sidebar .cabinet_user_menu.dropdownbox-open .cabinet_user_menu_trigger { border-radius: 6px; } .sidebar .cabinet_user_menu_inner { top: -12px; right: -20px; border-radius: 0; min-width: unset; width: 100vw; background-color: var(--black-200); } .sidebar .cabinet_user_menu_inner a { text-decoration: none; color: inherit; } .sidebar .cabinet_user_menu_inner .cabinet_user_menu_trigger picture { display: block; } .sidebar_wrapper { position: relative; } .sidebar_inner { padding: 25px 20px 40px 20px; } .sidebar_header { font-size: 0; padding-top: 42px; } .sidebar_header .data_label { font-size: 12px; color: var(--gray-100); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sidebar_header .data_value { font-size: 24px; font-weight: 400; color: var(--white); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sidebar_header .data_value small { font-size: 0.5625em; color: var(--gray-100); } .sidebar_header .trigger { margin-right: -10px; margin-left: 10px; } .sidebar_header .dropdownbox { margin-left: 10px; } .sidebar_trigger { position: absolute; left: 50%; bottom: 0; background: var(--black-400); width: 75px; height: 20px; transform: translateX(-50%); border-radius: 5px 5px 0 0; cursor: pointer; } .sidebar_trigger .icon { width: 50px; height: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .sidebar_trigger .point { position: absolute; right: 0; top: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--red); box-shadow: 0px 0px 10px rgba(var(--red-rgb), 0.75); transform: translate(50%, -50%); } .sidebar_box { color: var(--gray); border-radius: 10px; position: relative; line-height: 20px; font-size: 12px; margin-bottom: 20px; } .sidebar_box .col > strong { padding: 0; } .sidebar_box .tooltip { position: absolute; right: 10px; bottom: 100%; margin-bottom: 10px; } .sidebar_box .link { text-align: right; } .sidebar_footer { padding: 20px 20px 40px; } .sidebar_footer .data_label { font-size: 16px; color: var(--white); font-weight: 400; margin-bottom: 5px; white-space: nowrap; } .sidebar_footer .data_label .icon { width: 15px; height: 15px; position: relative; top: 2px; } .sidebar_footer .data_value { color: var(--gray-100); font-weight: 400; font-size: 14px; } .sidebar_footer .link .icon { width: 40px; height: 40px; fill: var(--black-100); } .progress_bar { height: 14px; border-radius: 20px; background: var(--white); position: relative; margin-top: 10px; padding: 2px; background: var(--black-300); margin-left: -2px; margin-right: -2px; } .progress_bar_inner { position: absolute; top: 2px; bottom: 2px; } .progress_bar_inner:before { content: ""; position: absolute; left: 2px; right: 2px; top: 0; bottom: 0; border-radius: 10px; background: var(--green); } .progress_bar_inner.green { left: 0; } .progress_bar_inner.red { right: 0; } .progress_bar_inner.red:before { background: var(--red); } .sidebar_content h4 { color: var(--white); margin-bottom: 25px; font-size: 24px; } .sidebar_list { white-space: nowrap; font-size: 12px; color: var(--white); font-weight: 400; } .sidebar_list .title { text-overflow: ellipsis; overflow: hidden; } .sidebar_list .title small { display: block; font-size: 12px; padding-top: 3px; } .sidebar_list .btn { font-size: 12px; font-weight: 400; border-width: 1px; padding: 9px 15px; min-width: 105px; margin-left: 10px; } .sidebar_list .col_2 { max-width: calc(100% - 28px); } .sidebar_list .circle { width: 8px; height: 8px; background: var(--gray-300); border-radius: 50%; border: 1px solid var(--gray-300); position: relative; } .sidebar_list .circle-green { background-color: var(--green); box-shadow: 0px 0px 10px rgba(var(--green-rgb), 0.3); } .sidebar_list .circle-red { background-color: var(--red); box-shadow: 0px 0px 10px rgba(var(--red-rgb), 0.5); } .sidebar_list .price { padding-left: 10px; } .sidebar_list_header { padding: 10px 0; color: var(--gray); } .sidebar_list_item { padding: 10px 0; } @media (max-width: 767.98px) { .sidebar { top: 0 !important; } .sidebar_header_inner { position: fixed; left: 0; right: 0; top: 0; padding: 12px 20px; z-index: 100; } .sidebar_header .data { width: 50%; float: left; padding-right: 10px; } .sidebar .buttons { width: 50%; float: right; } .sidebar .buttons .col:last-child { display: none; } .sidebar_content { display: none; } .sidebar_footer { display: none; } .sidebar_2 .sidebar_content { display: block; } .sidebar-expanded .sidebar_header .data { float: none; padding-bottom: 25px; } .sidebar-expanded .buttons { width: 100%; float: none; padding-bottom: 50px; } .sidebar-expanded .buttons .col:last-child { display: block; } .sidebar-expanded .sidebar_content { display: block; } .sidebar-expanded .sidebar_footer { display: block; border-top: 1px solid var(--gray-300); } .sidebar-expanded .sidebar_trigger .icon { transform: translate(-50%, -50%) rotate(-180deg); } .s-scrolled .sidebar_header_inner { background: rgba(var(--black-400-rgb), 0.7); } } @media (min-width: 768px) { .sidebar { border-bottom: none; float: left; width: 36%; min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; padding: 15px 0 15px 15px; background: transparent; } .sidebar-sticky { position: fixed; } .sidebar_inner { padding: 4vh 3vw 35px 3vw; background: var(--black-200); border-radius: 12px; } .sidebar .buttons .col:last-child { padding-top: 10px; } .sidebar .logo { max-width: 150px; } .sidebar_header { padding-top: 0; margin-bottom: 60px; } .sidebar_header_inner { margin-bottom: 50px; position: relative; z-index: 100; } .sidebar_header .data { margin-bottom: 50px; } .sidebar_header .data_label { font-size: 14px; } .sidebar_header .data_value { font-size: 32px; } .sidebar_2 .sidebar_header { margin-bottom: 0; } .sidebar_box { margin-bottom: 20px; font-size: 14px; } .sidebar_footer { padding: 30px 3vw 60px 3vw; } .sidebar_header_navigation { transform: translate(-100%, 0); width: 36%; background: var(--black-300); max-width: 450px; padding-top: 110px; } .sidebar_header_navigation li a { font-size: 14px; } } @media (min-width: 992px) { .sidebar .buttons .col { min-width: 48%; } .sidebar_header_navigation li a { font-size: 16px; } } @media (min-width: 1200px) { .sidebar_2 .sidebar_header_inner { margin-bottom: 50px; } .sidebar_header .data_value { font-size: 48px; } .sidebar .buttons .col:last-child { padding-top: 20px; } .sidebar_footer { left: 5vw; right: 4vw; } .sidebar_list { font-size: 14px; } } @media (min-width: 1240px) { .sidebar { width: 450px; } } @media (min-width: 1440px) { .sidebar_box { font-size: 18px; } .sidebar_list { font-size: 16px; } .sidebar_list .btn { font-size: 14px; padding: 10px 10px; min-width: 130px; } .sidebar_list .price { padding-left: 20px; } } @media (min-width: 1600px) { .sidebar_inner { padding: 30px; } .sidebar_header .data_value { font-size: 54px; } .sidebar .buttons .col { min-width: 41.335%; } .sidebar_footer { padding-left: 50px; padding-right: 50px; } } .sidebar_user_card { letter-spacing: 0; margin-bottom: 30px; } .sidebar_user_card .inner { flex: 1 1 auto; min-width: 0; display: flex; justify-content: space-between; flex-wrap: wrap; flex-direction: column; } .sidebar_user_card .image { background-color: var(--gray-200); border-radius: 5px; flex: 0 0 50px; margin-right: 20px; } .sidebar_user_card .image:before { content: ""; display: block; padding-bottom: 100%; } .sidebar_user_card .title { font-size: 14px; color: var(--white); font-weight: 700; padding-bottom: 10px; } .sidebar_user_card .name { font-size: 12px; color: var(--gray); } .sidebar_user_card .country { font-size: 11px; color: var(--gray-100); } .sidebar_user_card .country .icon { margin-right: 5px; } .sidebar_user_card .rating_label { font-size: 12px; padding-top: 5px; text-align: right; margin-bottom: 5px; } .sidebar_user_card .rating .icon { width: 16px; height: 16px; fill: var(--gray-200); } .sidebar_user_card .rating .icon.green { fill: var(--green); } .sidebar_user_card .rating .icon.dark-green { fill: rgba(var(--green-rgb), 0.3); } .sidebar_user_card .social a { display: block; margin-left: 10px; } .sidebar_user_card .social a:hover { opacity: 0.75; } .sidebar_user_card .button { padding-top: 20px; } .sidebar_user_card .footer { font-size: 12px; padding-top: 20px; display: none; } .sidebar_user_card .footer .row { margin: 0 -5px; } .sidebar_user_card .footer .row > div { padding-left: 5px; padding-right: 5px; } .sidebar_user_card .footer .data { background: rgba(var(--black-200-rgb), 0.5); border-radius: 5px; padding: 20px 10px; text-align: center; width: 100%; } .sidebar_user_card .footer .value { margin-bottom: 5px; font-size: 18px; font-weight: 700; } .sidebar_user_card .footer .value small { font-size: 10px; } .sidebar_user_card .footer .data { margin: 0; } .sidebar_user_card .col_1 { flex: 1 1 auto; min-width: 0; } .sidebar-expanded .sidebar_user_card .footer { display: block; } .sidebar_user_back_button { padding-bottom: 40px; } .sidebar_user_back_button .icon { width: 16px; height: 16px; margin-top: 2px; margin-right: 10px; } @media (min-width: 768px) { .sidebar_user_card .footer { display: block; } } @media (min-width: 1200px) { .sidebar_user_card .image { flex: 0 0 80px; } } .sidebar_user_data_box .data { border-bottom: 1px solid var(--black-200); } .sidebar_user_data_box .data:last-child { border-bottom: none; } .sidebar_user_data { margin-top: 0px; margin-bottom: 0px; } .sidebar_user_data .data { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 0; } .sidebar_user_data .data:first-child { padding-top: 0; } .sidebar_user_data .data:last-child { padding-bottom: 0; } .sidebar_user_data .label { font-size: 14px; } .sidebar_user_data .value { font-size: 18px; margin-left: 15px; } .sidebar .form_field_description { margin-bottom: 20px; } .sidebar_block_1 { margin-bottom: 100px; } .sidebar_block_1_header { font-weight: 700; font-size: 16px; border-bottom: 1px solid var(--black-200); padding: 10px 0; margin-bottom: 20px; } .sidebar_block_1_total { font-weight: 700; font-size: 18px; margin-bottom: 40px; } .sidebar_block_1_total small { font-size: 14px; } .sidebar_block_1 .total-info { padding: 16px; align-items: center; align-self: stretch; border-radius: 8px; background: rgba(226, 226, 226, 0.04); } .sidebar_block_1 .card { border-radius: 5px; background: var(--black-100); padding: 1px; margin-bottom: 10px; color: inherit; text-decoration: none; display: block; } .sidebar_block_1 .card_header { font-size: 12px; font-weight: 400; line-height: 16px; color: var(--gray-100); padding: 6px 16px; } .sidebar_block_1 .card_body { padding: 13px 15px; } .sidebar_block_1 .name { font-size: 12px; } .sidebar_block_1 .country { font-size: 11px; color: var(--gray-100); } .sidebar_block_1 .country .icon { margin-right: 5px; width: 20px; height: 20px; min-width: 20px; } .sidebar_block_1 .data { font-size: 14px; font-weight: 700; } .sidebar_block_1 .data small { font-size: 12px; } .sidebar_block_1 .col_2 { text-align: center; } .sidebar_block_1 .col_3 { text-align: right; } .sidebar_block_1 .btn { font-size: 12px; } /*********/ /* Login */ /*********/ .login h2 { font-size: 24px; text-align: center; margin-bottom: 30px; } .login a { font-size: 14px; } .login .box { background-color: var(--black-300); padding: 30px 40px 20px; margin: 0 -20px; } .login .social_network { background: var(--black-200); margin: 0 -40px 30px; padding: 50px 30px 40px; text-align: center; } .login .social_network a { color: var(--white); text-decoration: none; font-size: 18px; font-weight: 400; padding: 10px; text-align: center; } .login .social_network a:hover .icon { opacity: 1; } .login .social_network p { margin-bottom: 10px; padding: 0 10px; font-size: 16px; } .login .social_network .icon { opacity: 0.2; margin-bottom: 10px; width: 40px; height: 40px; transition: all 0.3s; } .login .submit { width: 100%; margin-bottom: 50px; } @media (min-width: 576px) { .login .box { margin: 0 auto; max-width: 800px; } } @media (min-width: 768px) { .login .submit { width: auto; max-width: 250px; margin-bottom: 0; margin-right: 50px; flex-grow: 1; } } @media (min-width: 992px) { .login h2 { margin-bottom: 60px; } .login .box { padding: 50px 70px 30px; } .login .social_network { margin: 0 -70px 60px; padding: 50px 60px 40px; text-align: left; } .login .social_network .icon { margin: 0 20px 0 0; } } @media (min-width: 1200px) { .login h2 { margin-bottom: 80px; } .login .box { padding: 80px 100px 70px; } .login .image { width: 120px; height: 120px; } .login .image .icon { width: 62px; height: 62px; } .login .form_row:last-child { padding-top: 65px; } .login .social_network { margin: 0 -100px 80px; padding: 50px 90px 40px; } .login .social_network .icon { width: 60px; height: 60px; } .login .social_network a { font-size: 20px; } } /****************/ /* Registration */ /****************/ .registration .box { padding-top: 50px; } .registration .image { width: 50px; height: 50px; border-radius: 50%; background: var(--black-200); position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); } .registration .image .icon { width: 26px; height: 26px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); fill: var(--gray-100); } @media (min-width: 768px) { .registration { padding-top: 30px; } .registration .box { padding-top: 70px; } .registration .image { width: 80px; height: 80px; } .registration .image .icon { width: 40px; height: 40px; } } @media (min-width: 1200px) { .registration { padding-top: 70px; } .registration .box { padding-top: 100px; } .registration .image { width: 120px; height: 120px; } .registration .image .icon { width: 62px; height: 62px; } } .content_scroll_wrapper { height: 100%; width: 100%; } .content_scroll_wrapper .__view > div { padding-bottom: 1px; } .v-tooltip { font-size: 11px; line-height: 1.2; width: -moz-fit-content; width: fit-content; } .v-tooltip .tooltip-inner { background: var(--black-200); border-radius: 5px; padding: 8px 10px 7px; color: var(--gray); letter-spacing: 0; } .v-tooltip .tooltip-arrow { border-color: var(--black-200); } .tp { padding: 60px 0; letter-spacing: 0; font-weight: 400; overflow: hidden; } .tp_loader { background-color: rgba(var(--black-rgb), 0.65); z-index: 102; } @media (max-width: 767.98px) { .tp { position: fixed; min-height: 0; } } @media (min-width: 768px) { .tp { height: 100vh; min-height: 730px; position: relative; } } /* Checkbox list */ .tp_checkbox_list { background: var(--black-300); border-radius: 5px; } .tp_checkbox_list ul { padding: 8px 0; } .tp_checkbox_list li { white-space: nowrap; } .tp_checkbox_list .radio, .tp_checkbox_list .checkbox { padding: 0; } .tp_checkbox_list .radio [type=radio] + label, .tp_checkbox_list .checkbox [type=checkbox] + label { padding: 7px 55px 7px 15px; display: block; color: var(--gray-200); } .tp_checkbox_list .radio [type=radio] + label:hover, .tp_checkbox_list .checkbox [type=checkbox] + label:hover { background: var(--black-200); } .tp_checkbox_list .radio [type=radio] + label:before { border-color: var(--gray-200); } .tp_checkbox_list .checkbox [type=checkbox] + label:before { border-radius: 3px; border-color: var(--gray-200); } .tp_checkbox_list .radio [type=radio] + label:before, .tp_checkbox_list .radio [type=radio] + label:after, .tp_checkbox_list .checkbox [type=checkbox] + label:before { right: 15px; top: 5px; left: auto; width: 18px; height: 18px; } .tp_checkbox_list .checkbox [type=checkbox] + label:after { right: 16px; top: 6px; left: auto; width: 16px; height: 16px; } .tp_checkbox_list .radio [type=radio]:checked + label:before, .tp_checkbox_list .checkbox [type=checkbox]:checked + label:before { border-color: rgba(var(--green-rgb), 0.3); } .tp_checkbox_list .radio [type=radio]:checked + label, .tp_checkbox_list .checkbox [type=checkbox]:checked + label { color: var(--gray-100); } .tp_checkbox_list .last { border-top: 1px solid var(--gray-200); padding: 14px 15px 15px; margin-bottom: -8px; margin-top: 8px; cursor: pointer; font-size: 12px; color: var(--gray-100); } .tp_checkbox_list .last:hover { color: var(--gray-100); } /* Tabs */ .tp_tab { display: none; } .tp_tab.active { display: flex; } .tp_tab_item { font-size: 12px; font-weight: 700; color: var(--gray-100); text-transform: uppercase; cursor: pointer; position: relative; flex: 1 1 auto; min-width: 0; width: 100%; text-align: center; background: var(--black-300); } .tp_tab_item:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--gray-300); } .tp_tab_item.active { color: var(--green); } .tp_tab_item.active:after { background: var(--green); } /**********/ /* Header */ /**********/ .tp_header { background: var(--black-300); left: 0; padding: 14px 10px; position: fixed; right: 0; top: 0; z-index: 100; } .tp_header > div, .tp_header > a { /*flex:0 1 auto;*/ min-width: 0; } .tp_header .nav-trigger { z-index: 91; } @media (min-width: 768px) { .tp_header { background: var(--black-400); position: absolute; padding-top: 10px; padding-bottom: 10px; } } @media (min-width: 1200px) { .tp_header .nav-trigger { width: 40px; height: 40px; padding: 12px 9px; } .tp_header .nav-trigger__line-2 { width: 18px; } } .tp_header_logo { max-width: 75px; display: block; flex: 0 1 140px; flex-shrink: 0; position: relative; } @media (min-width: 768px) { .tp_header_logo { z-index: 91; } } @media (min-width: 768px) { .tp_header_logo { max-width: 100px; } } @media (min-width: 1200px) { .tp_header_logo { max-width: 140px; } } .tp_header .tp_search_form { position: relative; margin-left: 15px; flex: 1 0 auto; max-width: 130px; } .tp_header .tp_search_form_inner { position: relative; z-index: 10; border: 1px solid var(--gray-300); border-radius: 50px; } .tp_header .tp_search_form input { font-size: 14px; line-height: 20px; padding-left: 20px; } .tp_header .tp_search_form button .icon { fill: var(--gray-100); } .tp_header .tp_search_results { position: absolute; left: 0; right: 0; top: 0; display: none; padding-top: 40px; background: var(--gray-300); border-radius: 20px 20px 5px 5px; } .tp_header .tp_search_results ul { padding: 13px 0; } .tp_header .tp_search_results li { font-size: 14px; color: var(--gray-100); line-height: 16px; padding: 7px 20px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; } .tp_header .tp_search_results li:hover { background: var(--black-200); color: var(--white); } .tp_header .tp_search_results ul div:first-child { flex-grow: 1; max-width: 100%; } .tp_header .tp_search_results ul div:last-child { font-size: 12px; color: var(--gray-100); margin-left: 10px; } .tp_header .tp_search_form ::-webkit-input-placeholder { color: var(--gray); font-weight: inherit; } .tp_header .tp_search_form ::-moz-placeholder { color: var(--gray); font-weight: inherit; } .tp_header .tp_search_form :-moz-placeholder { color: var(--gray); font-weight: inherit; } .tp_header .tp_search_form :-ms-input-placeholder { color: var(--gray); font-weight: inherit; } .tp_header .tp_search_form.active form { border-color: var(--gray-100); } .tp_header .tp_search_form.active .tp_search_results { display: block; } @media (min-width: 992px) { .tp_header .tp_search_form { margin-left: 25px; max-width: 170px; } } @media (min-width: 1200px) { .tp_header .tp_search_form { max-width: 190px; } } @media (min-width: 1440px) { .tp_header .tp_search_form { max-width: 245px; min-width: 245px; } } .tp_header_user_box { font-size: 12px; margin-left: auto; padding: 3px 10px; border-radius: 5px; cursor: pointer; flex: 0 0 auto; } .tp_header_user_box .inner { margin-right: 15px; text-align: right; } .tp_header_user_box .label { font-weight: 700; text-transform: uppercase; margin-left: 10px; } .tp_header_user_box img { max-width: 30px; } @media (min-width: 768px) { .tp_header_user_box .label { margin-left: 0; } } .tp_header_button { background: linear-gradient(to right, rgba(var(--green-rgb), 1) 0%, rgba(var(--green-rgb), 0) 60%, rgba(var(--green-rgb), 0) 100%); color: rgba(var(--green-rgb), 0.8); border-radius: 5px; text-transform: uppercase; font-weight: 700; font-size: 10px; padding: 1px; cursor: pointer; margin-left: auto; flex: 0 0 90px; } .tp_header_button .text { background: var(--black-400); padding: 5px 8px; border-radius: 5px; } .tp_header_button.red { background: linear-gradient(to right, rgba(var(--red-rgb), 1) 0%, rgba(var(--red-rgb), 0) 60%, rgba(var(--red-rgb), 0) 100%); color: rgba(var(--red-rgb), 0.8); } @media (min-width: 768px) { .tp_header_user_box:hover { background: var(--black-200); } .tp_header_user_box .label { margin-left: 0; } } .tp_header_tabs { flex: 1 1 auto; margin: 0 15px 0 10px; } .tp_header_tab { font-size: 16px; color: var(--gray-100); display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--gray-300); border-radius: 10px; padding: 8px 10px 8px 15px; cursor: pointer; min-width: 0; margin-right: 5px; flex: 1 1 180px; position: relative; max-width: 180px; } .tp_header_tab:before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; bottom: -12px; background: var(--black-300); border-radius: 10px 10px 0 0; opacity: 0; transition: 0.25s; } .tp_header_tab:first-child:after { content: ""; width: 5px; height: 5px; background: var(--black-600); position: absolute; left: -1px; top: 100%; margin-top: 12px; } /*.tp_header_tab:first-child:hover:after { background: var(--black-300); }*/ .tp_header_tab:first-child.active:after { background: var(--black-600); } .tp_header_tab .title { min-width: 0; line-height: 1.25; position: relative; } .tp_header_tab .icon { width: 12px; height: 12px; stroke: var(--gray-100); stroke-width: 2px; position: relative; } .tp_header_tab .trigger { padding: 5px; height: 22px; } .tp_header_tab .trigger:hover .icon { stroke: var(--white); } .tp_header_tab.active:before, .tp_header_tab:hover:before { opacity: 1; } .tp_header_tab.active { color: var(--white); } .tp_header_tab.active:before { background: var(--black-600); } .tp_header_tabs_trigger { width: 40px; height: 40px; border: 1px solid var(--gray-300); border-radius: 5px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.25s; } .tp_header_tabs_trigger .icon { stroke: var(--gray-100); stroke-width: 3px; width: 16px; height: 16px; transition: all 0.25s; } .tp_header_tabs_extra { position: relative; margin-left: auto; } .tp_header_tabs_extra_dropdown { position: absolute; left: 0; top: 100%; padding-top: 5px; opacity: 0; visibility: hidden; transform: translateY(10px); transition: 0.25s; } .tp_header_tabs_extra_dropdown ul { background: var(--black-300); border-radius: 5px; width: 170px; padding: 10px 0; } .tp_header_tabs_extra_dropdown li { display: flex; align-items: center; cursor: pointer; font-size: 12px; color: var(--gray-100); line-height: 1.2; padding: 3px 15px 3px 20px; justify-content: space-between; } .tp_header_tabs_extra_dropdown li.active, .tp_header_tabs_extra_dropdown li:hover { background: var(--black-200); } .tp_header_tabs_extra_dropdown .trigger { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; margin-left: 5px; position: relative; } .tp_header_tabs_extra_dropdown .trigger:before { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; transform: translate(-50%, -50%); background: var(--gray-300); border-radius: 100%; } .tp_header_tabs_extra_dropdown .trigger .icon { width: 8px; height: 8px; stroke: var(--gray-100); position: relative; stroke-width: 2px; } .tp_header_tabs_extra_dropdown .trigger:hover:before { background: var(--red); } .tp_header_tabs_extra_dropdown .trigger:hover .icon { stroke: var(--white); } .tp_header_tabs_extra:hover .tp_header_tabs_extra_dropdown { opacity: 1; visibility: visible; transform: translateY(0); } .tp_header_tabs_extra:hover .tp_header_tabs_trigger { border-color: rgba(var(--green-rgb), 0.6); } .tp_header_tabs_extra:hover .tp_header_tabs_trigger .icon { transform: rotate(-180deg); stroke: var(--green); } @media (min-width: 992px) { .tp_header_tabs { margin-right: 20px; } } /********/ /* Body */ /********/ .tp_panel { display: none; /*position: relative;*/ } .tp_panel.active { display: flex; } @media (max-width: 767.98px) { .tp_panel { width: 100vw; } .tp_panel.active { flex-direction: column; } } .tp_search_form .field { width: 100%; } .tp_search_form input { border: none; line-height: 1.25; font-size: 16px; padding: 9px 10px; } .tp_search_form button { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; box-shadow: none; background: transparent; padding: 9px 10px; } .tp_search_form button .icon { width: 20px; height: 20px; transform: scaleX(-1); fill: var(--gray); } @media (min-width: 768px) { .tp_body { padding: 0 10px; flex: 1 1 auto; min-width: 0; } } /*********/ /* Chart */ /*********/ .tp_chart_canvas { background: var(--black-600); width: 100%; } .tp_chart_canvas iframe { height: 100% !important; } .tp_chart_canvas .__view, .tp_chart_canvas .__view > div { height: 100%; } .tp_chart_item { width: 100%; height: 100%; } @media (max-width: 767.98px) { .tp_chart_canvas { z-index: 90; } } @media (max-width: 767.98px) and (orientation: landscape) { .hide_on_landscape { display: none !important; } .tp_chart_item { height: 100vh; } .tp_chart_canvas { bottom: 0 !important; top: 0 !important; position: fixed !important; } } @media (max-width: 767.98px) and (orientation: portrait) { .tp_chart_item { height: calc(100% - 145px); } } @media (min-width: 768px) { .tp_chart { display: flex; flex: 1 0 50%; position: relative; } .tp_chart_canvas { border-radius: 10px; bottom: 10px; overflow: hidden; } .tp_chart_canvas:first-child { bottom: 0; display: block; position: relative; } } /**********/ /* Orders */ /**********/ .tp_orders { position: relative; } .tp_orders_inner { background: var(--black-600); height: 100%; max-width: 100%; position: relative; width: 100%; } .tp_orders_container { width: 100%; } .tp_orders_table_wrapper { padding: 0 50px; } .tp_orders_container .tp_orders_table_header .option_1 { left: 0; position: absolute; top: 0; } .tp_orders_container .tp_orders_table_header .option_2 { position: absolute; right: 0; top: 0; } .tp_orders_container .tp_orders_table_header .option_2 .trigger { padding-right: 20px; } .tp_orders_container .tp_orders_table_settings_dropdown { left: auto; margin-left: 0; margin-right: 50px; right: 0; } .tp_orders_container .option_1, .tp_orders_container .option_2 { border-bottom: 1px solid var(--black-200); z-index: 10; } .tp_orders_empty { width: 100%; height: 100%; } .tp_orders_empty .label { margin-bottom: 40px; } .tp_orders_empty .btn { font-size: 12px; } .tp_orders_empty .btn .icon { margin-right: 10px; stroke: var(--white); fill: var(--white); } .tp_orders_table { min-width: 100%; font-size: 14px; display: table; text-align: center; } .tp_orders_table .icon { stroke: var(--gray-300); vertical-align: middle; } .tp_orders_table .th { font-size: 12px; vertical-align: bottom; color: var(--gray-100); letter-spacing: 0.05em; padding: 15px 5px 10px; border-bottom: 1px solid var(--black-200); } .tp_orders_table .th .text-ellipsis { display: inline-block; max-width: calc(100% - 20px); vertical-align: middle; } .tp_orders_table .th .icon { width: 12px; height: 10px; margin-left: 10px; } .tp_orders_table .th, .tp_orders_table .td { position: relative; white-space: nowrap; } .tp_orders_table .td { vertical-align: middle; padding: 10px 10px; line-height: 26px; } .tp_orders_table_header { flex: 1 0 auto; } .tp_orders_table_body { flex: 1 1 auto; min-height: 0; height: 100%; } .tp_orders_table_data { flex: 1 1 auto; min-width: 0; width: 100%; } .tp_orders_table_options { flex: 1 0 60px; } .tp_orders_table_triggers { position: absolute; left: 0; top: 0; padding: 0 10px; } .tp_orders_table .tr { display: table-row; position: relative; } .tp_orders_table .th, .tp_orders_table .td { display: table-cell; width: 5%; position: relative; } .tp_orders_container .tp_orders_table_hover .td:first-child:before, .tp_orders_container .tp_orders_table_hover .td:last-child:before { content: ""; opacity: 0; background: var(--black-500); } .tp_orders_container .tp_orders_table_hover .td:first-child:before { right: 100%; width: 50px; left: auto; } .tp_orders_container .tp_orders_table_hover .td:last-child:before { left: 100%; width: 50px; right: auto; } .tp_orders_table_hover .tr:hover { cursor: pointer; background: var(--black-500); } .tp_orders_table_hover .tr:hover .td:before { opacity: 1; } .tp_orders_table_header .tp_orders_table { height: 49px; } .tp_orders_table_header .option_1 { /*position: absolute; left: 0; top: 0;*/ cursor: pointer; padding: 11px 10px 7px; background: var(--black-600); /*border-radius: 10px 10px 10px 0px;*/ } .tp_orders_table_header .option_1 .icon { width: 30px; height: 30px; stroke: var(--gray-200); fill: var(--gray-200); } .tp_orders_table_header .option_1:hover .icon { stroke: var(--green); fill: var(--green); } .tp_orders_table_header .option_2 { /*position: absolute; left: 60px; top: 0;*/ /*padding:14px 10px 10px 10px;*/ position: relative; background: var(--black-600); cursor: pointer; } .tp_orders_table_header .option_2 .icon { width: 20px; height: 20px; } .tp_orders_table_header .option_2 .trigger { padding: 16px 10px 12px 10px; } .tp_orders_table_header .option_2:hover .trigger .icon { fill: var(--green); } .tp_orders_table_settings_dropdown { position: absolute; left: 0; bottom: 0; margin-left: 40px; text-align: left; opacity: 0; visibility: hidden; transition: all 0.1s; } .tp_orders_table_header .option_2.active .tp_orders_table_settings_dropdown { opacity: 1; visibility: visible; transform: translateY(0); } .tp_orders_table_header .option_2.active .trigger .icon { fill: var(--green); } .tp_orders_table .option_3 .icon { width: 25px; height: 18px; } .tp_orders_table .btn { border-radius: 5px; font-size: 10px; line-height: 1.4; text-transform: uppercase; font-weight: 400; background: transparent; padding: 5px 10px; min-width: 45px; } .tp_orders_table .btn-secondary-round { color: var(--green); } .tp_orders_table .btn-red-round { color: var(--red); } .tp_orders_table .icon_arrow { width: 8px; height: 12px; margin-left: 5px; } .tp_orders_table .close { width: 26px; height: 26px; padding: 8px; position: relative; cursor: pointer; display: inline-block; vertical-align: top; } .tp_orders_table .close:before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: var(--gray-300); border-radius: 100%; width: 20px; height: 20px; } .tp_orders_table .close .icon { width: 10px; height: 10px; stroke: var(--gray-100); stroke-width: 2px; position: relative; vertical-align: top; } .tp_orders_table .close:hover:before { background: var(--red); } .tp_orders_table .close:hover .icon { stroke: var(--white); } .tp_orders_table .trigger { display: inline-block; vertical-align: top; position: relative; cursor: pointer; } .tp_orders_table .trigger:before { content: ""; position: absolute; left: -5px; top: -5px; bottom: -5px; right: -5px; } .tp_orders_table .trigger .icon { position: relative; fill: var(--gray-300); stroke: var(--gray-100); } .tp_orders_table .trigger:hover .icon { fill: var(--red); stroke: var(--white); } @media (max-width: 767.98px) { .tp_orders.active { display: none; } } @media (min-width: 768px) { .tp_orders { min-height: 0; flex: 1 1 50%; padding-top: 10px; } .tp_orders_inner { border-radius: 10px; } } /****************/ /* Left sidebar */ /****************/ .tp_sidebar_left { background: var(--black-400); } .tp_sidebar_left_trigger { position: absolute; z-index: 10; right: -33px; top: 50%; width: 40px; height: 40px; transform: translateY(-50%); transition: all 0.3s; cursor: pointer; } .tp_sidebar_left_trigger:before { content: ""; position: absolute; left: 10px; top: 5px; bottom: 5px; border-radius: 0 5px 5px 0; background: var(--green); width: 8px; transition: all 0.3s; } .tp_sidebar_left_trigger .icon { position: absolute; left: 50%; top: 50%; transform: translate(-105%, -50%) rotate(-180deg); width: 10px; height: 10px; transition: all 0.3s; } .tp_sidebar_left.active .tp_sidebar_left_trigger:before { border-radius: 5px 0 0 5px; background: var(--black-200); } .tp_sidebar_left.active .tp_sidebar_left_trigger { right: -22px; } .tp_sidebar_left.active .tp_sidebar_left_trigger .icon { transform: translate(-105%, -50%) rotate(0deg); } .tp_sidebar_left_panel { height: calc(100% - 60px); } @media (max-width: 767.98px) { .tp_sidebar_left { position: absolute; left: 0; right: 0; top: 60px; bottom: 60px; } } @media (min-width: 768px) { .tp_sidebar_left { display: flex; flex-direction: row; position: relative; padding-top: 70px; border-radius: 0px 10px 0px 0px; z-index: 10; } .tp_sidebar_left:after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 10px; border-right: 3px solid var(--black-200); border-radius: 0px 10px 0px 0px; } .tp_sidebar_left_header { position: absolute; left: 0; right: 0; top: 0; background: var(--black-200); font-size: 14px; text-transform: uppercase; font-weight: 700; color: var(--white); line-height: 20px; border-radius: 0px 10px 0px 0px; max-width: 100%; overflow: hidden; cursor: pointer; } .tp_sidebar_left_header_inner { padding: 20px; } .tp_sidebar_left_header .icon { width: 16px; min-width: 16px; height: 16px; margin-right: 40px; transition: all 0.25s; } .tp_sidebar_left_header.active .icon { transform: rotate(180deg); } .tp_sidebar_left_panel { width: 280px; max-width: 100%; height: 100%; } .tp_sidebar_left_panel > div { height: 100%; } } @media (min-width: 768px) and (max-width: 1199.98px) { .tp_sidebar_left { position: absolute; left: 0; top: 60px; bottom: 60px; transform: translateX(-100%); } .tp_sidebar_left.active { transform: translateX(0); } } @media (min-width: 1200px) { .tp_sidebar_left { max-width: 0; } .tp_sidebar_left.active { max-width: 475px; } } /* Navigation */ .tp_sidebar_left .nav li { white-space: nowrap; font-size: 16px; color: var(--gray-100); display: flex; align-items: center; padding: 14px 10px; line-height: 1.25; cursor: pointer; position: relative; } .tp_sidebar_left .nav .icon { width: 16px; height: 16px; fill: var(--red); margin-right: 10px; } .tp_sidebar_left .nav .active { color: var(--white); font-weight: 700; } @media (max-width: 767.98px) { .tp_sidebar_left .nav { padding-left: 60px; background: var(--black-300); position: relative; } .tp_sidebar_left .nav:after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 70px; background: linear-gradient(270deg, var(--black-300) 0%, rgba(var(--black-300-rgb), 0.2) 100%); pointer-events: none; } .tp_sidebar_left .nav_inner { overflow: auto; -webkit-overflow-scrolling: touch; } .tp_sidebar_left .nav ul { display: flex; } .tp_sidebar_left .nav li:last-child { padding-right: 40px; } } @media (min-width: 768px) { .tp_sidebar_left .nav { position: absolute; left: 0; top: 60px; bottom: 0; background: var(--black-400); z-index: 10; padding: 10px 10px 10px 0; transform: translateX(-100%); overflow: hidden; } .tp_sidebar_left .nav_inner { width: 190px; } .tp_sidebar_left .nav li { padding: 10px 10px 10px 50px; border-radius: 0 40px 40px 0; } .tp_sidebar_left .nav li.active { background: var(--black-200); } .tp_sidebar_left .nav li:hover { background: rgba(var(--black-600-rgb), 0.5); color: var(--green); } .tp_sidebar_left .nav .icon { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); } .tp_sidebar_left .nav.active { transform: translateX(0); } } @media (min-width: 1440px) { .tp_sidebar_left .nav { transform: none; padding: 0; top: 0; position: relative; max-width: 0; } .tp_sidebar_left.active .nav.active { max-width: 190px; } } /* Search */ .tp_sidebar_left .tp_search_form { position: absolute; left: 0; right: 0; top: 0; transform: translateX(calc(-100% + 65px)); transition: all 0.25s; z-index: 10; } .tp_sidebar_left .tp_search_form.search_open form { background: var(--black-200); } .tp_sidebar_left .tp_search_form form { margin-right: 10px; border-radius: 0 30px 30px 0; position: relative; transition: background-color 0.35s; } .tp_sidebar_left .tp_search_form input { padding: 14px; } .tp_sidebar_left .tp_search_form button { padding: 14px; border-radius: 0 30px 30px 0; visibility: hidden; } .tp_sidebar_left .tp_search_form .trigger { position: absolute; right: 0; top: 0; width: 48px; height: 48px; border-radius: 0 30px 30px 0; } .tp_sidebar_left .tp_search_form .trigger .icon { width: 20px; height: 20px; fill: var(--gray-200); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .tp_sidebar_left .tp_search_form .trigger .icon:first-child { transform: scaleX(-1) translate(50%, -50%); } .tp_sidebar_left .tp_search_form .trigger .icon:last-child { visibility: hidden; stroke: var(--gray); stroke-width: 2; } .tp_sidebar_left .tp_search_results { position: absolute; top: 60px; bottom: 0; left: 0; right: 0; background: var(--black-400); font-size: 14px; line-height: 1.2; color: var(--white); opacity: 0; transition: all 0.25s; } .tp_sidebar_left .tp_search_results ul { padding-left: 20px; } .tp_sidebar_left .tp_search_results li { border-bottom: 1px solid var(--black-200); padding: 14px 20px 13px 0; display: flex; justify-content: space-between; } .tp_sidebar_left .tp_search_results ul div:last-child { font-size: 12px; color: var(--gray-100); margin-left: 10px; } .tp_sidebar_left .tp_search_form.active .tp_search_results { opacity: 1; } .tp_sidebar_left .tp_search_form.search_open { transform: none; bottom: 0; } .tp_sidebar_left .tp_search_form.search_open .trigger .icon:first-child { visibility: hidden; } .tp_sidebar_left .tp_search_form.search_open .trigger .icon:last-child { visibility: visible; } /* Instruments */ .tp_instruments .item { border-bottom: 1px solid var(--black-300); position: relative; } .tp_instruments .item_inner { padding: 15px 10px 15px 60px; } .tp_instruments .trigger { position: absolute; left: 10px; border-radius: 100%; background: var(--black-300); width: 35px; height: 35px; top: 50%; transform: translateY(-50%); cursor: pointer; } .tp_instruments .trigger .icon { width: 16px; height: 16px; fill: none; stroke: var(--gray-200); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .tp_instruments .trigger.active .icon { fill: var(--red); stroke: none; } .tp_instruments .info { width: calc(100% - 170px); position: relative; overflow: hidden; transition: all 0.3s; } .tp_instruments .info .icon { position: absolute; left: 0; top: 50%; transform: translate(-100%, -50%); transition: all 0.3s; } .tp_instruments .label { font-size: 10px; line-height: 1.2; text-transform: uppercase; color: var(--gray-100); max-width: 120px; } .tp_instruments .label strong { margin-right: 10px; } .tp_instruments .title { color: var(--white); font-size: 14px; margin-bottom: 3px; } .tp_instruments .price { font-size: 12px; line-height: 20px; padding: 4px 5px; border-radius: 8px; min-width: 80px; margin-left: 5px; display: flex; align-items: center; justify-content: center; background: var(--black-200); color: var(--gray-100); } .tp_instruments .price_red { background: rgba(var(--red-rgb), 0.1); color: var(--red); } .tp_instruments .price_green { background: rgba(var(--green-rgb), 0.1); color: var(--green); } .tp_instruments .price:hover { background: rgba(58, 58, 58, 0.6); color: var(--white-100); } .tp_instruments .price_red:hover { background: rgba(var(--red-rgb), 0.4); } .tp_instruments .price_green:hover { background: rgba(var(--green-rgb), 0.4); } .tp_instruments_header { color: var(--gray-100); font-size: 12px; border-bottom: 1px solid var(--gray-300); padding: 15px 5px 5px 5px; margin-bottom: 15px; margin-left: 10px; text-align: center; } .tp_instruments_header .col { padding: 0 5px; } .tp_instruments_header .col:first-child { min-width: calc(100% - 140px); text-align: left; } @media (min-width: 768px) { .tp_instruments { max-width: 280px; overflow: hidden; padding-right: 2rem; height: 100%; } .tp_instruments .item { border-bottom: none; padding-left: 30px; margin-bottom: 5px; } .tp_instruments .item_inner { padding: 7px 10px; cursor: pointer; border-radius: 10px 0px 0px 10px; transition: all 0.25s; } .tp_instruments .info { width: calc(100% - 140px); } .tp_instruments .price { min-width: 65px; border-radius: 20px; font-size: 10px; padding: 3px 10px; } .tp_instruments .trigger { background-color: transparent; border-radius: 10px; height: 45px; left: 5px; opacity: 0; top: 0; transform: none; transition: all 0.25s; width: 22px; } .tp_instruments .trigger .icon { width: 12px; height: 12px; } .tp_instruments .trigger:hover .icon { stroke: var(--red); } .tp_instruments .trigger.active, .tp_instruments .item:hover .trigger { opacity: 1; } /*.tp_instruments .item:hover .trigger { background: rgba(var(--black-600-rgb), 0.5); }*/ .tp_instruments .item:hover { background: rgba(var(--black-600-rgb), 0.5); } .tp_instruments .info:hover { padding-left: 35px; } .tp_instruments .info:hover .icon { transform: translate(0, -50%); } } /*****************/ /* Right sidebar */ /*****************/ .tp_sidebar_right_panel > div { width: 100%; min-height: 0; } .tp_sidebar_right_panel_scroll { flex: 1 1 auto; min-height: 0; position: relative; } .tp_sidebar_right .content_scroll_wrapper { width: 100%; } .tp_sidebar_right .input-switcher-left [type=checkbox] + label { font-size: 12px; color: var(--gray-100); } .tp_sidebar_right .input-switcher-left [type=checkbox] + label:before { width: 40px; height: 20px; } .tp_sidebar_right .input-switcher-left [type=checkbox] + label:after { width: 14px; height: 14px; } .tp_sidebar_right .input-switcher-left [type=checkbox]:checked + label:after { left: 22px; } .tp_sidebar_right_radio label { cursor: pointer; min-width: 26px; } .tp_sidebar_right_radio label:hover, .tp_sidebar_right_radio input:checked + label { background-color: rgba(var(--green-rgb), 0.1); color: var(--green); } @media (min-width: 768px) { .tp_sidebar_right { max-width: 320px; } .tp_sidebar_right_panel { background: var(--black-600); border-radius: 10px 10px 0px 0px; bottom: 60px; display: flex; overflow: hidden; position: absolute; right: 60px; top: 60px; transform: translateX(calc(100% + 60px)); width: 260px; z-index: 10; } .tp_sidebar_right_panel.active { transform: translateX(0); } .tp_sidebar_right .input-switcher-left [type=checkbox] + label { padding-left: 50px; } } @media (min-width: 1600px) { .tp_sidebar_right_panel { transform: none; position: relative; right: 0; top: 0; bottom: 0; max-width: 0; } .tp_sidebar_right_panel.active { max-width: 260px; margin-right: 10px; } } /* Navigation */ .tp_sidebar_right .nav { position: relative; background: var(--black-400); } .tp_sidebar_right .nav ul { background: var(--black-400); } .tp_sidebar_right .nav li { width: 50px; height: 50px; position: relative; border-bottom: 1px solid var(--black-200); cursor: pointer; position: relative; } .tp_sidebar_right .nav li:first-child { border-radius: 10px 0 0 0; } .tp_sidebar_right .nav li:last-child { border-bottom: none; border-radius: 0 0 0 10px; } .tp_sidebar_right .nav li:hover { background: var(--black-600); } .tp_sidebar_right .nav svg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); fill: var(--gray); stroke: var(--gray); width: 24px; height: 24px; } .tp_sidebar_right .nav li span { position: absolute; left: 0; right: 0; top: 0; bottom: 0; font-size: 0; z-index: 10; } .tp_sidebar_right .nav li .line { position: absolute; top: 10px; width: 5px; height: 5px; border-radius: 100%; background: var(--green); right: 10px; } .tp_sidebar_right .nav .fill { fill: var(--gray); } .tp_sidebar_right .nav .stroke { stroke: var(--gray); } .tp_sidebar_right .nav .active { background: var(--black-600); } .tp_sidebar_right .nav .active svg { fill: var(--green); stroke: var(--green); } /* Info */ .tp_info { font-size: 12px; color: var(--gray-100); line-height: 1.2; } @media (min-width: 768px) { .tp_info { width: 260px; } } .tp_info_header { line-height: 1.2; padding: 15px 20px; color: var(--white); font-weight: 700; text-transform: uppercase; } .tp_info_inner { padding: 15px 10px; background: var(--black-600); } .tp_order_type { line-height: 1; text-transform: uppercase; position: relative; } .tp_order_type_left, .tp_order_type_right { cursor: pointer; padding: 12px 15px; width: 50%; } .tp_order_type_left { background: rgba(var(--red-rgb), 0.05); border: 1px solid rgba(var(--red-rgb), 0.3); border-radius: 20px 0px 0px 20px; } .tp_order_type_right { background: rgba(var(--green-rgb), 0.05); border: 1px solid rgba(var(--green-rgb), 0.3); border-radius: 0px 20px 20px 0px; text-align: right; } .tp_order_type_left:hover { background: rgba(var(--red-rgb), 0.1); border-color: var(--red); } .tp_order_type_right:hover { background: rgba(var(--green-rgb), 0.1); border-color: var(--green); } .tp_order_type .label { font-weight: 700; margin-bottom: 4px; } .tp_order_type .price { font-size: 18px; } .tp_order_type .price small { font-size: 14px; } .tp_order_type_center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: var(--black-400); border-radius: 15px; padding: 5px 10px; line-height: 20px; text-align: center; color: var(--gray); font-weight: 700; pointer-events: none; } .tp_order_type_spinner + .tp_order_type_center { top: 10px; transform: translateX(-50%); } .tp_order_type_spinner { position: absolute; left: 50%; top: 100%; transform: translate(-50%, -50%); background: var(--black-300); border: 1px solid var(--gray-300); border-radius: 20px; line-height: 24px; } .tp_order_type_spinner_left, .tp_order_type_spinner_right { width: 24px; height: 24px; position: relative; cursor: pointer; } .tp_order_type_spinner_left:before, .tp_order_type_spinner_right:before { content: ""; position: absolute; width: 8px; height: 8px; top: 50%; left: 50%; border-left: 1px solid transparent; border-top: 1px solid transparent; } .tp_order_type_spinner_left:before { border-color: var(--red); transform: translate(-25%, -50%) rotate(-45deg); } .tp_order_type_spinner_right:before { border-color: var(--green); transform: translate(-60%, -50%) rotate(135deg); } .tp_order_type_spinner_value { width: 40px; text-align: center; color: var(--white); } .tp_order_type_spinner_value input { padding: 0; border: none; font-size: 12px; text-align: center; } .tp_info_options { color: var(--gray); padding: 15px 10px 0; } .tp_info_options li { display: flex; align-items: center; border-bottom: 1px solid var(--black-200); padding: 15px 0; cursor: pointer; } .tp_info_options li:last-child { border-bottom: none; } .tp_info_options .icon { fill: var(--gray-200); stroke: var(--gray-200); margin-right: 10px; } .tp_info_options li:hover { color: var(--green); } .tp_info_options li:hover .icon { fill: var(--green); stroke: var(--green); } .tp_sidebar_card { background: var(--black-500); border-bottom: 1px solid var(--black-500); } .tp_sidebar_card_header { color: var(--gray); display: flex; align-items: center; justify-content: space-between; text-transform: uppercase; font-weight: 700; border-bottom: 1px solid var(--gray-300); padding: 15px 20px; cursor: pointer; } .tp_sidebar_card_header .icon { width: 16px; height: 16px; stroke: var(--gray-100); stroke-width: 3; } .tp_sidebar_card_body { padding: 15px 0; display: none; } .tp_info_description { margin: 0 10px; background: var(--black-400); border-radius: 10px; color: var(--gray-100); text-align: center; margin-top: 15px; } .tp_info_description .btn-secondary-round { font-size: 12px; font-weight: 400; text-transform: none; color: var(--gray); border-radius: 10px; border-color: rgba(var(--green-rgb), 0.3); padding-top: 8px; padding-bottom: 8px; } .tp_info_description .btn-secondary-round .icon { width: 32px; height: 32px; fill: var(--white); stroke: var(--white); margin-right: 10px; } .tp_info_description p { margin-bottom: 10px; } .tp_info_description_inner { padding: 15px 20px; line-height: 1.4; } .tp_sidebar_card.active { background: var(--black-600); border-bottom-color: var(--black-400); } .tp_sidebar_card.active .tp_sidebar_card_header { color: var(--white); border-color: var(--green); } .tp_sidebar_card.active .tp_sidebar_card_header .icon { transform: rotate(-180deg); } .tp_sidebar_card.active .tp_sidebar_card_body { display: block; } .tp_info_stats_header { border-bottom: 1px solid var(--black-200); margin-bottom: 10px; } .tp_info_stats_subheader { margin-bottom: 15px; } .tp_info_stats .row { padding: 5px 0; margin-left: 10px; margin-right: 10px; } .tp_info_stats .row > div { padding: 0 10px; } .tp_info_stats .label { letter-spacing: 0.05em; } .tp_info_stats .value { font-size: 14px; } .tp_info_stats .icon { width: 8px; height: 12px; margin-left: 5px; } .tp_info_stats_chart_1 { height: 4px; background: var(--black-300); position: relative; border-radius: 4px; margin: 15px 20px 30px; } .tp_info_stats_chart_1 i { width: 10px; height: 10px; border-radius: 2px; background: var(--red); transform: rotate(45deg) translate(-50%, -50%); position: absolute; top: 50%; left: 0; transform-origin: 0 0; } .tp_info_stats_chart_2 { margin: 0 20px 10px; color: var(--gray-300); } .tp_info_stats_chart_2 .row { margin-left: -5px; margin-right: -5px; } .tp_info_stats_chart_2 .row > div { padding-left: 5px; padding-right: 5px; } .tp_info_stats_chart_2 .value { font-size: 14px; } .tp_info_stats_chart_2_inner { height: 4px; position: relative; background: var(--red); border-radius: 4px; margin-top: 10px; } .tp_info_stats_chart_2_inner i { height: 100%; position: absolute; top: 0; right: 0; border-radius: 4px; background: var(--green); } .tp_info_change { padding: 15px; text-align: center; } .tp_info_change .row { margin: 0 -5px; } .tp_info_change .row > div { padding: 0 5px; display: flex; flex-direction: column; } .tp_info_change .label { margin-bottom: 5px; } .tp_info_change .value { font-size: 14px; } .tp_info_change .line { width: 100%; border-top: 1px solid var(--black-200); margin: 15px 0; } .tp_info_list .item { border-bottom: 1px solid var(--black-200); } .tp_info_list .item:last-child { border-bottom: none; } .tp_info_list .col { max-width: 50%; } .tp_info_list .label { padding: 10px 0; min-width: 30%; margin-right: 15px; } .tp_info_list .value { color: var(--white); text-align: right; flex-grow: 1; } @media (min-width: 768px) { .tp_info_list { padding: 0 15px; } } .tp_info_bars { padding: 5px 20px 20px; } .tp_info_bars .bar { position: relative; padding: 15px 0 10px; } .tp_info_bars .value { text-align: right; flex-grow: 1; } .tp_info_bars .label { margin-right: 15px; } .tp_info_bars .chart { background: var(--gray-200); position: absolute; left: 0; right: 0; bottom: 0; height: 5px; border-radius: 4px; } .tp_info_bars .chart .line { position: absolute; height: 100%; background: rgba(var(--green-rgb), 0.5); border-radius: 4px; } .tp_info_bars .chart .marker { position: absolute; top: -3px; left: 0; color: var(--green); font-size: 9px; width: 1px; height: 10px; background: var(--green); } .tp_info_bars .chart .marker span { display: block; padding-top: 2px; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); } /* Chat */ .tp_panel .chat { pointer-events: all; position: absolute; z-index: 80; } .tp_panel .chat_card_date_inner { background: var(--black-400); } .tp_sidebar_right_panel .chat { min-width: 260px; } .tp_sidebar_right_panel .chat_card_date_inner { background: var(--black-600); } /**********/ /* Footer */ /**********/ .tp_footer { position: fixed; left: 0; right: 0; bottom: 0; background: rgba(var(--black-200-rgb), 0.3); font-size: 12px; line-height: 14px; } @media (min-width: 768px) { .tp_footer { padding: 8px 0; position: absolute; background: transparent; } } /* Mobile navigation */ .tp_footer_nav { background: var(--black-300); bottom: 0; color: var(--gray-100); font-size: 10px; left: 0; line-height: 1; position: fixed; right: 0; z-index: 50; } .tp_footer_nav ul { display: flex; } .tp_footer_nav li { align-items: center; display: flex; flex-direction: column; flex: 1 0 20%; justify-content: center; padding: 10px; position: relative; } .tp_footer_nav .icon { fill: var(--gray-100); stroke: var(--gray-100); margin-bottom: 6px; width: 24px; height: 24px; } .tp_footer_nav .line { background: var(--green); border-radius: 100%; height: 5px; position: absolute; right: 10px; top: 10px; width: 5px; } .tp_footer_nav .active { background: rgba(var(--green-rgb), 0.03); color: rgba(var(--green-rgb), 0.6); } .tp_footer_nav .active .icon { fill: var(--green); stroke: var(--green); } .tp_footer_date { font-weight: 700; padding: 0 20px; } .tp_footer_date .icon { fill: var(--gray-200); height: 20px; margin-right: 10px; stroke: var(--gray-200); width: 20px; } .tp_footer_date span { color: var(--gray-100); } @media (min-width: 1200px) { .tp_footer-md .tp_footer_date { min-width: 280px; } } @media (min-width: 1440px) { .tp_footer-lg .tp_footer_date { min-width: 470px; } } .tp_footer_tabs { padding: 0 10px; flex: 1 0 auto; } .tp_footer_tab { padding: 0 10px 10px; position: relative; cursor: pointer; } .tp_footer_tab:before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; top: -10px; background: var(--black-600); border-radius: 0px 0px 10px 10px; opacity: 0; transition: all 0.25s; } .tp_footer_tab:first-child:after { content: ""; position: absolute; left: 0; bottom: 100%; width: 5px; height: 5px; background: var(--black-600); visibility: hidden; margin-bottom: 10px; } .tp_footer_tab:first-child:hover:after, .tp_footer_tab.active:first-child:after { visibility: visible; } .tp_footer_tab .icon { fill: var(--gray-300); stroke: var(--gray-300); stroke-width: 2; position: relative; width: 20px; height: 20px; } .tp_footer_tab .marker { position: absolute; right: 10px; bottom: 5px; width: 12px; height: 12px; border-radius: 100%; background: var(--green); } .tp_footer_tab .marker.red { background: var(--red); } .tp_footer_tab:hover:before, .tp_footer_tab.active:before { opacity: 1; } .tp_footer_tab:hover .icon, .tp_footer_tab.active .icon { fill: var(--gray); stroke: var(--gray); } @media (min-width: 992px) { .tp_footer_tab { padding-left: 15px; padding-right: 15px; } .tp_footer_tab .icon { width: 30px; height: 30px; } } @media (min-width: 1200px) { .tp_footer_tabs { padding: 0 5px; } .tp_footer_tab { margin: 0 5px; } } .tp_footer_stats { padding: 6px 6px 6px 15px; border-radius: 10px 50px 50px 50px; min-width: 0; cursor: pointer; position: relative; } .tp_footer_stats .tp_footer_stats_item { margin-right: 15px; margin-left: 0; } .tp_footer_stats_item { margin-left: auto; margin-right: 15px; flex-direction: column; justify-content: center; min-width: 0; font-size: 10px; vertical-align: middle; } .tp_footer_stats_item .label { color: var(--gray-100); text-transform: uppercase; } .tp_footer_stats_item .value { color: var(--white); } .tp_footer_status { background: #231116; border-radius: 20px; color: var(--red); height: 32px; justify-content: center; line-height: 20px; min-width: 120px; overflow: hidden; padding: 6px; position: relative; text-transform: uppercase; } .tp_footer_status .value { position: absolute; left: 0; top: 0; bottom: 0; background: rgba(var(--red-rgb), 0.2); border-radius: 20px 0px 0px 20px; } .tp_footer_status.green { background: rgba(var(--green-rgb), 0.1); color: var(--green); } .tp_footer_status.green .value { background: rgba(var(--green-rgb), 0.25); } .tp_account_status_drpodown { bottom: 100%; cursor: default; left: 0; min-width: 395px; opacity: 0; padding-bottom: 5px; position: absolute; transition: 0.25s; visibility: hidden; z-index: 10; } .tp_account_status_drpodown_inner { background: var(--black-300); border-radius: 10px; padding: 20px; } .tp_account_status_header { color: var(--white); font-size: 14px; font-weight: 700; margin-bottom: 20px; position: relative; text-align: center; text-transform: uppercase; } .tp_account_status_dropdown_trigger { cursor: pointer; padding: 9px; position: absolute; right: -9px; top: -9px; } .tp_account_status_dropdown_trigger .icon { stroke: var(--white); stroke-width: 3px; width: 12px; height: 12px; } .tp_account_status_buttons { margin-bottom: 40px; } .tp_account_status_buttons .btn { margin-bottom: 10px; border-radius: 5px; font-size: 14px; } .tp_account_status_line { background: var(--black-400); border-radius: 5px; margin-bottom: 10px; padding: 0 20px; position: relative; } .tp_account_status_line_inner { padding: 55px 0; position: relative; } .tp_account_status_line .value { position: absolute; left: 0; top: -2px; } .tp_account_status_line .value_inner { position: absolute; left: 0; top: 0; border-radius: 1px; font-size: 18px; letter-spacing: 0.05em; text-align: center; color: #93E144; background-image: url("data:image/svg+xml,%3Csvg width='70' height='45' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 23c0 8.284 6.716 15 15 15h14.804a1 1 0 0 1 .866.5l3.464 6a1 1 0 0 0 1.732 0l3.464-6a1 1 0 0 1 .866-.5H55c8.284 0 15-6.716 15-15V1a1 1 0 0 0-1-1H1a1 1 0 0 0-1 1v22z' fill='%23131313'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 23c0 8.284 6.716 15 15 15h14.804a1 1 0 0 1 .866.5l3.464 6a1 1 0 0 0 1.732 0l3.464-6a1 1 0 0 1 .866-.5H55c8.284 0 15-6.716 15-15V1a1 1 0 0 0-1-1H1a1 1 0 0 0-1 1v22z' fill='url(%23paint0_linear)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='35' y1='22.5' x2='35' y2='47.999' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='.315' stop-color='%231A1A1A' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%2378B837'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E"); line-height: 25px; padding: 10px; min-width: 70px; transform: translateX(-50%); } .tp_account_status_line .value_inner:before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: #78B837; border-radius: 1px 1px 0px 0px; } .tp_account_status_line .value small { font-size: 14px; } .tp_account_status_line .line { height: 5px; background: linear-gradient(to right, var(--red) 8%, var(--green) 24%); border-radius: 3px; } .tp_account_status_line .label { position: absolute; top: 50px; font-size: 10px; line-height: 1; color: var(--gray-100); text-transform: uppercase; padding-left: 10px; } .tp_account_status_line .label:before { content: ""; width: 3px; border: 1px solid var(--black-400); background: var(--white); position: absolute; left: 0; top: 0; } .tp_account_status_line .label_1 { padding-top: 20px; } .tp_account_status_line .label_1:before { height: 30px; } .tp_account_status_line .label_2 { padding-top: 40px; } .tp_account_status_line .label_2:before { height: 50px; } .donut_chart_title { font-size: 12px; color: var(--gray-100); margin-bottom: 10px; } .donut_chart_value { font-size: 18px; color: white; letter-spacing: 0.05em; } .tp_account_status_chart_inner { border-bottom: 1px solid var(--black-200); padding-bottom: 30px; margin-bottom: 30px; } .tp_account_status_chart_data { border-radius: 20px; } .tp_account_status_chart_data + .tp_account_status_chart_data { margin-top: 5px; } .tp_account_status_chart_data .label { text-transform: uppercase; color: var(--gray-100); position: relative; padding-left: 15px; margin-bottom: 10px; } .tp_account_status_chart_data .label:before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 6px; height: 6px; border-radius: 100%; background: var(--gray-100); } .tp_account_status_drpodown .tp_account_status_chart_data .value { font-size: 18px; letter-spacing: 0.05em; } .tp_account_status_chart_data small { font-size: 14px; } .tp_account_status_chart_data.green .value { color: var(--green); } .tp_account_status_chart_data.green .label:before { background: var(--green); } .tp_account_status_chart_data.red .value { color: var(--red); } .tp_account_status_chart_data.red .label:before { background: var(--red); } .tp_account_status_chart_part { position: relative; padding-left: 15px; } .tp_account_status_chart_part .label { text-transform: uppercase; color: var(--gray-100); position: relative; margin-bottom: 5px; font-size: 10px; } .tp_account_status_chart_part .point { content: ""; position: absolute; left: 0; top: 3px; width: 6px; height: 6px; border-radius: 100%; background: var(--gray-100); } .tp_account_status_chart_part .value { font-size: 14px; letter-spacing: 0.05em; color: var(--gray); } .tp_footer_stats.active, .tp_footer_stats:hover { background: var(--black-200); } .tp_footer_stats.active .tp_account_status_drpodown { opacity: 1; visibility: visible; transform: translateY(0); } @media (min-width: 992px) { .tp_footer_stats .tp_footer_stats_item { margin-right: 25px; font-size: 11px; } .tp_footer_status { min-width: 160px; } } @media (min-width: 1200px) { .tp_footer_stats { padding-left: 25px; } .tp_footer_stats .tp_footer_stats_item { margin-right: 30px; } } @media (min-width: 1600px) { .tp_footer_stats .tp_footer_stats_item { margin-right: 40px; } .tp_footer_stats_item { align-items: center; flex-direction: row; justify-content: flex-start; } .tp_footer_stats_item .label { margin-right: 10px; } } .tp_footer_settings { position: relative; margin: 0 10px 0 15px; z-index: 10; } .tp_footer_settings_trigger { position: relative; width: 40px; height: 40px; border: 1px solid var(--gray-300); border-radius: 5px; cursor: pointer; transition: all 0.1s; } .tp_footer_settings_trigger i { position: absolute; left: 50%; top: 50%; border-radius: 1px; width: 6px; height: 6px; transform: translate(-50%, -50%); background: var(--gray-300); transition: all 0.25s; } .tp_footer_settings_trigger i:before, .tp_footer_settings_trigger i:after { content: ""; position: absolute; top: 0; bottom: 0; width: 6px; background: inherit; border-radius: 1px; } .tp_footer_settings_trigger i:before { left: -9px; } .tp_footer_settings_trigger i:after { right: -9px; } .tp_footer_settings_dropdown { position: absolute; right: 0; bottom: 100%; padding-bottom: 5px; opacity: 0; visibility: hidden; transition: all 0.1s; } .tp_footer_settings.active .tp_footer_settings_dropdown { opacity: 1; visibility: visible; transform: translateY(0); } .tp_footer_settings:hover .tp_footer_settings_trigger, .tp_footer_settings.active .tp_footer_settings_trigger { border-color: var(--green); } .tp_footer_settings:hover .tp_footer_settings_trigger i, .tp_footer_settings.active .tp_footer_settings_trigger i { background: var(--green); } @media (min-width: 1200px) { .tp_footer_settings { margin-left: 35px; } } /*********/ /* Fixed content over main content */ /*********/ .tp_fixed { background: var(--black-400); position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 100; } /*********/ /* Popup */ /*********/ .tp_popup_wrapper { opacity: 0; pointer-events: none; position: fixed; transition: all 0.3s; visibility: hidden; z-index: 101; } .tp_popup { background: var(--black-400); display: flex; flex-direction: column; font-weight: 400; left: 0; letter-spacing: 0; opacity: 0; overflow: hidden; position: absolute; top: 0; transition: all 0.3s; visibility: hidden; width: 100%; } .popup-open:has(.tp_popup.active) .tp_header .nav_trigger, .popup-open:has(.tp_popup.active) .tp_header_logo { opacity: 0; visibility: hidden; } .popup-open:has(.tp_popup.active) .tp_popup_wrapper { opacity: 1; visibility: visible; pointer-events: all; } .tp_popup.active { opacity: 1; visibility: visible; z-index: 10; } .tp_popup_close { width: 30px; height: 30px; position: absolute; right: 13px; top: 14px; cursor: pointer; z-index: 10; } .tp_popup_close i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 20px; height: 20px; } .tp_popup_close i:before, .tp_popup_close i:after { content: ""; width: 20px; height: 2px; background: var(--gray-100); display: block; position: absolute; left: 0; top: 50%; } .tp_popup_close i:before { transform: rotate(45deg); } .tp_popup_close i:after { transform: rotate(-45deg); } .tp_popup_close:hover i:after, .tp_popup_close:hover i:before { background: var(--white); } .tp_popup_button { position: absolute; left: 13px; top: 14px; cursor: pointer; z-index: 10; padding: 5px; } .tp_popup_button .icon { width: 20px; height: 20px; } .tp_popup_back i:before, .tp_popup_back i:after { width: 10px; left: 20%; } .tp_popup_back i:before { margin-top: 3px; } .tp_popup_back i:after { margin-top: -3px; } .tp_popup h2, .tp_popup h3 { font-size: 12px; line-height: 20px; position: relative; top: 2px; text-transform: uppercase; color: var(--gray); } .tp_popup h4 { font-size: 18px; color: var(--gray); font-weight: 400; } .tp_popup_header { padding: 20px; position: relative; flex: 0 0 auto; } .tp_popup_inner { flex: 0 1 auto; min-height: 0; display: flex; flex-grow: 1; } .tp_popup .content_scroll_wrapper { flex: 1 1 auto; min-height: 0; height: auto; min-width: 0; } .tp_popup .content_scroll_wrapper .__view { max-width: 100%; display: flex; } .tp_popup .content_scroll_wrapper .__view > div { width: 100%; } .tp_popup_body { flex-grow: 1; max-width: 100%; } .tp_popup_part { padding: 0 20px; } .tp_popup label { font-size: 14px; } .tp_popup_extra .tp_popup_header { text-align: center; background: var(--black-600); } .tp_popup_extra .tp_popup_account_extra { background: transparent; } @media (max-width: 767.98px) { .tp_popup { height: 100%; } } @media (min-width: 768px) { .tp_popup_wrapper:before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(var(--black-rgb), 0.65); } .tp_popup { left: 50%; top: 50%; border-radius: 10px; max-width: 490px; max-height: 90%; transform: translate(-50%, -50%); } .tp_popup_lg { max-width: 680px; } .tp_popup_close { left: auto; right: 10px; top: 10px; } .tp_popup_header { padding-left: 40px; padding-right: 40px; } .tp_popup_part { padding: 0 40px; } .tp_popup h2, .tp_popup h3 { font-size: 14px; } .tp_popup label { font-size: 16px; } } .tp_popup_filter { -moz-column-gap: 5px; column-gap: 5px; } .tp_popup_filter button { color: var(--gray-100); border-radius: 8px; } .tp_popup_filter .is-active { background-color: var(--black-200); } /* Popup: Account settings */ .tp_popup_account_settings { background: var(--black-300); padding-top: 20px; padding-bottom: 20px; } .tp_popup_account_trigger { background: var(--black-600); font-size: 12px; text-transform: uppercase; font-weight: 700; padding-top: 20px; padding-bottom: 20px; margin-top: 10px; } .tp_popup_account_trigger .icon { margin-right: 20px; } .tp_popup_account_trigger .arrow { stroke: var(--gray-100); stroke-width: 3; transform: rotate(-90deg); } .tp_popup_account_trigger .arrow .icon { margin-right: 0; } .tp_popup_account_total { border-top: 1px solid #3f8e23; font-size: 18px; padding-top: 20px; padding-bottom: 20px; background: var(--black-300); margin-top: 10px; } .tp_popup_account_total small { font-size: 14px; } .tp_popup_heading { padding-top: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--black-200); } .tp_popup_account_extra { background: var(--black-300); } .tp_popup_account_extra_inner { padding-top: 30px; padding-bottom: 30px; } .tp_popup_account_extra .form_row { margin-bottom: 50px; } .tp_popup_account_extra .vue_slider_value { color: var(--white); font-size: 24px; } .tp_popup_account_extra .vue-slider { margin-top: 10px; } .tp_popup_account_status { background: var(--black-300); border-radius: 10px; margin: 10px; } .tp_popup_account_status .tp_account_status_line { background: transparent; border-bottom: 1px solid var(--black-200); padding-bottom: 15px; margin-bottom: 30px; padding-left: 0; padding-right: 0; } .tp_popup_account_status .tp_account_status_chart_data { padding: 20px; } .tp_popup_account_status .tp_account_status_chart_data .label { font-size: 12px; } .tp_popup_account_status .tp_account_status_chart_data .value { font-size: 14px; } .tp_popup_account_status .tp_account_status_chart_part { margin-bottom: 20px; } .tp_popup_account_status .donut_chart_value { font-size: 14px; } @media (min-width: 768px) { .tp_popup_account_settings { padding-top: 30px; padding-bottom: 0; } .tp_popup_account_extra { background: transparent; } .tp_popup_account_extra_inner { padding-top: 40px; padding-bottom: 50px; } .tp_popup_account_extra .vue-slider { margin-bottom: -10px; } .tp_popup_account_extra .form_row { margin-bottom: 0; } } /* Popup: Accounts */ .tp_popup_accounts .__view > div { display: flex; flex-direction: column; } .tp_popup_accounts .tp_popup_inner_scroll { min-height: 350px; flex-grow: 1; } @media (min-width: 768px) { .tp_popup_accounts .tp_account_status_chart_data { background-color: var(--black-100); } } /* Popup: Order */ .tp_popup_order { background-color: var(--black-200); } .tp_popup_order_type { padding: 0 10px 10px; } .tp_popup_order_type .label { font-size: 12px; } .tp_popup_order_type .price { font-size: 24px; } .tp_popup_order_type .tp_order_type_left, .tp_popup_order_type .tp_order_type_right { padding: 19px 20px; border-color: transparent; background-color: var(--black-300); } .tp_popup_order_type .tp_order_type_center { font-size: 14px; letter-spacing: 0; min-width: 70px; } .tp_popup_order_type [type=radio]:checked + .tp_order_type_left { background: rgba(var(--red-rgb), 0.07); border: 1px solid var(--red); color: var(--red); } .tp_popup_order_type [type=radio]:checked + .tp_order_type_right { background: rgba(var(--green-rgb), 0.07); border: 1px solid var(--green); color: var(--green); } .tp_popup_order_tabs .radio { padding: 0; } .tp_popup_order_tabs [type=radio] + label { padding: 15px; font-size: 14px; line-height: 20px; text-transform: uppercase; text-align: center; display: block; color: var(--gray-100); border-bottom: 1px solid var(--gray-200); } .tp_popup_order_tabs [type=radio] + label:before, .tp_popup_order_tabs [type=radio] + label:after { display: none; } .tp_popup_order_tabs [type=radio]:checked + label { color: var(--green); border-bottom-color: var(--green); } .tp_popup_order_tabs [type=radio] + label:hover { background-color: var(--gray-300); } .tp_popup_order_tabs_container { background: var(--black-400); min-height: 0; flex: 1 1 auto; } .tp_popup_order_tabs_container .tp_popup_order_container { background: transparent; } .tp_popup_order_tabs_container .tp_popup_order_extra_item:before { background: var(--black-300); } @media (min-width: 768px) { .tp_popup_order_tabs_container { border-radius: 0px 0px 10px 10px; } } .tp_popup_order_tabs_item { font-size: 12px; font-weight: 700; color: var(--gray-100); text-transform: uppercase; cursor: pointer; position: relative; flex-grow: 1; text-align: center; } .tp_popup_order_tabs_item:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--gray-300); } .tp_popup_order_tabs_item.active { color: var(--green); } .tp_popup_order_tabs_item.active:after { background: var(--green); } .tp_popup_order_tab { display: none; flex: 1 0 auto; } .tp_popup_order_tab.active { display: flex; flex-direction: column; } .tp_popup_order_container { background-color: var(--black-300); min-height: 0; } .tp_popup_order_container .input-spinner:not(.input-spinner-side-tipe) { padding-bottom: 40px; border-bottom: 1px solid var(--black-200); } .tp_popup_order_container .input-switcher { border-bottom: 1px solid #161616; padding-top: 0; padding-bottom: 0; } .tp_popup_order_container .input-switcher label { padding-top: 25px; padding-bottom: 25px; } .tp_popup_order_current_price { text-align: center; background: var(--black-300); border-radius: 20px; padding: 17px; margin-bottom: 20px; } .tp_popup_order_current_price .label { text-transform: uppercase; font-size: 12px; font-weight: 700; margin-bottom: 5px; } .tp_popup_order_current_price .value { font-size: 24px; } .tp_popup_order_subject { border-radius: 20px; border: 1px solid var(--gray-300); } .tp_popup_order_subject .radio { padding: 0; } .tp_popup_order_subject [type=radio] + label { padding: 0; font-size: 12px; font-weight: 700; text-transform: uppercase; text-align: center; display: block; color: var(--gray-200); line-height: 20px; padding: 5px; } .tp_popup_order_subject [type=radio] + label:before, .tp_popup_order_subject [type=radio] + label:after { display: none; } .tp_popup_order_subject [type=radio]:checked + label { color: var(--white); background: var(--gray-300); } .tp_popup_order_subject .col_1 label { border-radius: 20px 0 0 20px; } .tp_popup_order_subject .col_2 label { border-radius: 0 20px 20px 0; } .tp_popup_order_extra { overflow: hidden; position: relative; margin: 0 -30px; } .tp_popup_order_extra_inner { padding: 20px 30px; border-bottom: 1px solid #161616; } .tp_popup_order_extra_item label { font-size: 12px; text-transform: uppercase; color: var(--gray-100); letter-spacing: 0; position: relative; } .tp_popup_order_extra_item { margin-bottom: 5px; } .tp_popup_order_extra_item:last-child { margin-bottom: 0; } .tp_popup_order_extra_price { padding: 40px 0; border-bottom: 1px solid var(--black-200); } .tp_popup_order_extra_price:before { display: none; } .slide-enter-active, .slide-leave-active { transition: all 0.6s ease; } .slide-enter, .slide-leave-to { transform: translateY(-100%); opacity: 0; } .tp_popup_order_extra_item { position: relative; } .tp_popup_order_extra_item:before { content: ""; position: absolute; right: 0; top: 0; bottom: 0; left: -30px; background-color: var(--black-400); border-radius: 0 50px 50px 0; opacity: 0; transition: all 0.15s; } .tp_popup_order_extra_item input { border-color: var(--black-200); background: var(--black-300); } @media (min-width: 768px) { .tp_popup_order_type { padding: 0 20px 10px; } .tp_popup_order_extra_item:hover:before, .tp_popup_order_extra_item.focus:before { opacity: 1; } .tp_popup_order_extra_item .input-spinner-side-tipe .input-spinner-trigger { opacity: 0; visibility: hidden; } .tp_popup_order_extra_item:hover .input-spinner-side-tipe .input-spinner-trigger, .tp_popup_order_extra_item.hover .input-spinner-side-tipe .input-spinner-trigger { opacity: 1; visibility: visible; } } .tp_popup_order_details { position: relative; padding-bottom: 20px; } .tp_popup_order_details_wrapper { overflow: hidden; position: relative; } .tp_popup_order_details:before { content: ""; position: absolute; left: -20px; right: -20px; top: -1px; bottom: -90px; opacity: 0; background: var(--black-200); border-radius: 0 0 10px 10px; } .tp_popup_order_details_label { color: var(--gray-100); text-transform: uppercase; text-align: center; font-weight: 700; letter-spacing: 0; font-size: 12px; position: relative; padding: 20px 0; cursor: pointer; } .tp_popup_order_details_label .icon { position: absolute; right: 0; top: 50%; stroke: var(--gray-100); stroke-width: 3px; transform: translateY(-50%); width: 16px; height: 16px; } .tp_popup_order_details_item { padding: 20px 0; border-top: 1px solid #1f1f1f; } .tp_popup_order_details_item .label { font-size: 16px; text-transform: uppercase; } .tp_popup_order_details_item .value { color: var(--white); } .tp_popup_order_details.open:before { opacity: 1; } .tp_popup_order_details.open .tp_popup_order_details_label { color: var(--white); } .tp_popup_order_details.open .tp_popup_order_details_label .icon { stroke: var(--white); transform: rotate(-180deg) translateY(50%); } @media (min-width: 768px) { .tp_popup_order_details:before { left: -30px; right: -30px; } } .tp_popup_order_button { position: relative; } .tp_popup_order_message { color: var(--gray-200); font-size: 14px; min-height: 200px; max-width: 310px; } .tp_popup_order_line { border-top: 1px solid var(--black-200); transition: all 0.15s; font-size: 14px; position: relative; } .tp_popup_order_line .badge { transition: all 0.15s; min-width: 50px; } .tp_popup_order_line:last-child { border-bottom: 1px solid var(--black-200); } .tp_popup_order_line.radio label { cursor: pointer; } .tp_popup_order_line.radio label:before { display: none; } .tp_popup_order_line.radio [type=radio] + label:after { width: 12px; height: 12px; left: 30px; top: 50%; transform: translateY(-50%); } .tp_popup_order_line [type=radio]:checked + label + .badge { margin-left: 30px; } .tp_popup_order_line.radio:hover { background: var(--black-300); color: var(--green); } .tp_popup_order_history { line-height: 1.4; border-top: 1px solid var(--black-200); border-bottom: 1px solid var(--black-200); background: var(--black-300); } .tp_popup_order_confirmation { background: var(--black-400); border-radius: 0px 0px 10px 10px; border-top: 1px solid var(--gray-300); } .tp_news { width: 100%; flex: 1 1 auto; min-height: 0; } .tp_sidebar_nav { border: 1px solid var(--gray-300); border-radius: 30px; } .tp_sidebar_nav button { width: 32px; height: 32px; background: var(--black-300); } .tp_sidebar_nav button svg { stroke: var(--gray-200); stroke-width: 3; width: 8px; height: 8px; } .tp_sidebar_nav_prev { border-radius: 30px 0 0 30px; } .tp_sidebar_nav_prev svg { transform: rotate(90deg); } .tp_sidebar_nav_next { border-radius: 0 30px 30px 0; } .tp_sidebar_nav_next svg { transform: rotate(-90deg); } .tp_sidebar_nav button:hover { background: var(--gray-300); } .tp_sidebar_nav button:not(:disabled):hover svg { stroke: var(--gray); } .tp_sidebar_nav button:disabled { background: transparent; cursor: default; } .tp_sidebar_nav button:disabled svg { opacity: 0.5; } @media (min-width: 768px) { .tp_sidebar_nav button { width: 22px; height: 22px; } } .tp_calendar { width: 100%; flex: 1 1 auto; min-height: 0; } .tp_sidebar_right_filter { position: relative; } .tp_sidebar_right_filter_trigger { width: 32px; height: 32px; border: 1px solid var(--gray-300); border-radius: 5px; position: relative; z-index: 20; } .tp_sidebar_right_filter_trigger .icon { width: 12px; height: 12px; fill: var(--gray-100); stroke: var(--gray-100); } .tp_sidebar_right_filter_trigger .icon:last-child { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0; } .tp_sidebar_right_filter_trigger:hover .icon { fill: var(--white); stroke: var(--white); } .tp_sidebar_right_filter_dropdown { position: absolute; left: -10px; top: -10px; z-index: 10; transition: all 0.1s; opacity: 0; visibility: hidden; } .tp_sidebar_right_filter_dropdown .dot { margin-left: 0; margin-right: 4px; } .tp_sidebar_right_filter_dropdown .dot:nth-child(3) { margin-right: 10px; } .tp_sidebar_right_filter.active .tp_sidebar_right_filter_trigger .icon:first-child { opacity: 0; } .tp_sidebar_right_filter.active .tp_sidebar_right_filter_dropdown { opacity: 1; visibility: visible; } .tp_sidebar_right_filter.active .tp_sidebar_right_filter_trigger .icon:first-child { opacity: 0; } .tp_sidebar_right_filter.active .tp_sidebar_right_filter_trigger .icon:last-child { opacity: 1; } @media (min-width: 768px) { .tp_sidebar_right_filter_trigger { width: 24px; height: 24px; } } .tp_sidebar_teaser { cursor: pointer; } .tp_sidebar_teaser:hover { background: var(--black-500); } .tp_calendar_item { cursor: pointer; } .tp_calendar_item:hover { background: var(--black-500); } .tp_calendar_item_time { background: var(--black-500); border-top: 1px solid var(--black-200); border-bottom: 1px solid var(--black-200); } .tp_calendar_table th, .tp_calendar_table td { padding: 15px 5px; } .tp_calendar_table th:not(.text-left), .tp_calendar_table td:not(.text-left) { text-align: right; } .tp_calendar_table th:first-child, .tp_calendar_table td:first-child { padding-left: 0; } .tp_calendar_table th:last-child, .tp_calendar_table td:last-child { padding-right: 0; } .tp_calendar_table td { border-bottom: 1px solid var(--black-200); } .tp_calendar_table tr:last-child td { border-bottom: 0; } .tp_sidebar_popup { position: absolute; background: var(--black-600); z-index: 20; } .tp_sidebar_popup .tp_calendar_item:hover { background: transparent; cursor: default; } @media (min-width: 768px) { .tp_sidebar_popup { border-radius: 10px 10px 0px 0px; } } .tp_sidebar_popup_close { width: 30px; height: 30px; position: absolute; right: 11px; top: 13px; cursor: pointer; z-index: 10; } .tp_sidebar_popup_close i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 20px; height: 20px; } .tp_sidebar_popup_close i:before, .tp_sidebar_popup_close i:after { content: ""; width: 20px; height: 2px; background: var(--gray-100); display: block; position: absolute; left: 0; top: 50%; } .tp_sidebar_popup_close i:before { transform: rotate(45deg); } .tp_sidebar_popup_close i:after { transform: rotate(-45deg); } .tp_sidebar_popup_close:hover i:after, .tp_sidebar_popup_close:hover i:before { background: var(--white); } .tp_sidebar_popup .content_scroll_wrapper { width: 100%; } .tp_sidebar_popup_header { border-bottom: 1px solid var(--black-200); min-height: 60px; } .tp_news_item p { margin-bottom: 15px; } .tp_news_item h2 { color: var(--white); font-size: 16px; margin-bottom: 15px; } .tp_news_item_content p, .tp_news_item_content ul { margin-bottom: 10px; } .tp_news_item_content img { margin-bottom: 10px; cursor: pointer; } .tp_news_item_box { background: var(--black-500); border-radius: 10px; } .tp_news_item_box .btn .icon { stroke: var(--gray); } .tp_notifications { min-height: 0; } .tp_notifications_date { background: var(--black-500); } .tp_notifications_item { border-top: 1px solid var(--black-200); border-bottom: 1px solid var(--black-200); } .tp_notifications_item .icon { width: 20px; height: 20px; } .tp_notifications_item_highlighted { background: rgba(var(--green-rgb), 0.05); border-color: rgba(var(--green-rgb), 0.5); } .tp_notifications_item_highlighted hr { border-color: rgba(var(--green-rgb), 0.1); } /**********/ /* Mobile */ /**********/ .tp_mobile > .tp_panel { top: 60px; bottom: 60px; } /*****************/ /* Orders mobile */ /*****************/ .tp_orders_mobile { position: absolute; left: 0; right: 0; top: 60px; bottom: 60px; } .tp_orders_mobile .close .icon { fill: var(--gray-300); stroke: var(--gray-100); } .tp_orders_mobile .close:hover .icon { fill: var(--red); stroke: var(--white); } .tp_orders_mobile .content_scroll_wrapper { flex: 1 1 auto; min-height: 0; } .tp_tabs_container { position: relative; } .tp_orders_mobile_filter { background: var(--black-600); border-radius: 0 0 10px 10px; position: relative; z-index: 10; } .tp_orders_mobile_filter .tp_checkbox_list { background: inherit; border-radius: 0 0 10px 10px; border-top: 1px solid var(--black-300); left: 0; opacity: 0; position: absolute; right: 0; top: 100%; transition: all 0.1s; visibility: hidden; } .tp_orders_mobile_filter .tp_checkbox_list .radio [type=radio] + label, .tp_orders_mobile_filter .tp_checkbox_list .checkbox [type=checkbox] + label { font-size: 14px; padding: 10px 55px 10px 20px; letter-spacing: 0; } .tp_orders_mobile_filter .tp_checkbox_list .radio [type=radio] + label:before, .tp_orders_mobile_filter .tp_checkbox_list .radio [type=radio] + label:after, .tp_orders_mobile_filter .tp_checkbox_list .checkbox [type=checkbox] + label:before { width: 24px; height: 24px; right: 20px; } .tp_orders_mobile_filter.active { border-radius: 0; } .tp_orders_mobile_filter.active .tp_checkbox_list { opacity: 1; visibility: visible; } .tp_orders_mobile_item { background: var(--black-300); border-radius: 10px; max-width: calc(100vw - 20px); } .tp_orders_mobile_item .badge { min-width: 50px; } .tp_orders_mobile_item .badge + div { min-width: 55px; } .tp_orders_mobile_item .close { position: relative; line-height: 0; stroke: var(--gray-100); } .tp_orders_mobile_item .close .icon { position: relative; } .tp_orders_mobile_item .close:before { content: ""; border-radius: 100%; background: var(--gray-300); } .tp_orders_mobile_item .close:hover:before { background: var(--red); } .tp_orders_mobile_teasers { background: var(--black-400); } .tp_orders_mobile_teaser { border-top: 1px solid var(--black-200); border-bottom: 1px solid var(--black-200); background: var(--black-300); } .tp_orders_mobile_tab_footer { border-top-width: 1px; border-top-style: solid; } /* Signals */ .tp_signals { width: 100%; flex: 1 1 auto; min-height: 0; } .tp_signals .tp_sidebar_right_panel_scroll { background-color: var(--black-500); border-top: 1px solid var(--black-200); } .tp_signals_list_item { cursor: pointer; } .tp_signals_list_item strong { display: block; line-height: 1.6; } .tp_signals_list_item:hover { background-color: var(--black-300); } .tp_signals_summary { border-bottom: 1px solid var(--black-200); } .tp_signals_summary .col { border-right: 1px solid var(--black-200); } .tp_signals_summary .col:last-child { border-right: none; } /* Challenge */ .tp_challenge_header { background-color: var(--black-400); } @media (max-width: 767px) { .tp_challenge_header { background-color: var(--black-300); position: absolute; inset: 0 0 auto 40px; z-index: 91; } } .tp_challenge { position: absolute; inset: 0; z-index: 101; translate: 100% 0; transition: translate 0.35s cubic-bezier(0.4, 0, 0.6, 1); will-change: translate; overflow-x: hidden; overflow-y: auto; --webkit-overflow-scrolling: touch; display: grid; grid-template-rows: auto; align-content: start; } .tp_challenge > header { grid-area: 1/1; } .tp_challenge:has(.tp_challenge_confirmation.is-open) .tp_challenge_body { translate: -100% 0; height: 0; opacity: 0; } .tp_challenge.is-open { translate: 0; } @media (min-width: 768px) { .tp_challenge { max-width: 450px; left: auto; } } .tp_challenge_steps { gap: 30px; width: 100%; } .tp_challenge_steps > div { border: 2px dashed var(--gray-200); color: var(--gray-200); font-size: 1.4rem; border-radius: 0.8rem; position: relative; } .tp_challenge_steps > div::before, .tp_challenge_steps > div::after { content: ""; position: absolute; background-color: inherit; } .tp_challenge_steps > div::before { height: 1px; width: 30px; left: 100%; top: 50%; } .tp_challenge_steps > div::after { content: ""; width: 5px; aspect-ratio: 1; border-radius: 100%; right: -35px; top: calc(50% - 2px); } .tp_challenge_steps > div .icon { max-width: 0; } .tp_challenge_steps > div.is-active { background-color: var(--green); color: var(--black-100); border-color: var(--black-100); font-size: 1.6rem; } @media (min-width: 768px) { .tp_challenge_steps > div.is-active { flex-grow: 1; } } .tp_challenge_steps > div.is-active:first-child::before, .tp_challenge_steps > div.is-active:first-child::after { display: none; } .tp_challenge_steps > div.is-active ~ div { border-color: var(--green); color: var(--green); } .tp_challenge_steps > div.is-active ~ div .icon { max-width: unset; margin-left: 1rem; } .tp_challenge_body { grid-area: 2/1; transition: all 0.35s cubic-bezier(0.4, 0, 0.6, 1); } .tp_challenge_confirmation { grid-area: 2/1; translate: 100% 0; transition: all 0.35s cubic-bezier(0.4, 0, 0.6, 1); } .tp_challenge_confirmation.is-open { translate: 0 0; } .tp_challenge_faq .faq-section { color: #ffffff; font-family: Arial, sans-serif; line-height: 1.6; } .tp_challenge_faq .faq-header h2 { font-size: 20px; font-weight: 700; margin-bottom: 5px; } .tp_challenge_faq .faq-header p { font-size: 16px; color: #aaaaaa; margin-bottom: 20px; } .tp_challenge_faq .faq-item h3 { font-size: 18px; font-weight: 700; color: #00ff00; margin-bottom: 10px; } .tp_challenge_faq .faq-item p { font-size: 14px; font-weight: 400; color: #ffffff; margin-bottom: 10px; } .tp_challenge_faq .faq-item p strong.color-green { color: #00ff00; } .tp_challenge_faq .faq-item p strong.color-gray { color: #aaaaaa; } .tp_challenge_faq .faq-close { position: absolute; right: 10px; } .tp_challenge_faq .faq-answer { color: #A1A1A1 !important; } .tp_challenge_faq .faq-question { position: relative; padding-left: 10px; } .tp_challenge_faq .faq-question::before { content: "•"; position: absolute; left: 0; color: #fff; font-size: 14px; line-height: 1.5; } .tp_account_settings > .btn { z-index: 1; } .tp_account_settings ul { position: absolute; right: 1px; top: -10px; transition: all 0.25s cubic-bezier(0.4, 0, 0.6, 1); transform-origin: calc(100% - 15px) top; clip-path: inset(0 0 0 0); } .tp_account_settings ul .icon:not(.icon-green) { fill: currentColor; } .tp_account_settings li:not(:first-child):not(:last-child) { border-bottom-width: 1px; border-style: solid; } .tp_account_settings button:hover { color: var(--white); } .tp_account_settings:not(:hover) ul { opacity: 0; visibility: hidden; scale: 0.9; clip-path: inset(15px 15px 100% 100%); pointer-events: none; } .tp_account_settings:hover { z-index: 3; } .tp_account_settings:hover > .btn { background-color: transparent; } .tp_account_settings:hover > .btn .icon { fill: var(--green); } @media (min-width: 768px) { .tp_account_settings ul { top: -14px; } } .marathon-page { margin-top: -20px; background-color: var(--alabaster-solid); } .marathon-page .btn-link .icon { height: 20px; width: 20px; } .main-hero__wrap { z-index: 1; position: relative; } .marathon-head-block { display: flex; flex-direction: column; } @media (min-width: 576px) { .marathon-head-block { flex-direction: row; } } .marathon-head-block-img { display: none; } @media (min-width: 576px) { .marathon-head-block-img { background: radial-gradient(50% 50% at 50% 50%, rgba(0, 0, 0, 0) 0%, #0E0E0E 100%), url("/images/bg/marathon-city.png"); opacity: 0.64; width: 1600px; height: 889px; position: absolute; display: block; top: 337px; left: -46px; -o-object-fit: none; object-fit: none; } } .marathon-head-block-img-light { display: none; } @media (min-width: 576px) { .marathon-head-block-img-light { background: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0) 0%, #FAFAFA 100%), url("/images/bg/marathon-city-light.png"); width: 1600px; height: 889px; position: absolute; display: block; top: 337px; left: -46px; -o-object-fit: none; object-fit: none; } } .marathon-title { font-size: 48px; color: var(--white); letter-spacing: 0; font-weight: 700; line-height: 56px; max-width: 308px; } @media (min-width: 576px) { .marathon-title { max-width: unset; font-size: 64px; line-height: 75px; } } .green-ticket-icon-wrap { margin-top: 3px; height: 64px; min-width: 64px; flex-basis: 64px; margin-right: 16px; } @media (min-width: 576px) { .green-ticket-icon-wrap { margin-right: 25px; } } .green-ticket-icon { width: 100%; height: 100%; } .ticket-title { font-weight: 400; font-size: 20px; line-height: 23px; opacity: 0.64; color: var(--gray); } .ticket-title span { color: var(--white); } @media (min-width: 576px) { .ticket-title { font-size: 24px; line-height: 28px; } } .ticket-text { width: -moz-fit-content; width: fit-content; border-radius: 16px; background: rgba(54, 192, 6, 0.06); } .ticket-text p { font-size: 24px; } .marathon-prize { margin-left: -6px; margin-top: 29px; } @media (min-width: 576px) { .marathon-prize { margin-top: 67px; margin-bottom: 67px; margin-left: 0; } } .marathon-prize-fund { font-weight: 400; font-size: 32px; opacity: 0.88; color: var(--white); margin-right: 6px; } @media (min-width: 576px) { .marathon-prize-fund { margin-right: 47px; } } .marathon-prize-fund-cash-wrap { position: relative; } .marathon-prize-fund-cash { font-size: 48px; font-weight: 700; margin-left: -4px; color: var(--lima); } @media (min-width: 576px) { .marathon-prize-fund-cash { font-weight: 900; line-height: 56px; } } .marathon-prize-fund-cash--bg { position: absolute; font-weight: 900; font-size: 128px; line-height: 150px; letter-spacing: -0.04em; color: rgba(92, 224, 46, 0.06); width: 270%; left: -171px; top: -14px; text-wrap: nowrap; } @media (min-width: 768px) { .marathon-prize-fund-cash--bg { left: -33px; top: -69px; } } .marathon-prize-fund-cash-light { position: absolute; top: -30px; left: 68px; width: 96px; height: 96px; background: #5CE02E; filter: blur(128px); } .list-of-participants { position: relative; top: 56rem; z-index: 1; } @media (min-width: 768px) { .list-of-participants { position: static; } } .list-of-participants__arrow { margin-left: 2px; margin-right: 18px; width: 20px !important; height: 14px !important; } .list-of-participants__text { font-style: normal; font-weight: 700; font-size: 24px; line-height: 28px; color: #5CE02E; } .marathon-img-1-wrap { position: relative; height: 400px; margin-bottom: 170px; margin-right: -15em; right: -3em; } @media (min-width: 768px) { .marathon-img-1-wrap { height: 270px; margin-bottom: 170px; margin-right: 0; margin-left: -14em; right: -4em; } } .marathon-img-1-wrap__text { width: -moz-fit-content; width: fit-content; border-radius: 16px; background: rgba(54, 192, 6, 0.06); position: absolute; top: 7em; left: -3.5em; } @media (min-width: 768px) { .marathon-img-1-wrap__text { top: 9em; left: 20em; text-wrap: nowrap; } } .marathon-img-1-wrap__text span:first-child { font-weight: 700; font-size: 24px; } @media (min-width: 768px) { .marathon-img-1-wrap__text span:first-child { font-size: 28px; } } .marathon-img-1-wrap__text span:last-child { font-weight: 800; font-size: 35px; } @media (min-width: 768px) { .marathon-img-1-wrap__text span:last-child { font-size: 42px; } } .marathon-img-1-wrap img:first-child { position: relative; } .marathon-img-1-wrap img:last-child { position: absolute; width: 227px; top: 25em; left: 6em; } @media (min-width: 768px) { .marathon-img-1-wrap img:last-child { height: 249px; width: 464px; top: 160%; left: 18%; } } .marathon-img-1-wrap:before { content: ""; position: absolute; right: 30em; bottom: 0; width: 96px; height: 96px; background: #5CE02E; filter: blur(128px); } @media (min-width: 768px) { .marathon-img-1-wrap:before { right: 0; bottom: -19em; } } .marathon-card-list { gap: 12px; } @media (min-width: 768px) { .marathon-card-list { gap: 0; } } .btn-link .arrow-down-take-part-icon { margin-right: 20px !important; height: 12px; } .intro-13-card { min-height: 609px; padding: 32px 48px; display: flex; flex-direction: column; } @media (min-width: 768px) { .intro-13-card { padding: 64px 64px; } } .intro-13-card__title { font-weight: 700; font-size: 36px; line-height: 42px; opacity: 0.88; color: var(--white); letter-spacing: 0; margin-bottom: 33px; } .intro-13-card__description { font-weight: 400; font-size: 18px; line-height: 21px; opacity: 0.64; color: var(--white); margin-bottom: 70px; } .intro-13-card__small-description { font-weight: 400; font-size: 12px; line-height: 14px; color: var(--white); opacity: 0.24; letter-spacing: 0; margin-bottom: 49px; } .intro-13-card__cta-btn { max-width: 256px; } .condition-list-title { font-weight: 700; font-size: 18px; line-height: 21px; opacity: 0.88; color: var(--white); margin-bottom: 25px; } .condition-list { list-style: disc; margin-left: 27px; margin-bottom: 10px; flex-grow: 1; } .condition-list__item { font-size: 12px; margin-bottom: 0; } .condition-list__item:first-child { margin-bottom: 33px; } .condition-list__item-label { font-weight: 400; font-size: 18px; line-height: 21px; color: var(--white); opacity: 0.64; } .condition-list__item-label .promocode { color: #36C006; font-style: normal; font-weight: 700; line-height: normal; text-decoration-line: underline; text-decoration-style: dotted; -webkit-text-decoration-skip-ink: none; text-decoration-skip-ink: none; text-decoration-thickness: auto; text-underline-offset: auto; text-underline-position: from-font; } #participant .flickity-page-dots { margin-top: 12px; } #participant .flickity-button { display: none; } .prize-number-block { padding-top: 30px; } .prize-number-title { font-style: normal; font-weight: 700; font-size: 24px; line-height: 28px; color: var(--lima); letter-spacing: 0; } @media (min-width: 576px) { .prize-number-title { display: none; } } .prize-number-box { padding: 48px 32px 69px; margin-left: -10px; margin-right: -10px; font-weight: 400; font-size: 18px; line-height: 21px; margin-bottom: 34px; } .prize-number-box__first-text, .prize-number-box__second-text { opacity: 0.64; } .prize-number-box__btn svg { height: 14px !important; width: 14px !important; margin-left: 4px; margin-right: 22px; } .prize-number-box__btn strong { font-weight: 700; font-size: 24px; line-height: 28px; color: #5CE02E; } .places-block { padding-top: 340px; padding-bottom: 256px; } @media (max-width: 767.98px) { .places-block { padding: 128px 0; } } .places-block__title { font-size: 36px; line-height: 42px; opacity: 0.88; color: var(--white); letter-spacing: 0; font-weight: 700; margin-bottom: 48px; } @media (max-width: 767.98px) { .places-block__title { text-align: center; font-size: 48px; line-height: 56px; margin-bottom: 80px; } } .places-block__container { position: relative; } @media (min-width: 576px) { .places-block__container { padding-left: unset; } } .places-block__card-group { display: flex; flex-direction: column; } @media (min-width: 768px) { .places-block__card-group { flex-direction: row; gap: 30px; } } @media (min-width: 768px) { .places-block__card-group { flex-wrap: wrap; } } .places-block__card-group:not(:last-child) { margin-bottom: 32px; } .places-block__card { background: var(--white); } .places-block__card:not(:last-child) { margin-bottom: 24px; } @media (min-width: 576px) { .places-block__card:not(:last-child) { margin-bottom: unset; } } .places-block__card-last { display: none; border-radius: 24px; border: 3px dashed rgba(92, 224, 46, 0.48); background: rgba(92, 224, 46, 0.02) !important; align-items: center; justify-content: center; padding: 0 !important; } @media (min-width: 768px) { .places-block__card-last { display: flex; } } .places-block__card-part:not(:last-child) { margin-bottom: 12px; } @media (min-width: 576px) { .places-block__card-part:not(:last-child) { margin-bottom: unset; } } .places-block__take-part-anchor { align-items: center; justify-content: center; padding: 0 !important; } .places-block__take-part-anchor-mobile { margin: 46px 4px 128px; } @media (min-width: 576px) { .places-block__take-part-anchor-mobile { display: none !important; } } .places-block__take-part-anchor-mobile strong { font-style: normal; font-weight: 700; font-size: 24px !important; line-height: 28px; color: #5CE02E; } @media (max-width: 767.98px) { .places-block .flickity_carousel:after { content: "flickity"; display: none; } } .participant-block { background: #111 !important; padding: 256px 0; } @media (max-width: 767.98px) { .participant-block { padding: 128px 0; } } .participant-block__title { font-size: 36px; line-height: 42px; opacity: 0.88; color: var(--white); letter-spacing: 0; margin-bottom: 33px; } @media (min-width: 768px) { .participant-block__title { font-weight: 700; font-size: 48px; line-height: 56px; margin-bottom: 47px; } } .participant-block__description { font-style: normal; font-weight: 400; font-size: 18px; line-height: 21px; color: rgba(255, 255, 255, 0.64); margin-bottom: 88px; } @media (min-width: 768px) { .participant-block__description { margin-bottom: 108px; } } .participant-block .intro-cards { padding-bottom: 110px; } .participant-block .intro-cards__col { padding-left: 12px; padding-right: 12px; } .participant-block .card { position: relative; border-radius: 24px; } .participant-block .card:before { border-radius: 24px 24px 0 0; bottom: 100%; content: ""; height: 12px; left: 8%; position: absolute; width: 37%; } .participant-block .card-1:before { background: var(--white); } .participant-block .card-2:before { background: var(--green); } .participant-block .flickity-viewport { width: 100%; } .participant-block .flickity_carousel { position: relative; } .participant-block .flickity_carousel .flickity-prev-next-button.previous { left: 0; } .participant-block .flickity_carousel .flickity-prev-next-button.next { right: 0; } @media (max-width: 767.98px) { .participant-block .flickity_carousel:after { content: "flickity"; display: none; } } .marathon-intro { padding-top: 130px; } .marathon-intro__content { padding-top: 128px; } .marathon-intro__content .page_bg { margin-top: -45px; margin-left: -100px; min-width: 1500.571px; min-height: 1448.286px; flex-shrink: 0; } @media (max-width: 767.98px) { .marathon-intro__content .page_bg { top: 10%; left: -55%; min-width: 879px; min-height: 848px; } } .marathon-intro__content .marathon-title { font-size: 64px; font-weight: 700; line-height: normal; letter-spacing: unset; max-width: unset; padding: 0 50px; } @media (max-width: 767.98px) { .marathon-intro__content .marathon-title { padding: 0; } } .marathon-intro__content .ticket-title { padding: 0; font-size: 24px; font-weight: 400; } .marathon-intro__content .ticket-title .promocode { color: #36C006; font-size: 24px; font-weight: 400; } .marathon-intro__content .places_list { position: relative; width: 100%; height: 100%; margin-top: 54px; margin-bottom: 500px; } @media (max-width: 767.98px) { .marathon-intro__content .places_list { margin-bottom: 300px; } } .marathon-intro__content .places_list:before { content: ""; position: absolute; top: 40rem; left: 20rem; width: 722px; height: 192px; flex-shrink: 0; background: #36C006; filter: blur(256px); border-radius: 722px; } @media (max-width: 767.98px) { .marathon-intro__content .places_list:before { content: ""; position: absolute; top: 26rem; left: 8rem; filter: blur(88px); width: 249.153px; height: 66.257px; } } .marathon-intro__content .places_list_1-wrap__text { width: -moz-fit-content; width: fit-content; padding: 18px 80px 18px 24px; border-radius: 16px; background: rgba(54, 192, 6, 0.06); position: absolute; top: 10.5em; left: -7em; } .marathon-intro__content .places_list_1-wrap__text span:first-child { color: var(--white); font-weight: 700; font-size: 36px; line-height: 48px; } .marathon-intro__content .places_list_1-wrap__text span:last-child { font-weight: 800; font-size: 32px; line-height: 40px; color: #36C006; } @media (max-width: 767.98px) { .marathon-intro__content .places_list_1-wrap__text { padding: 8px 40px 8px 6px; border-radius: 4.141px; top: 10.5em; left: 2em; } .marathon-intro__content .places_list_1-wrap__text span:first-child { font-size: 12.423px; line-height: 16.564px; } .marathon-intro__content .places_list_1-wrap__text span:last-child { font-size: 11.043px; line-height: 13.804px; } } .marathon-intro__content .places_list_1-img { position: absolute; top: 22.5rem; left: -1.5rem; } @media (max-width: 767.98px) { .marathon-intro__content .places_list_1-img { width: 70%; height: 70%; top: 18rem; left: -0.5rem; } } .marathon-intro__content .places_list_2-wrap__text { width: -moz-fit-content; width: fit-content; text-align: right; padding: 18px 24px 18px 60px; border-radius: 16px; background: rgba(54, 192, 6, 0.06); position: absolute; top: 24.5em; right: -5.5em; } .marathon-intro__content .places_list_2-wrap__text span:first-child { color: var(--white); font-weight: 700; font-size: 36px; line-height: 48px; } .marathon-intro__content .places_list_2-wrap__text span:last-child { font-weight: 800; font-size: 32px; line-height: 40px; color: #36C006; } @media (max-width: 767.98px) { .marathon-intro__content .places_list_2-wrap__text { padding: 8px 35px 8px 6px; border-radius: 4.141px; text-align: left; top: 23.5em; right: -0.5em; } .marathon-intro__content .places_list_2-wrap__text span:first-child { font-size: 12.423px; line-height: 16.564px; } .marathon-intro__content .places_list_2-wrap__text span:last-child { font-size: 11.043px; line-height: 13.804px; } } .marathon-intro__content .places_list_2-img { position: absolute; right: 5%; } @media (max-width: 767.98px) { .marathon-intro__content .places_list_2-img { width: 60%; height: 60%; top: 21rem; right: -5%; } } .marathon-intro__content .places_list_3-wrap__text { width: -moz-fit-content; width: fit-content; padding: 18px 90px 18px 24px; border-radius: 16px; background: rgba(54, 192, 6, 0.06); position: absolute; top: 36.5em; left: 21em; } .marathon-intro__content .places_list_3-wrap__text span:first-child { color: var(--white); font-weight: 700; font-size: 36px; line-height: 48px; } .marathon-intro__content .places_list_3-wrap__text span:last-child { font-weight: 800; font-size: 32px; line-height: 40px; color: #36C006; } @media (max-width: 767.98px) { .marathon-intro__content .places_list_3-wrap__text { padding: 8px 35px 8px 6px; border-radius: 4.141px; text-align: left; top: 26em; left: 3em; } .marathon-intro__content .places_list_3-wrap__text span:first-child { font-size: 12.423px; line-height: 16.564px; } .marathon-intro__content .places_list_3-wrap__text span:last-child { font-size: 11.043px; line-height: 13.804px; } } .marathon-intro__content .places_list_3-img { position: absolute; top: 31rem; left: 50rem; } @media (max-width: 767.98px) { .marathon-intro__content .places_list_3-img { width: 40%; height: 40%; top: 26.5rem; left: 9.5rem; } } .marathon-intro__content .prize_fund { position: relative; } .marathon-intro__content .prize_fund p { margin: 0; } .marathon-intro__content .prize_fund .title { color: var(--white); font-size: 32px; font-weight: 400; z-index: 1; } @media (max-width: 767.98px) { .marathon-intro__content .prize_fund .title { font-size: 24px; } } .marathon-intro__content .prize_fund .sum { font-size: 48px; font-weight: 900; color: #36C006; z-index: 1; } .marathon-intro__content .prize_fund .bg_sum { position: absolute; top: -7%; left: 36%; font-size: 128px; font-weight: 900; letter-spacing: -4%; color: rgba(54, 192, 6, 0.0588235294); text-wrap: nowrap; } @media (max-width: 767.98px) { .marathon-intro__content .prize_fund .bg_sum { top: -20%; left: -10%; } } @media (min-width: 768px) { .marathon-intro__content .list-of-participants { position: relative; top: 20rem; } } @media (max-width: 767.98px) { .marathon-intro__content .list-of-participants { top: 6rem; } } .intro_15 { margin-top: -100px; } .intro_15 .places_list { position: relative; width: 100%; height: 100%; margin-bottom: 500px; z-index: 1; } .intro_15 .places_list:before { content: ""; position: absolute; top: 0; right: 20rem; width: 407px; height: 108px; flex-shrink: 0; background: #36C006; filter: blur(144px); border-radius: 407px; } @media (max-width: 767.98px) { .intro_15 .places_list:before { display: none; } } .intro_15 .places_list_1-wrap__text { width: -moz-fit-content; width: fit-content; padding: 10px 50px 10px 13px; border-radius: 6px; background: rgba(54, 192, 6, 0.06); position: absolute; top: -9em; left: 21em; } .intro_15 .places_list_1-wrap__text span:first-child { color: var(--white); font-weight: 700; font-size: 20px; line-height: 27px; } .intro_15 .places_list_1-wrap__text span:last-child { font-weight: 800; font-size: 18px; line-height: 22px; color: #36C006; } @media (max-width: 767.98px) { .intro_15 .places_list_1-wrap__text { padding: 8px 30px 8px 6px; border-radius: 4.141px; top: -10em; left: 1em; } .intro_15 .places_list_1-wrap__text span:first-child { font-size: 12.423px; line-height: 16.564px; } .intro_15 .places_list_1-wrap__text span:last-child { font-size: 11.043px; line-height: 13.804px; } } .intro_15 .places_list_1-img { position: absolute; top: -15rem; right: 10rem; } .intro_15 .places_list_1-img img { width: 60%; height: 60%; } @media (max-width: 767.98px) { .intro_15 .places_list_1-img { top: -10rem; left: -1rem; right: -3rem; } .intro_15 .places_list_1-img img { width: 60%; height: 60%; } } .intro_15 .places_list_2-wrap__text { width: -moz-fit-content; width: fit-content; text-align: right; padding: 10px 13px 10px 30px; border-radius: 6px; background: rgba(54, 192, 6, 0.06); position: absolute; top: 3rem; right: 1rem; } .intro_15 .places_list_2-wrap__text span:first-child { color: var(--white); font-weight: 700; font-size: 20px; line-height: 27px; } .intro_15 .places_list_2-wrap__text span:last-child { font-weight: 800; font-size: 18px; line-height: 22px; color: #36C006; } @media (max-width: 767.98px) { .intro_15 .places_list_2-wrap__text { padding: 8px 15px 8px 6px; border-radius: 4.141px; text-align: left; top: -9em; right: 1.5em; } .intro_15 .places_list_2-wrap__text span:first-child { font-size: 12.423px; line-height: 16.564px; } .intro_15 .places_list_2-wrap__text span:last-child { font-size: 11.043px; line-height: 13.804px; } } .intro_15 .places_list_2-img { position: absolute; right: -15rem; top: -17rem; } .intro_15 .places_list_2-img img { width: 60%; height: 60%; } @media (max-width: 767.98px) { .intro_15 .places_list_2-img { top: -9rem; right: -12rem; left: 14rem; } } .intro_15 .places_list_3-wrap__text { width: -moz-fit-content; width: fit-content; padding: 10px 60px 10px 13px; border-radius: 6px; background: rgba(54, 192, 6, 0.06); position: absolute; top: 12rem; right: 39rem; } .intro_15 .places_list_3-wrap__text span:first-child { color: var(--white); font-weight: 700; font-size: 20px; line-height: 27px; } .intro_15 .places_list_3-wrap__text span:last-child { font-weight: 800; font-size: 18px; line-height: 22px; color: #36C006; } @media (max-width: 767.98px) { .intro_15 .places_list_3-wrap__text { padding: 8px 6px 8px 35px; border-radius: 4.141px; text-align: right; top: 3.5em; right: 0em; } .intro_15 .places_list_3-wrap__text span:first-child { font-size: 12.423px; line-height: 16.564px; } .intro_15 .places_list_3-wrap__text span:last-child { font-size: 11.043px; line-height: 13.804px; } } .intro_15 .places_list_3-img { position: absolute; top: -9rem; right: 5rem; } .intro_15 .places_list_3-img img { width: 60%; height: 60%; } @media (max-width: 767.98px) { .intro_15 .places_list_3-img { top: -5rem; right: -3rem; left: 13rem; } } .intro_15 .intro-15-card_content { width: 60%; } @media (max-width: 767.98px) { .intro_15 .intro-15-card_content { width: 100%; } } .intro_15 .intro-15-card_img { width: 40%; } .intro_15 .intro-15-card_img .card-img { position: absolute; top: -35%; right: -5%; } .intro_15 .intro-15-card_img .card-img img { width: 80%; height: 80%; } @media (max-width: 767.98px) { .intro_15 .intro-15-card_img { width: 0; } .intro_15 .intro-15-card_img .card-img { top: -35%; right: -90%; } .intro_15 .intro-15-card_img .card-img img { width: 40%; height: 40%; } } .intro_15 .intro-15-card:before { width: 15%; left: 4%; } .rules .rules_title { color: var(--white); font-size: 32px; font-weight: 500; line-height: 32px; } .rules .rules_point { color: var(--white); font-size: 20px; font-weight: 700; line-height: 140%; } .rules ul { padding-left: 25px; list-style: disc; } .rules ul li { padding-left: 0; margin-bottom: 0; position: relative; } .rules ul li:before { content: none; } .make-money-card { display: flex; flex-direction: column; min-width: 335px; height: 602px; background: rgba(255, 255, 255, 0.02); mix-blend-mode: normal; border-radius: 24px; align-items: center; padding: 0 20px 20px; } @media (min-width: 1200px) { .make-money-card { flex-direction: row; height: auto; justify-content: space-around; } } .make-money-card__top-img { margin-top: -120px; margin-bottom: 40px; align-self: center; } .make-money-card__title-and-description { display: flex; flex-direction: column; align-items: center; text-align: center; } .make-money-card__title { font-weight: 700; font-size: 36px; line-height: 42px; color: var(--white); letter-spacing: 0; } .make-money-card__title div { color: var(--lima) !important; } .make-money-card__description { max-width: 170px; font-weight: 300; font-size: 18px; line-height: 18px; color: var(--dove-gray); margin: 22px 0 48px !important; } .make-money-card__btn-and-store { display: flex; flex-direction: column; } .make-money-card__btn { order: -1; display: inline-flex; align-items: center; justify-content: center; width: 295px; height: 60px; background: rgba(92, 224, 46, 0.05); border: 0.5px solid rgba(92, 224, 46, 0.3); border-radius: 5px; font-weight: 700; font-size: 18px; line-height: 21px; text-transform: uppercase; color: #5CE02E; margin-bottom: 20px; } @media (min-width: 1200px) { .make-money-card__btn { margin-top: 20px; order: 2; } } .make-money-card__store-list { display: flex; justify-content: space-between; align-self: stretch; max-height: 40px; } .make-money-card__store-google { -o-object-fit: cover; object-fit: cover; } .place-card { display: flex; flex-direction: column; position: relative; width: 362px; height: 210px; background: var(--gallery-approx); border-radius: 24px; } @media (max-width: 991.98px) { .place-card { width: 100%; } } .place-card__title { font-weight: 700; font-size: 24px; line-height: 28px; opacity: 0.88; color: var(--white); margin-bottom: 31px; } .place-card__prize { font-weight: 700; color: var(--lima); letter-spacing: 0; font-size: 30px; margin-bottom: -11px; } .place-card__prize small { font-size: 24px; text-transform: uppercase; } .place-card__prize .quantity { color: #E2E2E2 !important; font-size: 48px; font-weight: 700; } .place-card__description { font-weight: 400; line-height: 14px; opacity: 0.64; color: var(--white); } .place-card--all { display: none; max-height: 210px; margin-left: -28px; } @media (min-width: 576px) { .place-card--all { margin-left: unset; } } .place-card__image { position: absolute; width: 87px; height: 110px; right: 30px; top: 39px; bottom: unset !important; left: unset !important; } .marathon-page_kh .page_bg { margin-top: 300px; min-width: 1920px; min-height: 1036px; flex-shrink: 0; } @media (max-width: 767.98px) { .marathon-page_kh .page_bg { margin-top: 0; fill: rgba(54, 192, 6, 0.24); mix-blend-mode: hard-light; filter: blur(116.6054763794px); } } .marathon-page_kh .prize { margin-top: 64px; } .marathon-page_kh .prize .prize_img { display: flex; justify-content: center; margin-top: 300px; } .marathon-page_kh .prize .prize_img .img { position: absolute; bottom: -20px; } .marathon-page_kh .prize .prize_img .img img { width: 100%; height: 100%; } @media (max-width: 767.98px) { .marathon-page_kh .prize .prize_img { margin-top: 500px; } .marathon-page_kh .prize .prize_img .bg { display: none; } } .marathon-page_kh .prize .bg_sum { top: -1%; } @media (max-width: 767.98px) { .marathon-page_kh .prize .bg_sum { top: -2%; left: 0; } } .marathon-page_kh .intro_15 { margin: 200px 0; } @media (max-width: 767.98px) { .marathon-page_kh .places-block { padding-top: 200px; padding-bottom: 50px; } } @media (max-width: 767.98px) { .marathon-page_kh .participant-block { padding-bottom: 50px; } } /* Inverted */ .inverted .places_list:before { display: none; } .inverted .places_list_1-wrap__text { background: #36C006; } .inverted .places_list_1-wrap__text span:last-child { color: #FFF !important; } .inverted .places_list_2-wrap__text { background: #36C006; } .inverted .places_list_2-wrap__text span:last-child { color: #FFF !important; } .inverted .places_list_3-wrap__text { background: #36C006; } .inverted .places_list_3-wrap__text span:last-child { color: #FFF !important; } .inverted .place-card { background: #FFF; box-shadow: 0px 0px 48px 0px rgba(0, 0, 0, 0.06); } .inverted .place-card .quantity { color: #1A1A1A !important; } .inverted .participant-block { background: #F0F0F0 !important; } .inverted .intro-13-card { background: #FFF; box-shadow: 0px 0px 48px 0px rgba(0, 0, 0, 0.06); } .inverted .prize-number-box { background: #FFF; box-shadow: 0px 0px 48px 0px rgba(0, 0, 0, 0.06); } .inverted .hero_11 .search_form { background: #FFF; box-shadow: 0px 0px 48px 0px rgba(0, 0, 0, 0.06); } .gifts-page .bg-gifts-hero { background-image: url("/images/bg/gifts-hero-bg.jpg"), url("/images/svg/green-background.png"); background-size: cover, cover; background-position: center, center; background-repeat: no-repeat, no-repeat; } @media (max-width: 767px) { .gifts-page .bg-gifts-hero { background-size: cover, cover; background-position: center, center; } } .gifts-page #gifts-hero { padding-top: 120px !important; } @media (max-width: 767px) { .gifts-page #gifts-hero { padding-top: 80px !important; } } .inverted .gifts-page .bg-gifts-hero { background-image: none !important; } .gifts-page .bg-cta-decorative { background-image: url("/images/bg/cta-bg.jpg"); background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; min-height: 100vh; } .gifts-page .bg-cta-decorative::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 200vh; background-image: url("/images/svg/green-background.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; z-index: 0; pointer-events: none; } .gifts-page .bg-cta-decorative > * { position: relative; z-index: 1; } @media (max-width: 767px) { .gifts-page .bg-cta-decorative { min-height: auto; } .gifts-page .bg-cta-decorative::before { height: 150vh; } } .inverted .gifts-page .bg-cta-decorative { background-image: none !important; } .inverted .gifts-page .bg-cta-decorative::before { background-image: none !important; } .gifts-page .bg-awards { background: #131313; } .gifts-page .decorative-gradient-1 { background: radial-gradient(ellipse 50% 101.3% at 101.3% 50%, #204512 0%, #0E0E0E 100%); transform: rotate(180deg); transform-origin: top left; } .gifts-page .decorative-gradient-2 { background: radial-gradient(ellipse 50% 101.3% at -1.3% 50%, #204512 0%, #0E0E0E 100%); transform: rotate(180deg); transform-origin: top left; } .gifts-page .decorative-gradient-green-1 { background: radial-gradient(ellipse 50% 101.3% at 101.3% 50%, #36C006 0%, #204512 100%); transform: rotate(180deg); transform-origin: top left; } .gifts-page .decorative-gradient-green-2 { background: radial-gradient(ellipse 50% 101.3% at -1.3% 50%, #36C006 0%, #204512 100%); transform: rotate(180deg); transform-origin: top left; } .gifts-page .decorative-blur-1 { background: rgba(54, 192, 6, 0.24); mix-blend-mode: hard-light; filter: blur(196.99px); box-shadow: 393.9715881348px 393.9715881348px 393.9715881348px; } .gifts-page .decorative-blur-2 { background: rgba(54, 192, 6, 0.16); mix-blend-mode: hard-light; filter: blur(37px); box-shadow: 74px 74px 74px; } .gifts-page .decorative-blur-green-1 { background: rgba(54, 192, 6, 0.24); mix-blend-mode: normal; filter: blur(196.99px); box-shadow: 393.9715881348px 393.9715881348px 393.9715881348px rgba(54, 192, 6, 0.3); } .gifts-page .decorative-blur-green-2 { background: rgba(54, 192, 6, 0.16); mix-blend-mode: normal; filter: blur(37px); box-shadow: 74px 74px 74px rgba(54, 192, 6, 0.2); } .gifts-page .custom-carousel { width: 100%; } .gifts-page .carousel-wrapper { width: 100%; position: relative; } .gifts-page .carousel-track { transition: transform 0.3s ease-in-out; touch-action: pan-y pinch-zoom; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .gifts-page .carousel-slide { padding: 0 12px; box-sizing: border-box; pointer-events: auto; } .gifts-page .carousel-track-width { width: 500%; } .gifts-page .carousel-slide-width { width: 20%; } .gifts-page .carousel-position-0 { transform: translateX(0%); } .gifts-page .carousel-position-1 { transform: translateX(-20%); } .gifts-page .carousel-position-2 { transform: translateX(-40%); } .gifts-page .carousel-position-3 { transform: translateX(-60%); } .gifts-page .carousel-position-4 { transform: translateX(-80%); } .gifts-page .gift-carousel-pagination { margin-top: 32px; } .gifts-page .pagination-container { display: flex; gap: 32px; align-items: center; justify-content: center; } .gifts-page .pagination-dot { width: 12px; height: 12px; border-radius: 50%; background-color: #1A1A1A; cursor: pointer; transition: all 0.3s ease; position: relative; } .gifts-page .pagination-dot.active { background-color: #36C006; } .gifts-page .pagination-dot:hover { opacity: 0.8; } .gifts-page .gift-image-container { height: 360px; position: relative; overflow: hidden; border-radius: 12px; } .gifts-page .info-box { background: #1A1A1A; border-radius: 24px; padding: 32px 64px; display: flex; align-items: center; gap: 24px; flex-direction: row; } .gifts-page .info-icon-container { width: 48px; height: 48px; position: relative; overflow: hidden; } .gifts-page .info-title { color: #36C006; font-size: 32px; font-weight: 700; height: 64px; display: flex; flex-direction: column; justify-content: center; } .gifts-page .info-description { color: #A1A1A1; font-size: 20px; font-weight: 400; line-height: 24px; } .gifts-page .cta-btn { background: rgba(54, 192, 6, 0.06); border-radius: 6px; border: 1.5px solid rgba(54, 192, 6, 0.48); padding: 20px 64px; display: flex; align-items: center; justify-content: center; gap: 12px; transition: all 0.3s ease; } .gifts-page .cta-btn:hover { background: rgba(54, 192, 6, 0.12); border-color: rgba(54, 192, 6, 0.7); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(54, 192, 6, 0.3); } .gifts-page .cta-btn-text { color: #36C006; font-size: 18px; font-weight: 700; text-transform: uppercase; } .gifts-page .award-item { display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; padding: 16px; border-radius: 16px; position: relative; } .gifts-page .award-item:hover { transform: scale(1.05); background: rgba(54, 192, 6, 0.08); } .gifts-page .award-item:hover .award-image { filter: grayscale(0%) brightness(1) opacity(1); } .gifts-page .award-image { height: auto; -o-object-fit: contain; object-fit: contain; transition: filter 0.3s ease; filter: grayscale(80%) brightness(0.6) opacity(0.7); } .gifts-page .filter-gray-icon { filter: brightness(0) saturate(100%) invert(89%) sepia(0%) saturate(0%) hue-rotate(180deg) brightness(101%) contrast(87%); } .gifts-page .group-gadgets-image { max-width: 100%; height: auto; } .gifts-page .deposit-btn:hover > div { background: rgba(54, 192, 6, 0.12) !important; border-color: rgba(54, 192, 6, 0.7) !important; } .gifts-page .learn-more-btn:hover > div { border-bottom-color: #36C006 !important; } .gifts-page .learn-more-btn:hover > div > div { color: #36C006 !important; } .gifts-page .bg-green-deposit-btn .color-green { white-space: nowrap !important; } @media (max-width: 767px) { .gifts-page .gift-image-container { height: 200px !important; } .gifts-page .d-md-none-decorative { display: none !important; } .gifts-page .position-decorative { opacity: 0.5 !important; } .gifts-page .cta-btn { padding: 20px 32px !important; } .gifts-page .info-box { padding: 32px !important; flex-direction: column !important; align-items: flex-start !important; } .gifts-page .mobile-only { display: flex !important; } .gifts-page .desktop-only { display: none !important; } .gifts-page .py-128 { padding-top: 64px !important; padding-bottom: 64px !important; } .gifts-page .gap-96 { gap: 64px !important; } .gifts-page .gap-64 { gap: 48px !important; } .gifts-page .px-387 { padding-left: 20px !important; padding-right: 20px !important; } } @media (min-width: 768px) { .gifts-page .mobile-only { display: none !important; } .gifts-page .desktop-only { display: flex !important; } } .gifts-page .text_12 { position: relative; z-index: 10 !important; margin: 60px 0 0 0; } .gifts-page .text_12 .text_12_header { background: var(--black-100) !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(var(--white-rgb), 0.1) !important; } .gifts-page .text_12 .text_12_text { background: var(--black-100) !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(var(--white-rgb), 0.05) !important; border-top: none !important; } .gifts-page .text_12 .more { display: flex !important; align-items: center !important; justify-content: center !important; } @media (max-width: 767px) { .gifts-page .vps-6 { margin-top: 64px !important; } } .vietnam-bottom { /* Image provided via ; anchor to bottom */ background-position: bottom center; background-size: cover; background-repeat: no-repeat; top: auto; /* override %cover */ bottom: 0; height: 696px; /* desktop height */ width: 100%; z-index: 1; /* above gradient backgrounds */ } /* .inverted .vietnam-bottom no longer needs separate background-image */ @media (max-width: 767.98px) { .vietnam-bottom { background-size: cover; height: auto; min-height: 300px; } } /* keep img visible */ /* Ensure image fills block and sticks to bottom */ .vietnam-bottom img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: bottom center; object-position: bottom center; } @media (max-width: 767.98px) { .vietnam-bottom { height: 300px; /* mobile height */ } .vietnam-bottom img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: bottom center; object-position: bottom center; transform: translateX(-15%); } /* Neutralize global marathon mobile styles that blur/mix-blend other page_bg elements */ .marathon-page_kh .vietnam-bottom { filter: none !important; mix-blend-mode: normal !important; } /* Override marathon page_bg styles for mobile */ .vietnam-page.marathon-page.marathon-page_kh .page_bg { margin-top: unset !important; fill: unset !important; mix-blend-mode: unset !important; filter: unset !important; background: unset !important; } /* Additional specific override */ body .vietnam-page.marathon-page.marathon-page_kh .page_bg { margin-top: 0 !important; fill: none !important; mix-blend-mode: normal !important; filter: none !important; } } /* Override global marathon-page_kh styles */ .marathon-page_kh .page_bg { min-height: unset !important; } @media (max-width: 767.98px) { .marathon-page_kh .page_bg { margin-top: 0 !important; fill: none !important; mix-blend-mode: normal !important; filter: none !important; } } .vietnam-page .vietnam-places-block { padding: 80px 0; /* Dark theme gradient */ background: linear-gradient(180deg, #020202 0%, #0E0E0E 100%); } /* Light theme override */ .inverted .vietnam-page .vietnam-places-block { background: linear-gradient(180deg, #C7C7C7 0%, #FAFAFA 100%); } .vietnam-page .vietnam-participant-title { color: var(--white); font-size: 48px; font-weight: 700; text-align: center; margin-bottom: 64px; } .vietnam-page .vietnam-card { background: var(--vietnam-card-bg); border-radius: 24px; padding: 48px; position: relative; margin: 0 auto; max-width: 900px; } .inverted .vietnam-page .vietnam-card { background: #FFFFFF; /* light theme */ } .vietnam-page .vietnam-card::before { content: ""; position: absolute; top: -12px; left: 48px; width: 256px; height: 12px; background: var(--green); border-top-left-radius: 24px; border-top-right-radius: 24px; } .vietnam-page .vietnam-header { display: flex; align-items: center; gap: 32px; margin-bottom: 32px; } .vietnam-page .vietnam-icon { width: 48px; height: 48px; position: relative; overflow: hidden; flex-shrink: 0; } .vietnam-page .vietnam-title { color: var(--green); font-size: 36px; font-weight: 700; margin: 0; } .vietnam-page .vietnam-description { color: var(--white); font-size: 20px; font-weight: 400; margin-bottom: 64px; } .vietnam-page .vietnam-description .color-green { color: var(--green) !important; } .vietnam-page .vietnam-conditions-title { color: var(--white); font-size: 20px; font-weight: 700; margin-bottom: 16px; } .vietnam-page .vietnam-conditions-list { list-style: none; padding: 0; margin: 0 0 12px 0; } .vietnam-page .vietnam-conditions-list li { color: var(--gray); font-size: 18px; font-weight: 400; margin-bottom: 12px; line-height: 1.4; } .vietnam-page .vietnam-conditions-list .promocode { color: var(--green); font-weight: 700; text-decoration: underline; } .vietnam-page .vietnam-note { color: var(--gray-100); font-size: 12px; font-weight: 400; margin-bottom: 32px; } .vietnam-page .vietnam-btn { background: rgba(var(--green-rgb), 0.06); border: 1.5px solid rgba(var(--green-rgb), 0.48); border-radius: 6px; padding: 19px 42px; color: var(--green); font-size: 18px; font-weight: 700; text-transform: uppercase; text-decoration: none; display: inline-block; transition: all 0.3s ease; text-align: center; min-width: 256px; } .vietnam-page .vietnam-btn:hover { background: rgba(var(--green-rgb), 0.12); border-color: rgba(var(--green-rgb), 0.8); color: var(--green); text-decoration: none; } .vietnam-page .vietnam-competition-intro { position: relative; padding: 128px 0; margin-top: 126px; background: var(--alabaster-solid); overflow: hidden; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 64px; } .vietnam-page .vietnam-bg-gradient-1 { position: absolute; width: 772px; height: 1036px; transform: rotate(180deg); transform-origin: top left; background: radial-gradient(ellipse 50% 101.3% at 101.3% 50%, var(--gray-200) 0%, var(--black-400) 100%); top: 0; left: 0; } .vietnam-page .vietnam-bg-gradient-2 { position: absolute; width: 772px; height: 1036px; transform: rotate(180deg); transform-origin: top left; background: radial-gradient(ellipse 50% 101.3% at -1.3% 50%, var(--gray-200) 0%, var(--black-400) 100%); top: 0; right: 0; } .vietnam-page .vietnam-blur-effect { position: absolute; width: 800px; height: 400px; left: 50%; transform: translateX(-50%); bottom: 100px; background: rgba(var(--green-rgb), 0.32); filter: blur(256px); } .vietnam-page .vietnam-intro-content { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 64px; width: 100%; } .vietnam-page .vietnam-main-content { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 48px; width: 100%; text-align: center; } .vietnam-page .vietnam-main-title { color: var(--white); font-size: 64px; font-family: "Roboto", sans-serif; font-weight: 700; line-height: 1.1; margin: 0; text-align: center; } .vietnam-page .vietnam-main-description { color: var(--gray); font-size: 24px; font-family: "Roboto", sans-serif; font-weight: 400; line-height: 1.33; margin: 0; text-align: center; } .vietnam-page .vietnam-highlight { color: var(--green); } .vietnam-page .vietnam-connection-image { width: 100%; max-width: 1920px; margin: 0 auto; } .vietnam-page .vietnam-main-prize { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 32px; width: 100%; } .vietnam-page .vietnam-prize-content { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; width: 100%; text-align: center; } .vietnam-page .vietnam-prize-title { color: var(--white); font-size: 32px; font-family: "Roboto", sans-serif; font-weight: 700; text-align: center; width: 100%; margin-bottom: 16px; } .vietnam-page .vietnam-prize-name { color: var(--green); font-size: 48px; font-family: "Roboto", sans-serif; font-weight: 900; text-align: center; width: 100%; } .vietnam-page .vietnam-prize-description { text-align: center; width: 100%; } .vietnam-page .vietnam-included-title { color: var(--white); font-size: 24px; font-family: "Roboto", sans-serif; font-weight: 400; line-height: 32px; margin-bottom: 8px; } .vietnam-page .vietnam-included-list { color: var(--gray); font-size: 24px; font-family: "Roboto", sans-serif; font-weight: 400; line-height: 32px; list-style: none; padding-left: 0; margin: 0; text-align: left; max-width: 600px; margin: 0 auto; } .vietnam-page .vietnam-included-list li { position: relative; padding-left: 20px; margin-bottom: 8px; text-align: left; } .vietnam-page .vietnam-included-list li:before { content: "•"; color: var(--gray); position: absolute; left: 0; top: 0; font-size: 24px; line-height: 32px; } .vietnam-page .vietnam-cta-section { display: flex; flex-direction: column; justify-content: center; align-items: center; } .vietnam-page .vietnam-cta-btn { background: none; border: none; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 8px; transition: all 0.3s ease; } .vietnam-page .vietnam-cta-btn:hover { transform: translateY(-2px); } .vietnam-page .vietnam-cta-text { color: var(--green); font-size: 24px; font-family: "Roboto", sans-serif; font-weight: 700; } .vietnam-page .vietnam-cta-underline { width: 227px; height: 1px; border-bottom: 1px dashed var(--green); background: none; } .vietnam-page .vietnam-cta-arrow { width: 24px; height: 24px; position: relative; } .vietnam-page .vietnam-download-icon { width: 24px; height: 24px; -o-object-fit: contain; object-fit: contain; } @media (max-width: 767.98px) { .vietnam-page .vietnam-competition-intro { padding: 64px 20px; margin-top: 124px; gap: 48px; } .vietnam-page .vietnam-main-title { font-size: 40px; line-height: 1.1; } .vietnam-page .vietnam-main-description { font-size: 18px; line-height: 1.4; } .vietnam-page .vietnam-prize-title { font-size: 24px; } .vietnam-page .vietnam-prize-name { font-size: 32px; } .vietnam-page .vietnam-included-title { font-size: 18px; line-height: 26px; } .vietnam-page .vietnam-included-list { font-size: 16px; line-height: 24px; } .vietnam-page .vietnam-included-list li:before { font-size: 16px; line-height: 24px; } .vietnam-page .vietnam-cta-text { font-size: 18px; } .vietnam-page .vietnam-cta-underline { width: 180px; } .vietnam-page .vietnam-bg-gradient-1, .vietnam-page .vietnam-bg-gradient-2 { width: 400px; height: 600px; } .vietnam-page .vietnam-blur-effect { width: 600px; height: 300px; left: 50%; transform: translateX(-50%); bottom: 50px; } .vietnam-page .vietnam-card { padding: 24px; } .vietnam-page .vietnam-card::before { left: 24px; width: 200px; } .vietnam-page .vietnam-participant-title { font-size: 32px; margin-bottom: 32px; } .vietnam-page .vietnam-places-block { padding: 48px 20px; } } @media (min-width: 768px) and (max-width: 991.98px) { .vietnam-page .vietnam-competition-intro { padding: 96px 40px; padding-top: 176px; } .vietnam-page .vietnam-main-title { font-size: 52px; } .vietnam-page .vietnam-main-description { font-size: 20px; } .vietnam-page .vietnam-prize-title { font-size: 28px; } .vietnam-page .vietnam-prize-name { font-size: 40px; } .vietnam-page .vietnam-included-title { font-size: 20px; line-height: 28px; } .vietnam-page .vietnam-included-list { font-size: 18px; line-height: 26px; } .vietnam-page .vietnam-included-list li:before { font-size: 18px; line-height: 26px; } } .vietnam-page .vietnam-first-participants { position: relative; padding: 128px 387px; background: var(--alabaster-solid); overflow: hidden; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 64px; } .vietnam-page .vietnam-participants-bg-gradient-1 { position: absolute; width: 772px; height: 1036px; transform: rotate(180deg); transform-origin: top left; background: radial-gradient(ellipse 50% 101.3% at 101.3% 50%, var(--gray-200) 0%, var(--black-400) 100%); top: 0; left: 0; } .vietnam-page .vietnam-participants-bg-gradient-2 { position: absolute; width: 772px; height: 1036px; transform: rotate(180deg); transform-origin: top left; background: radial-gradient(ellipse 50% 101.3% at -1.3% 50%, var(--gray-200) 0%, var(--black-400) 100%); top: 0; right: 0; } .vietnam-page .vietnam-participants-content { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 64px; width: 100%; } .vietnam-page .vietnam-participants-header { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 48px; width: 100%; text-align: center; } .vietnam-page .vietnam-participants-title { color: var(--white); font-size: 64px; font-family: "Roboto", sans-serif; font-weight: 700; line-height: 1.1; margin: 0; text-align: center; } .vietnam-page .vietnam-participants-highlight { color: var(--green); } .vietnam-page .vietnam-participants-subtitle { color: var(--gray); font-size: 24px; font-family: "Roboto", sans-serif; font-weight: 400; margin: 0; text-align: center; } .vietnam-page .vietnam-participants-image { width: 100%; max-width: 1920px; margin: 0 auto; } .vietnam-page .vietnam-participants-prize { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 32px; width: 100%; max-width: 1146px; text-align: center; } .vietnam-page .vietnam-participants-prize-title { color: var(--white); font-size: 32px; font-family: "Roboto", sans-serif; font-weight: 700; text-align: center; width: 100%; } .vietnam-page .vietnam-participants-prize-name { color: var(--green); font-size: 48px; font-family: "Roboto", sans-serif; font-weight: 900; text-align: center; width: 100%; } .vietnam-page .vietnam-benefits-grid { display: flex; width: 1146px; flex-direction: column; align-items: flex-start; gap: 32px; } .vietnam-page .vietnam-benefits-row { display: flex; justify-content: flex-start; align-items: flex-start; gap: 32px; width: 100%; } .vietnam-page .vietnam-benefit-card { width: 557px; padding: 48px 24px; background: var(--vietnam-card-bg); border-radius: 24px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 32px; height: 336px; word-wrap: break-word; /* Handle long text */ overflow-wrap: break-word; } .vietnam-page .vietnam-benefit-icon { width: 96px; height: 96px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; } .vietnam-page .vietnam-benefit-icon img { width: 80px; height: 80px; filter: brightness(0) saturate(100%) invert(44%) sepia(95%) saturate(2000%) hue-rotate(78deg) brightness(118%) contrast(119%); } .vietnam-page .vietnam-benefit-icon .vietnam-plane-icon, .vietnam-page .vietnam-benefit-icon .vietnam-location-icon, .vietnam-page .vietnam-benefit-icon .vietnam-together-icon, .vietnam-page .vietnam-benefit-icon .vietnam-attractions-icon { width: 80px; height: 80px; -o-object-fit: contain; object-fit: contain; } .vietnam-page .vietnam-benefit-icon .vietnam-plane-icon, .vietnam-page .vietnam-benefit-icon .vietnam-location-icon, .vietnam-page .vietnam-benefit-icon .vietnam-together-icon, .vietnam-page .vietnam-benefit-icon .vietnam-attractions-icon { filter: brightness(0) saturate(100%) invert(44%) sepia(95%) saturate(2000%) hue-rotate(78deg) brightness(118%) contrast(119%); } .vietnam-page .vietnam-icon img { width: 48px; height: 48px; -o-object-fit: contain; object-fit: contain; } .vietnam-page .vietnam-benefit-content { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 24px; width: 100%; } .vietnam-page .vietnam-benefit-title { color: var(--white); font-size: 32px; font-family: "Roboto", sans-serif; font-weight: 700; line-height: normal; text-align: center; margin: 0; width: 100%; } .vietnam-page .vietnam-benefit-description { color: #A1A1A1; font-size: 20px; font-family: "Roboto", sans-serif; font-style: normal; font-weight: 400; line-height: 24px; text-align: center; margin: 0; width: 100%; word-wrap: break-word; /* Prevent text overflow */ -webkit-hyphens: auto; hyphens: auto; /* Allow hyphenation */ } /* Remove --compact styles to make all cards consistent */ @media (max-width: 767.98px) { .vietnam-page .vietnam-first-participants { padding: 64px 20px; gap: 48px; } .vietnam-page .vietnam-participants-title { font-size: 40px; line-height: 1.1; } .vietnam-page .vietnam-participants-subtitle { font-size: 18px; } .vietnam-page .vietnam-participants-prize-title { font-size: 24px; } .vietnam-page .vietnam-participants-prize-name { font-size: 32px; } .vietnam-page .vietnam-benefits-grid { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; } .vietnam-page .vietnam-benefits-row { flex-direction: column; gap: 24px; display: flex; align-items: center; } .vietnam-page .vietnam-benefit-card { min-width: 0; max-width: 100%; width: 335px; padding: 32px 24px; gap: 24px; height: auto; word-wrap: break-word; overflow-wrap: break-word; } .vietnam-page .vietnam-benefit-icon { width: 64px; height: 64px; } .vietnam-page .vietnam-benefit-icon img { width: 50px; height: 50px; } .vietnam-page .vietnam-benefit-title { font-size: 24px; } .vietnam-page .vietnam-benefit-description { font-size: 16px; line-height: 22px; } /* Remove mobile --compact styles */ .vietnam-page .vietnam-participants-bg-gradient-1, .vietnam-page .vietnam-participants-bg-gradient-2 { width: 400px; height: 600px; } } @media (min-width: 768px) and (max-width: 991.98px) { .vietnam-page .vietnam-first-participants { padding: 96px 40px; } .vietnam-page .vietnam-participants-title { font-size: 52px; } .vietnam-page .vietnam-participants-subtitle { font-size: 20px; } .vietnam-page .vietnam-participants-prize-title { font-size: 28px; } .vietnam-page .vietnam-participants-prize-name { font-size: 40px; } .vietnam-page .vietnam-benefit-card { padding: 50px 32px; height: 300px; } .vietnam-page .vietnam-benefit-icon { width: 80px; height: 80px; } .vietnam-page .vietnam-benefit-icon img { width: 65px; height: 65px; } .vietnam-page .vietnam-benefit-title { font-size: 28px; } .vietnam-page .vietnam-benefit-description { font-size: 18px; line-height: 22px; } /* Remove medium devices --compact styles for consistency */ .vietnam-page .vietnam-card { padding: 32px; } .vietnam-page .vietnam-card::before { left: 32px; width: 220px; } .vietnam-page .vietnam-participant-title { font-size: 40px; margin-bottom: 48px; } .vietnam-page .vietnam-places-block { padding: 64px 40px; } } .car-gifts-page { min-height: 100vh; background: var(--black-400); } .car-gifts-page .bg-car-gifts-hero { background: var(--black-400); } @media (max-width: 767px) { .car-gifts-page .bg-car-gifts-hero { background: var(--black-400); } } .inverted .car-gifts-page .bg-car-gifts-hero { background: #F1F1F1 !important; } .car-gifts-page #car-gifts-hero { position: relative; overflow: hidden; padding: 246px 0; } @media (max-width: 767px) { .car-gifts-page #car-gifts-hero { padding: 128px 20px; } } .car-gifts-page #car-gifts-hero .car-gifts-hero-gap { gap: 64px; } @media (max-width: 767px) { .car-gifts-page #car-gifts-hero .car-gifts-hero-gap { gap: 32px; } } .car-gifts-page #car-gifts-hero .car-gifts-content-wrapper { max-width: 1146px; width: 100%; margin: 0 auto; } .car-gifts-page .car-gifts-mobile-title { max-width: 335px; margin: 0 auto; } .car-gifts-page .car-gifts-mobile-title .car-gifts-mobile-h1 { line-height: 40px; } .inverted .car-gifts-page #car-gifts-hero h1, .inverted .car-gifts-page #car-gifts-hero h2 { color: #2E2E2E !important; } .inverted .car-gifts-page #car-gifts-hero .color-white { color: #2E2E2E !important; } .car-gifts-page .car-gifts-vehicles-desktop { position: relative; width: 1146px; height: 607px; display: flex; align-items: center; justify-content: center; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-vehicle-left { position: absolute; left: 0; top: 78px; z-index: 2; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-vehicle-left .car-gifts-vehicle-img { width: 560px; height: 320px; -o-object-fit: contain; object-fit: contain; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-vehicle-left .car-gifts-vehicle-name { position: absolute; bottom: -30px; left: 0; font-size: 40px; font-weight: 900; text-transform: uppercase; line-height: 1; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-vehicle-right { position: absolute; right: 0; top: 208px; z-index: 2; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-vehicle-right .car-gifts-vehicle-img { width: 419px; height: 320px; -o-object-fit: contain; object-fit: contain; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-vehicle-right .car-gifts-vehicle-name-right { position: absolute; bottom: -30px; right: 0; font-size: 40px; font-weight: 900; text-transform: uppercase; line-height: 1; text-align: right; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-green-stripe { position: absolute; z-index: 1; } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-green-stripe.car-gifts-green-stripe-1 { right: 381px; top: 0; width: 439px; height: 607px; background: linear-gradient(135deg, transparent 0%, transparent 35%, #36C006 35%, #36C006 65%, transparent 65%, transparent 100%); clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); } .car-gifts-page .car-gifts-vehicles-desktop .car-gifts-green-stripe.car-gifts-green-stripe-2 { right: 272px; top: 46px; width: 439px; height: 607px; background: linear-gradient(135deg, transparent 0%, transparent 35%, rgba(54, 192, 6, 0.7) 35%, rgba(54, 192, 6, 0.7) 65%, transparent 65%, transparent 100%); clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); } .car-gifts-page .car-gifts-vehicles-mobile { position: relative; width: 375px; height: 326.5px; max-width: 100%; margin: 0 auto; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-vehicle-left-mobile { position: absolute; left: 0; top: 39px; z-index: 2; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-vehicle-left-mobile .car-gifts-vehicle-img-mobile { width: 280px; height: 160px; -o-object-fit: contain; object-fit: contain; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-vehicle-left-mobile .car-gifts-vehicle-name-mobile { position: absolute; bottom: -30px; left: 32px; font-size: 20px; font-weight: 900; text-transform: uppercase; line-height: 1; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-vehicle-right-mobile { position: absolute; right: 0; top: 130px; z-index: 2; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-vehicle-right-mobile .car-gifts-vehicle-img-mobile { width: 209px; height: 159px; -o-object-fit: contain; object-fit: contain; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-vehicle-right-mobile .car-gifts-vehicle-name-right-mobile { position: absolute; bottom: -30px; right: 32px; font-size: 20px; font-weight: 900; text-transform: uppercase; line-height: 1; text-align: right; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-green-stripe-mobile { position: absolute; z-index: 1; } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-green-stripe-mobile.car-gifts-green-stripe-1-mobile { right: 25.93px; top: 0; width: 219.5px; height: 303.5px; background: linear-gradient(135deg, transparent 0%, transparent 35%, #36C006 35%, #36C006 65%, transparent 65%, transparent 100%); clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); } .car-gifts-page .car-gifts-vehicles-mobile .car-gifts-green-stripe-mobile.car-gifts-green-stripe-2-mobile { right: 77.5px; top: 23px; width: 219.5px; height: 303.5px; background: linear-gradient(135deg, transparent 0%, transparent 35%, rgba(54, 192, 6, 0.7) 35%, rgba(54, 192, 6, 0.7) 65%, transparent 65%, transparent 100%); clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); } .car-gifts-page .car-gifts-promo-box { background: rgba(54, 192, 6, 0.06); border: 2px solid #36C006; border-radius: 16px; padding: 24px 32px; width: 764px; max-width: 100%; height: 80px; display: flex; align-items: center; justify-content: center; gap: 16px; margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-promo-box { width: 335px; max-width: calc(100% - 40px); height: 181px; flex-direction: column; padding: 24px 32px; gap: 16px; margin-bottom: 32px; } } .car-gifts-page .car-gifts-promo-box .car-gifts-promo-icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; } .car-gifts-page .car-gifts-promo-box .car-gifts-promo-text-mobile { line-height: 28.33px; } .car-gifts-page .car-gifts-promo-box .letter-spacing-2-56 { letter-spacing: 2.56px; text-decoration: underline; text-decoration-style: dotted; text-decoration-thickness: 1px; text-underline-offset: 16%; } .inverted .car-gifts-page .car-gifts-promo-box .color-white { color: #2E2E2E !important; } .car-gifts-page .car-gifts-conditions { list-style: disc; list-style-position: inside; max-width: 1146px; margin: 0 auto 64px; padding: 0; } .car-gifts-page .car-gifts-conditions li { margin-left: 36px; margin-bottom: 8px; } .car-gifts-page .car-gifts-conditions li:last-child { margin-bottom: 0; } .car-gifts-page .car-gifts-conditions-mobile { list-style: disc; list-style-position: inside; max-width: 335px; margin: 0 auto 32px; padding: 0; text-align: left; } .car-gifts-page .car-gifts-conditions-mobile li { margin-left: 36px; margin-bottom: 32px; line-height: 32px; } .car-gifts-page .car-gifts-conditions-mobile li:last-child { margin-bottom: 0; } .inverted .car-gifts-page .car-gifts-conditions li, .inverted .car-gifts-page .car-gifts-conditions-mobile li { color: #6D6D6D !important; } .car-gifts-page h1 { line-height: 1.17; max-width: 1146px; margin-left: auto; margin-right: auto; } .car-gifts-page .car-gifts-cta-btn { background: rgba(54, 192, 6, 0.06); border: 1.5px solid rgba(54, 192, 6, 0.48); border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; transition: all 0.3s ease; width: 264px; height: 64px; padding: 0; text-decoration: none !important; } @media (max-width: 767px) { .car-gifts-page .car-gifts-cta-btn { width: 335px; max-width: calc(100% - 40px); height: 60px; } } .car-gifts-page .car-gifts-cta-btn:hover { background: rgba(54, 192, 6, 0.12); border-color: rgba(54, 192, 6, 0.7); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(54, 192, 6, 0.3); text-decoration: none !important; } .car-gifts-page .car-gifts-cta-btn .car-gifts-cta-btn-text { color: #36C006; font-size: 18px; font-weight: 700; text-transform: uppercase; line-height: normal; white-space: nowrap; text-decoration: none !important; } .inverted .car-gifts-page .car-gifts-cta-btn { background: #36C006; border-color: rgba(54, 192, 6, 0.48); text-decoration: none !important; } .inverted .car-gifts-page .car-gifts-cta-btn:hover { background: #2EA005; border-color: #36C006; text-decoration: none !important; } .inverted .car-gifts-page .car-gifts-cta-btn .car-gifts-cta-btn-text { color: #FFFFFF; text-decoration: none !important; } .inverted .car-gifts-page { background: var(--white); } .car-gifts-page #car-gifts-limited-time { padding: 128px 0; } @media (max-width: 767px) { .car-gifts-page #car-gifts-limited-time { padding: 64px 20px; } } .car-gifts-page .car-gifts-limited-icon { width: 72px; height: 72px; background: #36C006; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; padding: 12px; } .car-gifts-page .car-gifts-limited-icon img { width: 48px; height: 48px; filter: brightness(0); } .car-gifts-page .car-gifts-mobile-h2 { line-height: 40px; } .inverted .car-gifts-page #car-gifts-limited-time h2 { color: #2E2E2E !important; } .inverted .car-gifts-page #car-gifts-limited-time p { color: #6D6D6D !important; } .car-gifts-page #car-gifts-rewards { padding: 128px 0; background: linear-gradient(180deg, #020202 0%, #0e0e0e 100%); } @media (max-width: 767px) { .car-gifts-page #car-gifts-rewards { padding: 64px 0; } } .inverted .car-gifts-page #car-gifts-rewards { background: #FAFAFA; } .car-gifts-page .car-gifts-cards-desktop { max-width: 1146px; margin: 0 auto; } .car-gifts-page .car-gifts-reward-card { width: 488px; max-width: 100%; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-card { width: 335px; margin: 0 auto; } } .car-gifts-page .car-gifts-reward-card .car-gifts-reward-card-inner { background: #0e0e0e; border: none; transition: all 0.3s ease; } .car-gifts-page .car-gifts-reward-card:hover .car-gifts-reward-card-inner { background: #1e1e1e; border: 2px solid #36C006; } .inverted .car-gifts-page .car-gifts-reward-card .car-gifts-reward-card-inner { background: white; border: 2px solid #e2e2e2; } .inverted .car-gifts-page .car-gifts-reward-card:hover .car-gifts-reward-card-inner { background: white; border: 2px solid #36C006; } .car-gifts-page .car-gifts-reward-card-inner { position: relative; border-radius: 32px; padding: 32px; overflow: hidden; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-card-inner { border-radius: 16px; padding: 24px 20px 32px; } } .car-gifts-page .car-gifts-reward-stripe { position: absolute; z-index: 1; pointer-events: none; } .car-gifts-page .car-gifts-reward-stripe.car-gifts-reward-stripe-1 { top: 0; width: 439px; height: 607px; background: linear-gradient(135deg, transparent 0%, transparent 35%, rgba(54, 192, 6, 0.3) 35%, rgba(54, 192, 6, 0.3) 65%, transparent 65%, transparent 100%); clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-stripe.car-gifts-reward-stripe-1 { width: 329px; height: 455px; } } .car-gifts-page .car-gifts-reward-stripe.car-gifts-reward-stripe-2 { top: -80px; width: 439px; height: 607px; background: linear-gradient(135deg, transparent 0%, transparent 35%, rgba(54, 192, 6, 0.15) 35%, rgba(54, 192, 6, 0.15) 65%, transparent 65%, transparent 100%); clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-stripe.car-gifts-reward-stripe-2 { width: 329px; height: 455px; top: -24px; } } .car-gifts-page .car-gifts-reward-card:first-child .car-gifts-reward-stripe-1 { right: 32px; transform: rotate(180deg) scaleY(-1); } .car-gifts-page .car-gifts-reward-card:first-child .car-gifts-reward-stripe-2 { left: 0; transform: rotate(180deg) scaleY(-1); } .car-gifts-page .car-gifts-reward-card:last-child .car-gifts-reward-stripe-1 { left: 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-card:last-child .car-gifts-reward-stripe-1 { left: 38px; top: 36px; } } .car-gifts-page .car-gifts-reward-card:last-child .car-gifts-reward-stripe-2 { right: 0; left: 50%; transform: translateX(-50%); } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-card:last-child .car-gifts-reward-stripe-2 { left: calc(50% + 0.125px); } } .car-gifts-page .car-gifts-reward-image { position: relative; width: 100%; height: 320px; margin-bottom: 32px; z-index: 2; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-image { height: 180px; margin-bottom: 0; } } .car-gifts-page .car-gifts-reward-image img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .car-gifts-page .car-gifts-reward-icon { position: relative; width: 72px; height: 72px; background: #e2e2e2; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 32px; z-index: 2; padding: 8px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-icon { width: 72px; height: 72px; margin-bottom: 32px; } } .car-gifts-page .car-gifts-reward-icon svg { width: 48px; height: 48px; color: #0e0e0e; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-icon svg { width: 48px; height: 48px; } } .inverted .car-gifts-page .car-gifts-reward-icon { background: #2e2e2e; } .inverted .car-gifts-page .car-gifts-reward-icon svg { color: #e2e2e2; } .car-gifts-page .car-gifts-reward-content { position: relative; z-index: 2; text-align: center; } .car-gifts-page .car-gifts-reward-title { font-size: 48px; font-weight: 900; text-transform: uppercase; line-height: normal; margin-bottom: 16px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-title { font-size: 36px; margin-bottom: 8px; } } .car-gifts-page .car-gifts-reward-description { font-size: 24px; font-weight: 400; color: #e2e2e2; line-height: 32px; margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-description { font-size: 24px; line-height: 32px; margin-bottom: 32px; } } .inverted .car-gifts-page .car-gifts-reward-description { color: #2e2e2e; } .car-gifts-page .car-gifts-reward-badge { display: inline-flex; align-items: center; gap: 8px; background: #36C006; color: #0e0e0e; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; padding: 8px 16px; border-radius: 32px; margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-badge { font-size: 16px; padding: 8px 16px; margin-bottom: 32px; } } .car-gifts-page .car-gifts-reward-badge svg { width: 24px; height: 24px; color: #0e0e0e; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-badge svg { width: 24px; height: 24px; } } .car-gifts-page .car-gifts-reward-deposit { margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-deposit { margin-bottom: 32px; } } .car-gifts-page .car-gifts-reward-deposit-label { font-size: 24px; font-weight: 400; color: #9D9D9D; line-height: 32px; margin-bottom: 8px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-deposit-label { font-size: 16px; line-height: 16px; margin-bottom: 8px; } } .car-gifts-page .car-gifts-reward-deposit-amount { font-size: 32px; font-weight: 700; color: #36C006; line-height: normal; margin: 0; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-deposit-amount { font-size: 24px; } } .car-gifts-page .car-gifts-reward-btn { display: block; width: 100%; background: transparent; border: 1.5px solid #36C006; border-radius: 6px; color: #36C006; font-size: 16px; font-weight: 700; text-transform: uppercase; text-align: center; text-decoration: none; padding: 16px 20px; transition: all 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-reward-btn { font-size: 14px; padding: 14px 16px; } } .car-gifts-page .car-gifts-reward-btn:hover { background: rgba(54, 192, 6, 0.1); border-color: #36C006; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(54, 192, 6, 0.2); } .inverted .car-gifts-page .car-gifts-reward-btn { background: #36C006; border-color: rgba(54, 192, 6, 0.48); color: #FFFFFF; text-decoration: none !important; } .inverted .car-gifts-page .car-gifts-reward-btn:hover { background: #2EA005; border-color: #36C006; text-decoration: none !important; } .car-gifts-page .car-gifts-carousel { width: 100%; max-width: 375px; margin: 0 auto; position: relative; } .car-gifts-page .car-gifts-carousel-container { overflow: hidden; width: 100%; } .car-gifts-page .car-gifts-carousel-track { display: flex; transition: transform 0.3s ease; } .car-gifts-page .car-gifts-carousel-item { min-width: 100%; opacity: 0; transition: opacity 0.3s ease; } .car-gifts-page .car-gifts-carousel-item.active { opacity: 1; } .car-gifts-page .car-gifts-carousel-item .car-gifts-reward-card .car-gifts-reward-card-inner { background: #0e0e0e; border: none; } .car-gifts-page .car-gifts-carousel-item .car-gifts-reward-card:hover .car-gifts-reward-card-inner { background: #1e1e1e; border: 2px solid #36C006; } .inverted .car-gifts-page .car-gifts-carousel-item .car-gifts-reward-card .car-gifts-reward-card-inner { background: white; border: 2px solid #e2e2e2; } .inverted .car-gifts-page .car-gifts-carousel-item .car-gifts-reward-card:hover .car-gifts-reward-card-inner { background: white; border: 2px solid #36C006; } .car-gifts-page .car-gifts-carousel-dots { display: flex; justify-content: center; gap: 8px; margin-top: 24px; } .car-gifts-page .car-gifts-carousel-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, 0.3); border: none; padding: 0; cursor: pointer; transition: all 0.3s ease; } .car-gifts-page .car-gifts-carousel-dot.active { background: #36C006; width: 24px; border-radius: 4px; } .car-gifts-page .car-gifts-carousel-dot:hover:not(.active) { background: rgba(255, 255, 255, 0.5); } .car-gifts-page #car-gifts-terms { background: #111111; padding: 128px 0; } @media (max-width: 767px) { .car-gifts-page #car-gifts-terms { padding: 64px 20px; } } .inverted .car-gifts-page #car-gifts-terms { background: #F1F1F1; } .car-gifts-page .car-gifts-terms-header { margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-header { margin-bottom: 32px; } } .car-gifts-page .car-gifts-terms-cards { max-width: 1146px; margin: 0 auto; display: flex; flex-direction: column; gap: 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-cards { gap: 16px; } } .car-gifts-page .car-gifts-terms-row { display: flex; gap: 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-row { gap: 16px; } } .car-gifts-page .car-gifts-terms-card { background: transparent; border: 2px solid #1a1a1a; border-radius: 16px; padding: 32px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 32px; flex: 1; min-width: 0; overflow: hidden; transition: all 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-card { padding: 32px 16px; } } .car-gifts-page .car-gifts-terms-card.car-gifts-terms-card-full { width: 100%; flex: none; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-card.car-gifts-terms-card-full { width: 100%; } } .car-gifts-page .car-gifts-terms-card:hover { background: #36C006; border-color: #36C006; transform: translateY(-4px); box-shadow: 0 12px 24px rgba(54, 192, 6, 0.3); } .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-title, .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-text, .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-text-regular { color: #0e0e0e; } .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-promo-code { color: #0e0e0e; } .inverted .car-gifts-page .car-gifts-terms-card { border-color: #e2e2e2; } .inverted .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-title, .inverted .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-text, .inverted .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-text-regular { color: white; } .inverted .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-promo-code { color: white; } .car-gifts-page .car-gifts-terms-card-icon { display: flex; width: 72px; height: 72px; padding: 8px; justify-content: center; align-items: center; gap: 10px; aspect-ratio: 1/1; border-radius: 64px; flex-shrink: 0; transition: all 0.3s ease; background: #FFFFFF; } .car-gifts-page .car-gifts-terms-card-icon img { width: 48px; height: 48px; filter: brightness(0) saturate(100%) invert(13%) sepia(0%) saturate(0%) hue-rotate(327deg) brightness(102%) contrast(87%); transition: filter 0.3s ease; } .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-icon { background: #2E2E2E; } .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-icon img { filter: brightness(0) saturate(100%) invert(60%) sepia(93%) saturate(1932%) hue-rotate(64deg) brightness(98%) contrast(101%); } .inverted .car-gifts-page .car-gifts-terms-card-icon { background: #2E2E2E; } .inverted .car-gifts-page .car-gifts-terms-card-icon img { filter: brightness(0) invert(1); } .inverted .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-icon { background: #FFFFFF; } .inverted .car-gifts-page .car-gifts-terms-card:hover .car-gifts-terms-card-icon img { filter: brightness(0) saturate(100%) invert(60%) sepia(93%) saturate(1932%) hue-rotate(64deg) brightness(98%) contrast(101%); } .car-gifts-page .car-gifts-terms-card-content { display: flex; flex-direction: column; gap: 16px; width: 100%; min-width: 0; overflow: hidden; } .car-gifts-page .car-gifts-terms-card-title { font-size: 32px; font-weight: 700; color: #e2e2e2; line-height: normal; margin: 0; word-wrap: break-word; overflow-wrap: break-word; transition: color 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-card-title { font-size: 24px; } } .inverted .car-gifts-page .car-gifts-terms-card-title { color: #2e2e2e; } .car-gifts-page .car-gifts-terms-card-text { font-size: 20px; font-weight: 400; color: #9d9d9d; line-height: normal; margin: 0; word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; transition: color 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-card-text { font-size: 16px; line-height: 20px; } } .car-gifts-page .car-gifts-terms-text-regular { font-size: 20px; font-weight: 400; color: #9d9d9d; transition: color 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-text-regular { font-size: 16px; } } .inverted .car-gifts-page .car-gifts-terms-text-regular { color: #6d6d6d; } .car-gifts-page .car-gifts-terms-promo-code { font-size: 24px; font-weight: 700; color: #36C006; letter-spacing: 3.84px; text-decoration: underline; text-decoration-style: dotted; text-decoration-thickness: 1px; text-underline-offset: 16%; transition: color 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-terms-promo-code { font-size: 20px; letter-spacing: 3.2px; } } .car-gifts-page #car-gifts-participate { background: linear-gradient(180deg, #020202 0%, #0e0e0e 100%); padding: 128px 0; } @media (max-width: 767px) { .car-gifts-page #car-gifts-participate { padding: 64px 20px; } } .car-gifts-page #car-gifts-participate .car-gifts-participate-header { margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page #car-gifts-participate .car-gifts-participate-header { margin-bottom: 32px; } } .inverted .car-gifts-page #car-gifts-participate { background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%); } .inverted .car-gifts-page #car-gifts-participate h2 { color: #2e2e2e !important; } .inverted .car-gifts-page #car-gifts-participate p { color: #6d6d6d !important; } .car-gifts-page .car-gifts-participate-cards { display: flex; flex-direction: column; gap: 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-cards { gap: 16px; } } .car-gifts-page .car-gifts-participate-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-row { grid-template-columns: 1fr; gap: 16px; } } .car-gifts-page .car-gifts-participate-card { position: relative; width: 100%; height: 100%; } .car-gifts-page .car-gifts-participate-card-inner { position: relative; background: #1a1a1a; border-radius: 16px; padding: 64px 48px; display: flex; flex-direction: column; gap: 32px; height: 100%; overflow: hidden; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-card-inner { padding: 32px; } } .inverted .car-gifts-page .car-gifts-participate-card-inner { background: #f1f1f1; } .car-gifts-page .car-gifts-participate-step-badge { position: absolute; top: 0; right: 0; width: 64px; height: 64px; background: #36C006; clip-path: polygon(100% 0, 0 0, 100% 100%); display: flex; align-items: flex-start; justify-content: flex-end; padding: 8px 12px; font-size: 20px; font-weight: 700; color: #020202; z-index: 2; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-step-badge { width: 64px; height: 64px; } } .car-gifts-page .car-gifts-participate-icon { width: 80px; height: 80px; position: relative; z-index: 1; } .car-gifts-page .car-gifts-participate-icon img { width: 100%; height: 100%; filter: brightness(0) invert(1); } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-icon { width: 64px; height: 64px; } } .inverted .car-gifts-page .car-gifts-participate-icon img { filter: brightness(0); } .car-gifts-page .car-gifts-participate-content { display: flex; flex-direction: column; gap: 24px; position: relative; z-index: 1; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-content { gap: 16px; } } .car-gifts-page .car-gifts-participate-title { font-size: 32px; font-weight: 700; color: #e2e2e2; margin: 0; line-height: normal; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-title { font-size: 24px; } } .inverted .car-gifts-page .car-gifts-participate-title { color: #2e2e2e; } .car-gifts-page .car-gifts-participate-description { font-size: 20px; font-weight: 400; color: #9d9d9d; margin: 0; line-height: 24px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-participate-description { font-size: 20px; line-height: 24px; } } .inverted .car-gifts-page .car-gifts-participate-description { color: #6d6d6d; } .car-gifts-page #car-gifts-faq { background: #111111; padding: 128px 0; } @media (max-width: 767px) { .car-gifts-page #car-gifts-faq { padding: 64px 20px; } } .car-gifts-page #car-gifts-faq .car-gifts-faq-header { margin-bottom: 64px; } @media (max-width: 767px) { .car-gifts-page #car-gifts-faq .car-gifts-faq-header { margin-bottom: 32px; } } .inverted .car-gifts-page #car-gifts-faq { background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%); } .inverted .car-gifts-page #car-gifts-faq h2 { color: #2e2e2e !important; } .inverted .car-gifts-page #car-gifts-faq p { color: #a1a1a1 !important; } .car-gifts-page .car-gifts-faq-items { max-width: 1146px; margin: 0 auto; display: flex; flex-direction: column; gap: 24px; } .car-gifts-page .car-gifts-faq-item { position: relative; border-radius: 12px; transition: all 0.3s ease; cursor: pointer; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item { border-radius: 16px; } } .car-gifts-page .car-gifts-faq-item:hover { background: #36c006; border-radius: 16px; } .car-gifts-page .car-gifts-faq-item:hover .car-gifts-faq-item-number, .car-gifts-page .car-gifts-faq-item:hover .car-gifts-faq-item-text { color: #0e0e0e; } .car-gifts-page .car-gifts-faq-item:hover .car-gifts-faq-item-icon { color: #0e0e0e; } .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active { background: #1a1a1a; border-radius: 16px; } .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-question { padding: 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-question { padding: 32px 16px 16px; } } .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-number, .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-text { color: #36c006; } .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-icon { color: #36c006; transform: rotate(270deg); } .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-answer { max-height: 500px; opacity: 1; padding-bottom: 32px; } .inverted .car-gifts-page .car-gifts-faq-item:hover { background: #36c006; } .inverted .car-gifts-page .car-gifts-faq-item:hover .car-gifts-faq-item-number, .inverted .car-gifts-page .car-gifts-faq-item:hover .car-gifts-faq-item-text { color: white; } .inverted .car-gifts-page .car-gifts-faq-item:hover .car-gifts-faq-item-icon { color: white; } .inverted .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active { background: white; } .inverted .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-number, .inverted .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-text { color: #36c006; } .inverted .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-icon { color: #36c006; } .inverted .car-gifts-page .car-gifts-faq-item.car-gifts-faq-item-active .car-gifts-faq-item-answer-text { color: #6d6d6d; } .inverted .car-gifts-page .car-gifts-faq-item .car-gifts-faq-item-number, .inverted .car-gifts-page .car-gifts-faq-item .car-gifts-faq-item-text { color: #2e2e2e; } .inverted .car-gifts-page .car-gifts-faq-item .car-gifts-faq-item-icon { color: #2e2e2e; } .car-gifts-page .car-gifts-faq-item-question { display: flex; align-items: center; gap: 64px; padding: 12px 32px; transition: all 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item-question { gap: 16px; padding: 12px 16px; } } .car-gifts-page .car-gifts-faq-item-number { width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 500; color: #e2e2e2; text-transform: uppercase; line-height: 1.1; flex-shrink: 0; transition: color 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item-number { width: auto; height: auto; padding: 0; font-size: 24px; font-weight: 500; margin-left: 36px; } } .car-gifts-page .car-gifts-faq-item-text { flex: 1; font-size: 32px; font-weight: 500; color: #e2e2e2; line-height: 1.1; transition: color 0.3s ease; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item-text { font-size: 24px; } } .car-gifts-page .car-gifts-faq-item-icon { width: 32px; height: 32px; flex-shrink: 0; color: #e2e2e2; transition: all 0.3s ease; } .car-gifts-page .car-gifts-faq-item-icon svg { width: 100%; height: 100%; display: block; } .car-gifts-page .car-gifts-faq-item-answer { max-height: 0; overflow: hidden; opacity: 0; transition: all 0.3s ease; position: relative; padding: 0 32px; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item-answer { padding: 0 16px; } } .car-gifts-page .car-gifts-faq-item-answer-line { position: absolute; left: 64px; top: 0; bottom: 32px; width: 1px; background: #36c006; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item-answer-line { left: 29px; bottom: 16px; } } .car-gifts-page .car-gifts-faq-item-answer-text { margin: 0; padding-left: 128px; padding-right: 64px; font-size: 16px; font-weight: 400; color: #9d9d9d; line-height: 1.4; } @media (max-width: 767px) { .car-gifts-page .car-gifts-faq-item-answer-text { padding-left: 32px; padding-right: 16px; } } /* Copy Platform page */ #copy-platform .btn-secondary-round { border: none; border-radius: 50px; background: #36C006; color: #0E0E0E; } #copy-platform .btn-primary-round { border: 4px solid #E2E2E2; border-radius: 50px; } .copy-platform-popup { padding: 100px 0; } .copy-platform-popup .content { display: flex; padding: 128px 200px; flex-direction: column; align-items: center; border-radius: 48px; background: #1A1A1A; } .copy-platform-popup .content .title { margin-top: 96px; color: var(--e2); text-align: center; font-size: 48px; font-weight: 700; } @media (max-width: 767.98px) { .copy-platform-popup .content .title { margin-top: 64px; line-height: 110%; } } .copy-platform-popup .content .subtitle { margin-top: 48px; margin-bottom: 0; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; letter-spacing: 0.48px; } @media (max-width: 767.98px) { .copy-platform-popup .content .subtitle { margin-top: 24px; font-size: 20px; line-height: 110%; letter-spacing: 0.4px; } } .copy-platform-popup .content .btn-primary-round { margin-top: 96px; border: 4px solid var(--e2); border-radius: 50px; color: var(--e2); font-size: 24px; font-weight: 600; line-height: 100.023%; letter-spacing: 0.48px; } @media (max-width: 767.98px) { .copy-platform-popup .content .btn-primary-round { margin-top: 64px; font-size: 20px; letter-spacing: 0.4px; } } @media (max-width: 767.98px) { .copy-platform-popup .content { padding: 96px 32px; border-radius: 0; } } @media (max-width: 767.98px) { .copy-platform-popup { padding: 50px 0; } } .copy-platform-1 { position: relative; padding-top: 160px; } .copy-platform-1__bg { position: absolute; } .copy-platform-1__bg picture { display: block; } @media (max-width: 767.98px) { .copy-platform-1__bg picture { display: none; } } .copy-platform-1__content { position: relative; padding-top: 128px; padding-bottom: 128px; } .copy-platform-1__content .copy-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .copy-platform-1__content .copy-bg .bg-1 { position: absolute; width: 100%; height: 100%; top: 45px; left: 730px; } @media (max-width: 767.98px) { .copy-platform-1__content .copy-bg .bg-1 { width: 80%; height: 80%; top: -10px; left: 130px; } } .copy-platform-1__content .copy-bg .bg-2 { position: absolute; width: 100%; height: 100%; top: 150px; left: 1050px; } @media (max-width: 767.98px) { .copy-platform-1__content .copy-bg .bg-2 { width: 50%; height: 50%; top: 0; left: 265px; } } .copy-platform-1__content .info { position: relative; z-index: 1; } .copy-platform-1__content .info .title { width: 100%; } .copy-platform-1__content .info .title h1 { color: var(--e2); font-size: 96px; font-weight: 500; line-height: 110%; } @media (max-width: 767.98px) { .copy-platform-1__content .info .title h1 { font-size: 48px; } } @media (max-width: 767.98px) { .copy-platform-1__content .info .title { width: 70%; } } .copy-platform-1__content .info .subtitle { width: 100%; padding-top: 48px; } .copy-platform-1__content .info .subtitle p { color: var(--a1); font-size: 32px; font-weight: 400; } @media (max-width: 767.98px) { .copy-platform-1__content .info .subtitle p { font-size: 24px; } } @media (max-width: 767.98px) { .copy-platform-1__content .info .subtitle { padding-top: 24px; } } .copy-platform-1__content .info .actions { width: 100%; padding-top: 96px; display: flex; flex-wrap: wrap; } .copy-platform-1__content .info .actions a { padding: 24px 64px; font-size: 24px; font-weight: 600; line-height: 100.023%; letter-spacing: 0.48px; } .copy-platform-1__content .info .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .copy-platform-1__content .info .actions a:first-child { margin-right: 0; margin-bottom: 16px; } } @media (max-width: 767.98px) { .copy-platform-1__content .info .actions a { width: 100%; font-size: 20px; } } @media (max-width: 767.98px) { .copy-platform-1__content .info .actions { padding-top: 64px; } } @media (max-width: 767.98px) { .copy-platform-1__content { padding-top: 64px; padding-bottom: 64px; } } @media (max-width: 767.98px) { .copy-platform-1 { padding-top: 100px; } } .copy-platform-2 { position: relative; padding-top: 128px; padding-bottom: 128px; } .copy-platform-2 .title { width: 100%; } .copy-platform-2 .title p { color: var(--e2); font-size: 48px; font-weight: 700; margin: 0; } .copy-platform-2 .subtitle { width: 100%; padding-top: 48px; } .copy-platform-2 .subtitle p { color: var(--a1); font-size: 32px; font-weight: 400; margin: 0; } .copy-platform-2 .subtitle p:last-child { margin-top: 20px; color: var(--green); } @media (max-width: 767.98px) { .copy-platform-2 { padding-top: 64px; padding-bottom: 64px; } } .copy-platform-3 { position: relative; } .copy-platform-3__bg-1 { position: absolute; width: 400px; height: 400px; right: 150px; top: 150px; border-radius: 32px; background: linear-gradient(45deg, #0E0E0E 20.5%, #1C1C1C 100%); } @media (max-width: 767.98px) { .copy-platform-3__bg-1 { transform: rotate(90deg); right: -128px; top: 1700px; } } .copy-platform-3__bg-2 { position: absolute; width: 246px; height: 246px; left: 200px; bottom: 64px; border-radius: 32px; background: linear-gradient(45deg, #1C1C1C 0%, #0E0E0E 80%); } @media (max-width: 767.98px) { .copy-platform-3__bg-2 { transform: rotate(90deg); left: -64px; bottom: 1670px; } } .copy-platform-3__content { padding-top: 128px; padding-bottom: 128px; } .copy-platform-3__content .info .title { width: 100%; } .copy-platform-3__content .info .title p { color: var(--e2); font-size: 48px; font-weight: 500; line-height: 110%; margin: 0; } @media (max-width: 767.98px) { .copy-platform-3__content .info .title p { font-size: 40px; } } .copy-platform-3__content .cards { padding-top: 64px; display: flex; justify-content: space-between; flex-wrap: wrap; } .copy-platform-3__content .cards .card { width: 49%; padding: 80px 48px; border-radius: 32px; background: var(--black-100); } .copy-platform-3__content .cards .card .logo { display: block; } .copy-platform-3__content .cards .card .title { padding-top: 48px; } .copy-platform-3__content .cards .card .title p { color: #E2E2E2; font-size: 40px; font-weight: 600; line-height: 110%; } @media (max-width: 767.98px) { .copy-platform-3__content .cards .card .title { padding-top: 32px; } } .copy-platform-3__content .cards .card .description { padding-top: 32px; } .copy-platform-3__content .cards .card .description p { color: var(--a1); font-size: 20px; font-weight: 400; line-height: 110%; letter-spacing: 0.4px; } @media (max-width: 767.98px) { .copy-platform-3__content .cards .card .description { padding-top: 24px; } } .copy-platform-3__content .cards .card:nth-child(3), .copy-platform-3__content .cards .card:last-child { margin-top: 16px; } @media (max-width: 767.98px) { .copy-platform-3__content .cards .card:nth-child(3), .copy-platform-3__content .cards .card:last-child { margin-top: 0; } } @media (max-width: 767.98px) { .copy-platform-3__content .cards .card { width: 100%; padding: 48px 32px; margin-bottom: 16px; } .copy-platform-3__content .cards .card:last-child { margin-bottom: 0; } } @media (max-width: 767.98px) { .copy-platform-3__content { padding-top: 64px; padding-bottom: 64px; } } .copy-platform-4 { position: relative; padding-top: 128px; padding-bottom: 128px; } .copy-platform-4 .info .title { width: 100%; } .copy-platform-4 .info .title p { color: var(--e2); font-size: 48px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .copy-platform-4 .info .title p { font-size: 36px; } } .copy-platform-4 .steps { padding-top: 64px; } .copy-platform-4 .steps ul li { position: relative; padding: 32px 16px 32px 80px; border-radius: 24px; border: 1px solid #444; margin-bottom: 16px; } .copy-platform-4 .steps ul li:before { content: ""; position: absolute; left: 40px; top: 55px; width: 10px; height: 10px; border-radius: 50%; background-color: var(--green); } @media (max-width: 767.98px) { .copy-platform-4 .steps ul li:before { top: 45px; width: 7px; height: 7px; } } .copy-platform-4 .steps ul li p { color: var(--e2); font-size: 40px; font-weight: 700; } @media (max-width: 767.98px) { .copy-platform-4 .steps ul li p { font-size: 24px; } } .copy-platform-4 .steps ul li:last-child { margin-bottom: 0; } @media (max-width: 767.98px) { .copy-platform-4 .steps ul li { padding-left: 70px; } } @media (max-width: 767.98px) { .copy-platform-4 .steps { padding-top: 32px; } } @media (max-width: 767.98px) { .copy-platform-4 { padding-top: 64px; padding-bottom: 64px; } } .copy-platform-5 { position: relative; } .copy-platform-5__bg { position: absolute; } .copy-platform-5__bg picture { display: block; } @media (max-width: 767.98px) { .copy-platform-5__bg picture { display: none; } } .copy-platform-5__content { padding-top: 128px; padding-bottom: 128px; } .copy-platform-5__content .copy-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .copy-platform-5__content .copy-bg .bg-1 { display: block; position: absolute; width: 100%; height: 100%; top: -110px; left: 585px; } @media (max-width: 767.98px) { .copy-platform-5__content .copy-bg .bg-1 { display: none; } } .copy-platform-5__content .copy-bg .bg-2 { display: none; } @media (max-width: 767.98px) { .copy-platform-5__content .copy-bg .bg-2 { display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 55px; } } .copy-platform-5__content .copy-bg .bg-3 { position: absolute; width: 100%; height: 100%; top: 100px; left: 1040px; } @media (max-width: 767.98px) { .copy-platform-5__content .copy-bg .bg-3 { width: 50%; height: 50%; top: 0px; left: 265px; } } .copy-platform-5__content .info { position: relative; z-index: 1; } .copy-platform-5__content .info .title { width: 70%; } .copy-platform-5__content .info .title p { color: var(--e2); font-size: 96px; font-weight: 500; line-height: 110%; } @media (max-width: 767.98px) { .copy-platform-5__content .info .title p { font-size: 48px; } } @media (max-width: 767.98px) { .copy-platform-5__content .info .title { width: 100%; } } .copy-platform-5__content .info .subtitle { width: 70%; padding-top: 48px; } .copy-platform-5__content .info .subtitle p { color: var(--a1); font-size: 32px; font-weight: 400; } @media (max-width: 767.98px) { .copy-platform-5__content .info .subtitle p { font-size: 24px; line-height: 110%; letter-spacing: 0.48px; } } @media (max-width: 767.98px) { .copy-platform-5__content .info .subtitle { width: 100%; padding-top: 32px; } } .copy-platform-5__content .info .actions { width: 100%; padding-top: 128px; display: flex; flex-wrap: wrap; } .copy-platform-5__content .info .actions a { padding: 24px 64px; font-size: 24px; font-weight: 600; line-height: 100.023%; letter-spacing: 0.48px; } @media (max-width: 767.98px) { .copy-platform-5__content .info .actions a { font-size: 20px; } } @media (max-width: 767.98px) { .copy-platform-5__content .info .actions { padding-top: 64px; } } @media (max-width: 767.98px) { .copy-platform-5__content { padding-top: 64px; padding-bottom: 64px; } } .copy-platform-6 { position: relative; padding-top: 128px; padding-bottom: 128px; background: #1A1A1A; } .copy-platform-6 .info { margin-bottom: 64px; } .copy-platform-6 .info .title { width: 100%; } .copy-platform-6 .info .title p { color: var(--e2); font-size: 48px; font-weight: 500; line-height: 110%; margin: 0; } @media (max-width: 767.98px) { .copy-platform-6 .info .title p .icon { width: 48px; height: 48px; } } @media (max-width: 767.98px) { .copy-platform-6 .info .title { font-size: 48px; } } @media (max-width: 767.98px) { .copy-platform-6 .info { margin-bottom: 48px; } } .copy-platform-6 form .field { padding: 32px 64px; margin-bottom: 24px; background-color: #202020 !important; position: relative; border-radius: 24px; transition: all 0.25s cubic-bezier(0.6, 0, 0.25, 1); } .copy-platform-6 form .field .form_row { margin-bottom: 0; } .copy-platform-6 form .field .form_row label { display: block; margin-bottom: 24px; color: #E2E2E2; font-size: 24px; font-style: normal; font-weight: 500; line-height: 110%; letter-spacing: 0.48px; } .copy-platform-6 form .field .form_row input { background-color: transparent; border: none; border-bottom-color: var(--gray-100); font-family: Inter, sans-serif; line-height: 1.1; font-weight: 600; font-size: clamp(20px, 1.25rem + 18 * (100vw - 375px) / 905, 38px); text-overflow: ellipsis; width: 100%; padding: 0; } .copy-platform-6 form .field .form_row input:focus { outline: none; } .copy-platform-6 form .field .form_row input::-moz-placeholder { color: #444; font-size: 32px; font-weight: 600; line-height: 110%; } .copy-platform-6 form .field .form_row input::placeholder { color: #444; font-size: 32px; font-weight: 600; line-height: 110%; } @media (max-width: 767.98px) { .copy-platform-6 form .field .form_row input::-moz-placeholder { font-size: 20px; } .copy-platform-6 form .field .form_row input::placeholder { font-size: 20px; } } .copy-platform-6 form .field:focus-within { box-shadow: 0 0 0 3px #36C006 inset !important; background-color: transparent !important; } .copy-platform-6 form .field:has([aria-invalid=true]) { box-shadow: 0 0 0 3px #D92252 inset !important; } .copy-platform-6 form .field:has([aria-invalid=true]) input::-moz-placeholder { color: var(--color-red-100); } .copy-platform-6 form .field:has([aria-invalid=true]) input::placeholder { color: var(--color-red-100); } @media (max-width: 767.98px) { .copy-platform-6 form .field { padding: 32px 24px; } } .copy-platform-6 form .btn { width: 100%; margin-top: 64px; padding-top: 24px !important; padding-bottom: 24px !important; font-size: 24px; font-weight: 600; line-height: 100.023%; letter-spacing: 0.48px; } @media (max-width: 767.98px) { .copy-platform-6 form .btn { margin-top: 48px; font-size: 20px; } } @media (max-width: 767.98px) { .copy-platform-6 { padding-top: 64px; padding-bottom: 64px; } } .copy-platform-7 { position: relative; padding-top: 128px; padding-bottom: 128px; } .copy-platform-7 .info .title { width: 100%; } .copy-platform-7 .info .title p { color: var(--e2); font-size: 48px; font-weight: 700; line-height: 110%; margin: 0; } .copy-platform-7 .questions { position: relative; padding-top: 64px; width: 100%; max-width: 1300px; margin: 0 auto; } .copy-platform-7 .questions .content-collapsed { transition: none !important; } .copy-platform-7 .questions .content-collapsed .question-description { max-height: 0 !important; } .copy-platform-7 .questions .content-collapsed .question-description .question-content { max-height: 0 !important; padding: 0 !important; } .copy-platform-7 .questions .content-collapsed:hover { transition: 0.3s ease-in-out; background-color: var(--green); } .copy-platform-7 .questions .content-collapsed:hover .question-header .question-number { color: var(--cod-gray); } .copy-platform-7 .questions .content-collapsed:hover .question-header .question-title { color: var(--cod-gray); } .copy-platform-7 .questions .content-collapsed:hover .question-header .icon { fill: var(--cod-gray); } .copy-platform-7 .questions .content-expanded { transition: 0.3s ease-in-out; padding-bottom: 0 !important; } .copy-platform-7 .questions .content-expanded .question-header .question-number { color: var(--green) !important; } .copy-platform-7 .questions .content-expanded .question-header .question-title { color: var(--green) !important; } .copy-platform-7 .questions .content-expanded .question-header .icon { transform: rotate(180deg); fill: var(--green) !important; } .copy-platform-7 .questions .content-expanded .question-description { transition: 0.3s ease-in-out; } .copy-platform-7 .questions .content-expanded .question-description .question-content { color: var(--a1); font-size: 16px; line-height: 140%; padding: 32px 78px; } .copy-platform-7 .questions .content-expanded .question-description .question-content-point { padding: 16px 0; } .copy-platform-7 .questions .content-expanded .question-description .question-content-point ul { padding-top: 16px; list-style-position: inside; list-style-type: disc; } @media (max-width: 991.98px) { .copy-platform-7 .questions .content-expanded .question-description .question-content-point ul { padding-top: 6px; } } @media (max-width: 991.98px) { .copy-platform-7 .questions .content-expanded .question-description .question-content-point { padding: 6px 0; } } @media (max-width: 991.98px) { .copy-platform-7 .questions .content-expanded .question-description .question-content { padding: 24px 12px; } } .copy-platform-7 .questions .content-expanded .question-description:before { content: ""; border-left: var(--green) 2px solid; margin-left: 14px; } .copy-platform-7 .questions .question { margin: 24px 0; color: var(--e2); width: 100%; padding: 32px; background-color: var(--black-100); border-radius: 24px; } .copy-platform-7 .questions .question .question-header .question-number { color: var(--e2); font-size: 20px; font-weight: 500; } .copy-platform-7 .questions .question .question-header .question-title { color: var(--e2); margin-left: 64px; font-size: 20px; font-weight: 500; line-height: 110%; } @media (max-width: 991.98px) { .copy-platform-7 .questions .question .question-header .question-title { font-size: 16px; margin-left: 20px; } } .copy-platform-7 .questions .question .question-header .icon { stroke-width: 3px; transition: all 0.3s; } .copy-platform-7 .questions .question .question-description { overflow: hidden; transition: 0.3s ease-in-out; } @media (max-width: 991.98px) { .copy-platform-7 .questions { margin: 0; padding: 48px 0 0; } } @media (max-width: 767.98px) { .copy-platform-7 { padding-top: 64px; padding-bottom: 64px; } } /* VPS page */ .vps-1 { position: relative; padding-top: 284px; } .vps-1 .container { z-index: 1; } .vps-1 .vps-1__title { font-size: 64px; font-weight: 700; } @media (max-width: 991.98px) { .vps-1 .vps-1__title { font-size: 48px; } } .vps-1 .vps-1__description { color: #A1A1A1; padding-top: 45px; font-size: 24px; line-height: 32px; } .vps-1 .vps-1__link { text-align: left; } .vps-1 .vps-1__link a { text-decoration: none; border-bottom: 1px var(--green) dashed; padding-bottom: 5px; padding-top: 45px; font-size: 16px; line-height: 32px; } @media (max-width: 991.98px) { .vps-1 .vps-1__link { text-align: center; } } .vps-1__image { display: flex; justify-content: center; } .vps-1__image .icon { width: 165.87px; height: 245.33px; } @media (max-width: 991.98px) { .vps-1__image { padding: 48px 0; } } .vps-1__bg { position: absolute; left: 0; top: 0; width: 100%; } .vps-1__bg:before { content: ""; } .vps-2 { padding-top: 128px; } .vps-2 .vps-2__benefits-cards .vps-2__benefits-card { padding: 48px 32px; } .vps-2 .vps-2__benefits-cards .vps-2__benefits-card .icon { width: 64px; height: 64px; } .vps-2 .vps-2__benefits-cards .vps-2__benefits-card-title { color: #E2E2E2; padding: 48px 0; font-size: 32px; font-weight: 700; line-height: 38px; } @media (max-width: 767.98px) { .vps-2 .vps-2__benefits-cards .vps-2__benefits-card-title { padding-top: 32px; padding-bottom: 12px; font-size: 16px; line-height: 19px; } } .vps-2 .vps-2__benefits-cards .vps-2__benefits-card-description { color: #A1A1A1; font-size: 20px; line-height: 24px; } @media (max-width: 767.98px) { .vps-2 .vps-2__benefits-cards .vps-2__benefits-card-description { font-size: 12px; line-height: 16px; } } .vps-2 .vps-2__benefits-cards .vps-2__benefits-card:nth-child(2) { border-right: #222222 1px solid; border-left: #222222 1px solid; } @media (max-width: 767.98px) { .vps-2 .vps-2__benefits-cards .vps-2__benefits-card:nth-child(2) { border-right: none !important; } } @media (max-width: 767.98px) { .vps-2 .vps-2__benefits-cards .vps-2__benefits-card { padding: 32px 20px; } .vps-2 .vps-2__benefits-cards .vps-2__benefits-card:nth-child(3) { border-top: #222222 1px solid; border-bottom: #222222 1px solid; } } .vps-2 .vps-2__benefits-cards:nth-child(2) { border-top: #222222 1px solid; border-bottom: #222222 1px solid; } @media (max-width: 767.98px) { .vps-2 .vps-2__benefits-cards:nth-child(2) { border: none !important; } } .vps-3 { padding-top: 128px; } .vps-3__title { color: #E2E2E2; font-size: 48px; font-weight: 700; } @media (max-width: 991.98px) { .vps-3__title { font-size: 40px; } } .vps-3 .vps-3__tariffs { display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: 96px; } .vps-3 .vps-3__tariffs .vps-3__tariff-card { width: 30%; padding: 48px 32px; background-color: #1A1A1A; border-radius: 24px; border-top: 8px var(--green) solid; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-title .vps-3__tariff-logo .icon { width: 64px; height: 64px; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-title .vps-3__tariff-name { padding-left: 32px; color: #E2E2E2; font-size: 24px; font-weight: 700; line-height: 90%; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-price { color: #E2E2E2; padding: 48px 0; font-size: 24px; font-weight: 700; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-points { font-size: 20px; color: #A1A1A1; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-points ul { list-style-position: inside; list-style-type: disc; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-points ul li { padding-top: 20px; } .vps-3 .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-more { padding-top: 48px; } .vps-3 .vps-3__tariffs .vps-3__tariff-card:nth-child(2) { margin: 0 30px; } @media (max-width: 991.98px) { .vps-3 .vps-3__tariffs .vps-3__tariff-card { width: 100%; } .vps-3 .vps-3__tariffs .vps-3__tariff-card:nth-child(2) { margin: 0; } } @media (max-width: 991.98px) { .vps-3 .vps-3__tariffs { display: none !important; } } .vps-3 .vps-3__tariffs-mobile { display: none; } @media (max-width: 991.98px) { .vps-3 .vps-3__tariffs-mobile { display: block; font-size: 48px; padding-top: 96px; } .vps-3 .vps-3__tariffs-mobile .flickity-viewport { width: 100%; overflow: visible; } .vps-3 .vps-3__tariffs-mobile .flickity-page-dots { position: relative; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div { width: 100%; min-height: 100%; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card { width: 90%; min-height: 100%; padding: 48px 32px; background-color: #1A1A1A; border-radius: 24px; border-top: 8px var(--green) solid; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-title .vps-3__tariff-logo .icon { width: 64px; height: 64px; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-title .vps-3__tariff-name { padding-left: 32px; color: white; font-size: 24px; font-weight: 700; line-height: 90%; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-price { padding: 48px 0; font-size: 24px; font-weight: 700; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-points { font-size: 20px; color: #A1A1A1; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-points ul { list-style-position: inside; list-style-type: disc; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-points ul li { padding-top: 20px; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-more { font-size: 20px; padding-top: 48px; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card:nth-child(2) { margin: 0 30px; } } @media (max-width: 991.98px) and (max-width: 991.98px) { .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card { width: 100%; } .vps-3 .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card:nth-child(2) { margin: 0; } } .vps-4 { padding-top: 128px; } .vps-4__title { color: #E2E2E2; font-size: 64px; font-weight: 700; } @media (max-width: 991.98px) { .vps-4__title { font-size: 48px; } } .vps-4__subtitle { color: #A1A1A1; padding-top: 48px; font-size: 24px; line-height: 32px; } .vps-4__steps { width: 100%; padding-top: 96px; } .vps-4__steps .vps-4__step { width: 30%; border-radius: 24px; background-color: #1A1A1A; padding: 48px; } .vps-4__steps .vps-4__step-logo { display: flex; justify-content: center; } .vps-4__steps .vps-4__step-logo .icon { width: 200px; height: 200px; } .vps-4__steps .vps-4__step-button { display: flex; justify-content: center; margin-top: 48px; } @media (max-width: 991.98px) { .vps-4__steps .vps-4__step { width: 100%; } .vps-4__steps .vps-4__step:nth-child(2) { margin: 30px 0; } } .vps-4__steps .done { background-color: transparent; } .vps-4__steps .done .vps-4__step-button button { background: transparent !important; border-style: dashed; } .vps-4__steps .done .vps-4__step-logo .icon { fill: var(--green); } .vps-4__steps .done .vps-4__step-logo .icon use { fill: var(--green); } .vps-4__steps .disabled .vps-4__step-button button { opacity: 0.3; } .vps-4__steps .disabled .vps-4__step-logo .icon { fill: #3A3A3A; } .vps-4__steps .disabled .vps-4__step-logo .icon use { fill: #3A3A3A; } .vps-4__bg { position: absolute; left: 0; top: 0; width: 100%; } .vps-4__bg:before { content: ""; } .vps-5 { padding-top: 128px; } .vps-5__title { position: relative; width: 100%; max-width: 1300px; padding: 0 var(--container-gap); margin: 0 auto; color: #E2E2E2; font-size: 40px; font-weight: 700; line-height: 110%; } .vps-5__terms { position: relative; width: 100%; max-width: 1300px; padding: 96px var(--container-gap) 0; margin: 0 auto; } .vps-5__terms .content-collapsed { transition: none !important; } .vps-5__terms .content-collapsed .vps-5__term-description { max-height: 0 !important; } .vps-5__terms .content-collapsed .vps-5__term-description .vps-5__term-content { max-height: 0 !important; padding: 0 !important; } .vps-5__terms .content-collapsed:hover { transition: 0.3s ease-in-out; background-color: var(--green); } .vps-5__terms .content-collapsed:hover .vps-5__term-header .vps-5__term-number { color: #0E0E0E; } .vps-5__terms .content-collapsed:hover .vps-5__term-header .vps-5__term-title { color: #0E0E0E; } .vps-5__terms .content-collapsed:hover .vps-5__term-header .icon { fill: #0E0E0E; } @media (max-width: 991.98px) { .vps-5__terms .content-collapsed { border-radius: 0 !important; } } .vps-5__terms .content-expanded { transition: 0.3s ease-in-out; border-bottom: 8px var(--green) solid; padding-bottom: 0 !important; } .vps-5__terms .content-expanded .vps-5__term-header .vps-5__term-number { color: var(--green); } .vps-5__terms .content-expanded .vps-5__term-header .icon { transform: rotate(90deg); fill: #E2E2E2; } .vps-5__terms .content-expanded .vps-5__term-description { transition: 0.3s ease-in-out; } .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content { color: #A1A1A1; font-size: 16px; line-height: 140%; padding: 32px 78px; } .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content-point { padding: 16px 0; } .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content-point ul { padding-top: 16px; list-style-position: inside; list-style-type: disc; } @media (max-width: 991.98px) { .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content-point ul { padding-top: 6px; } } @media (max-width: 991.98px) { .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content-point { padding: 6px 0; } } @media (max-width: 991.98px) { .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content { padding: 24px 12px; } } .vps-5__terms .content-expanded .vps-5__term-description:before { content: ""; border-left: var(--green) 2px solid; margin-left: 14px; } .vps-5__terms .vps-5__term { margin: 24px 0; color: #E2E2E2; width: 100%; padding: 32px; background-color: #1A1A1A; border-radius: 12px; } .vps-5__terms .vps-5__term .vps-5__term-header .vps-5__term-number { color: #E2E2E2; font-size: 20px; font-weight: 500; } .vps-5__terms .vps-5__term .vps-5__term-header .vps-5__term-title { color: #E2E2E2; margin-left: 64px; font-size: 32px; font-weight: 500; line-height: 110%; } @media (max-width: 991.98px) { .vps-5__terms .vps-5__term .vps-5__term-header .vps-5__term-title { font-size: 20px; margin-left: 0; } } .vps-5__terms .vps-5__term .vps-5__term-header .icon { stroke-width: 3px; transition: all 0.3s; } .vps-5__terms .vps-5__term .vps-5__term-description { overflow: hidden; transition: 0.3s ease-in-out; } @media (max-width: 991.98px) { .vps-5__terms .vps-5__term { padding: 12px 20px; } } @media (max-width: 991.98px) { .vps-5__terms { padding: 48px 0 0; } } .vps-6 { padding-top: 64px; padding-bottom: 64px; background-color: #161616; } .vps-6__title p { color: var(--e2); font-size: 24px; font-weight: 700; line-height: 32px; text-transform: uppercase; margin: 0; } .vps-6__awards { position: relative; overflow: visible; margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; align-self: stretch; } @media (width < 600px) { .vps-6__awards > .vps-6__award:nth-child(-n+2) { display: none; } } .vps-6__awards .vps-6__award { --move-x: 0px; --move-y: 0px; position: relative; display: flex; text-decoration: none; cursor: pointer; padding: 16px 0 16px 6px; height: 128px; width: 128px; min-width: 128px; border-radius: 16px; opacity: 0.48; gap: 7px; transform: translate3d(var(--move-x), var(--move-y), 0) scale(1); transform-origin: center center; transition: transform 0.22s ease-out, opacity 0.25s ease, background-color 0.25s ease; will-change: transform; } .vps-6__awards .vps-6__award-title { width: 75px; color: #9D9D9D; font-size: 14px; font-weight: 500; line-height: 86%; font-variant: all-small-caps; letter-spacing: -0.56px; } .vps-6__awards .vps-6__award-year { position: absolute; bottom: 16px; color: #9D9D9D; font-size: 16px; font-weight: 700; } .vps-6__awards .vps-6__award-bg { position: relative; } .vps-6__awards .vps-6__award-bg .icon { width: 100%; height: 100%; } .vps-6__awards .vps-6__award:first-child { margin-left: 0 !important; } .vps-6__awards .vps-6__award:last-child { margin-right: 0 !important; } .vps-6__awards .vps-6__award:hover { z-index: 20; opacity: 1; background-color: #262626; transform: translate3d(var(--move-x), var(--move-y), 0) scale(2); } .vps-6__awards .vps-6__award:hover .vps-6__award-title { color: #FFF; } .vps-6__awards .vps-6__award:hover .vps-6__award-year { color: #36C006; } .vps-6__awards .vps-6__award:hover .vps-6__award-bg .icon { fill: var(--green); stroke: var(--green); } .vps-6__awards .vps-6__award-more { display: flex; flex-wrap: wrap; padding: 16px; height: 128px; width: 128px; min-width: 128px; text-decoration: none; cursor: pointer; border-radius: 16px; background: rgba(226, 226, 226, 0.04); } .vps-6__awards .vps-6__award-more-text { width: 100%; } .vps-6__awards .vps-6__award-more-text p { color: var(--e2); font-size: 14px; font-weight: 500; line-height: 14px; font-variant: all-small-caps; letter-spacing: -0.56px; margin: 0; } .vps-6__awards .vps-6__award-more-actions { margin-top: auto; margin-left: auto; } .vps-6__copyright { margin-top: 32px; } .vps-6__copyright p { color: #6D6D6D; font-size: 16px; font-weight: 400; line-height: 24px; margin: 0; } /* VPS page (inverted) */ .inverted .vps-1 .vps-1__description { color: #444444; } .inverted .vps-2 .vps-2__benefits-cards .vps-2__benefits-card-title { color: #1A1A1A; } .inverted .vps-2 .vps-2__benefits-cards .vps-2__benefits-card-description { color: #444444; } .inverted .vps-3__title { color: black; } .inverted .vps-3__tariffs .vps-3__tariff-card { background-color: #F0F0F0; } .inverted .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-title .vps-3__tariff-name { color: #1A1A1A; } .inverted .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-price { color: #1A1A1A; } .inverted .vps-3__tariffs .vps-3__tariff-card .vps-3__tariff-points { color: #444444; } .inverted .vps-3__tariffs-mobile .flickity-page-dots .is-selected { background: #36C006; } .inverted .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card { background-color: #F0F0F0; } .inverted .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-title .vps-3__tariff-name { color: #1A1A1A; } .inverted .vps-3__tariffs-mobile .flickity-slider > div .vps-3__tariff-card .vps-3__tariff-points { color: #444444; } .inverted .vps-4__title { color: #1A1A1A; } .inverted .vps-4__subtitle { color: #444444; } .inverted .vps-4__steps .vps-4__step { background-color: #FFFFFF; } .inverted .vps-4__steps .disabled .vps-4__step-logo .icon { fill: #CECECE; } .inverted .vps-4__steps .disabled .vps-4__step-logo .icon use { fill: #CECECE; } .inverted .vps-5__title { color: #1A1A1A; } .inverted .vps-5__terms .content-collapsed:hover { transition: 0.3s ease-in-out; background-color: var(--green); color: #FFFFFF; } .inverted .vps-5__terms .content-collapsed:hover .vps-5__term-header .vps-5__term-number { color: #FFFFFF; } .inverted .vps-5__terms .content-collapsed:hover .vps-5__term-header .vps-5__term-title { color: #FFFFFF; } .inverted .vps-5__terms .content-collapsed:hover .vps-5__term-header .icon { fill: #FFFFFF; } .inverted .vps-5__terms .content-expanded .vps-5__term-header .icon { fill: #1A1A1A; } .inverted .vps-5__terms .content-expanded .vps-5__term-description .vps-5__term-content { color: #444444; } .inverted .vps-5__terms .vps-5__term { color: #1A1A1A; background-color: #FFFFFF; } .inverted .vps-5__terms .vps-5__term .vps-5__term-header .vps-5__term-number { color: #1A1A1A; } .inverted .vps-5__terms .vps-5__term .vps-5__term-header .vps-5__term-title { color: #1A1A1A; } .inverted .vps-6 { background-color: #FFFFFF; } .inverted .vps-6__awards .vps-6__award:hover { background-color: #FAFAFA; } .inverted .vps-6__awards .vps-6__award:hover .vps-6__award-title { color: #000; } .inverted .vps-6__awards .vps-6__award-more { background: rgba(46, 46, 46, 0.08); } /* PROP TRADING page */ .prop-trading-1 { position: relative; padding-top: 160px; } .prop-trading-1__bg { position: absolute; left: 0; top: 160px; min-width: 100%; } .prop-trading-1__bg picture { display: block; } .prop-trading-1__bg picture img { min-width: 100%; } @media (max-width: 767.98px) { .prop-trading-1__bg picture { display: none; } } .prop-trading-1__bg .mobile { display: none; } @media (max-width: 767.98px) { .prop-trading-1__bg .mobile { display: block; } } @media (max-width: 767.98px) { .prop-trading-1__bg { top: 70px; } } .prop-trading-1__content { padding-top: 128px; padding-bottom: 128px; } .prop-trading-1__content .info .title { width: 100%; } .prop-trading-1__content .info .title h1 { color: var(--e2); font-size: 96px; font-weight: 700; text-align: center; } @media (max-width: 767.98px) { .prop-trading-1__content .info .title h1 { font-size: 48px; } } .prop-trading-1__content .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-1__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .prop-trading-1__content .actions { width: 100%; padding-top: 96px; display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-1__content .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .prop-trading-1__content .actions a:first-child { margin-right: 0; margin-bottom: 32px; } } @media (max-width: 767.98px) { .prop-trading-1__content .actions a { width: 100%; } } @media (max-width: 767.98px) { .prop-trading-1__content .actions { padding-top: 64px; } } @media (max-width: 767.98px) { .prop-trading-1 { padding-top: 70px; } } .prop-trading-2 { position: relative; padding-top: 128px; padding-bottom: 128px; } .prop-trading-2 .info { display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-2 .info .title { width: 100%; } .prop-trading-2 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .prop-trading-2 .info .title { font-size: 48px; } } .prop-trading-2 .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-2 .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .prop-trading-2 .info .subtitle { padding-top: 32px; } } .prop-trading-2 .cards { padding-top: 64px; display: flex; justify-content: space-between; } .prop-trading-2 .cards .card { display: flex; justify-content: center; flex-wrap: wrap; padding: 64px 48px; border-radius: 24px; background: var(--black-100); align-items: center; } .prop-trading-2 .cards .card .logo { display: flex; justify-content: center; } .prop-trading-2 .cards .card .title { padding-top: 32px; } .prop-trading-2 .cards .card .title p { color: #36C006; text-align: center; font-size: 32px; font-weight: 700; } .prop-trading-2 .cards .card .description { padding-top: 16px; } .prop-trading-2 .cards .card .description p { color: var(--e2); text-align: center; font-size: 20px; font-weight: 400; line-height: 24px; } .prop-trading-2 .cards .card:nth-child(2) { margin: 0 32px; } @media (max-width: 767.98px) { .prop-trading-2 .cards .card:nth-child(2) { margin: 16px 0; } } @media (max-width: 767.98px) { .prop-trading-2 .cards .card { padding: 32px 24px; } } @media (max-width: 767.98px) { .prop-trading-2 .cards { flex-wrap: wrap; } } @media (max-width: 767.98px) { .prop-trading-2 { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-3 { position: relative; } .prop-trading-3__bg { position: absolute; left: 0; top: 0; width: 100%; } .prop-trading-3__bg picture img { width: 100%; } .prop-trading-3__content { padding-top: 128px; padding-bottom: 128px; } .prop-trading-3__content .info .title { width: 100%; } .prop-trading-3__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; } @media (max-width: 767.98px) { .prop-trading-3__content .info .title p { font-size: 48px; } } .prop-trading-3__content .cards { display: flex; flex-wrap: wrap; padding-top: 64px; } .prop-trading-3__content .cards .card { width: 50%; display: flex; flex-wrap: wrap; padding: 64px 48px; align-items: center; } .prop-trading-3__content .cards .card .logo { width: 100%; display: flex; justify-content: center; } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card .logo { display: block; } } .prop-trading-3__content .cards .card .title { width: 100%; padding-top: 64px; } .prop-trading-3__content .cards .card .title p { color: var(--e2); text-align: center; font-size: 32px; font-weight: 700; } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card .title p { text-align: left; } } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card .title { padding-top: 48px; } } .prop-trading-3__content .cards .card .subtitle { width: 100%; padding-top: 24px; } .prop-trading-3__content .cards .card .subtitle p { color: var(--a1); text-align: center; font-size: 20px; font-weight: 400; } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card .subtitle p { text-align: left; } } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card .subtitle { padding-top: 16px; } } .prop-trading-3__content .cards .card:first-child { border-right: 1px solid var(--gray-300); border-bottom: 1px solid var(--gray-300); } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card:first-child { border: none; } } .prop-trading-3__content .cards .card:last-child { border-top: 1px solid var(--gray-300); border-left: 1px solid var(--gray-300); } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card:last-child { border: none; } } @media (max-width: 767.98px) { .prop-trading-3__content .cards .card { padding: 32px 24px; width: 100%; } } @media (max-width: 767.98px) { .prop-trading-3__content { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-4 { position: relative; padding-top: 128px; padding-bottom: 128px; background: var(--black-300); } .prop-trading-4 .info { display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-4 .info .title { width: 100%; } .prop-trading-4 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .prop-trading-4 .info .title p { font-size: 48px; } } .prop-trading-4 .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-4 .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .prop-trading-4 .info .subtitle { padding-top: 32px; } } .prop-trading-4 .cards { width: 100%; padding-top: 64px; display: flex; flex-wrap: wrap; } .prop-trading-4 .cards .card { width: 30%; display: flex; flex-wrap: wrap; padding: 64px 48px; border-radius: 24px; border: 4px solid #36C006; background: var(--black-100); } .prop-trading-4 .cards .card .title { width: 100%; } .prop-trading-4 .cards .card .title p { color: #36C006; font-size: 32px; font-weight: 700; } .prop-trading-4 .cards .card .points { width: 100%; padding-top: 24px; } .prop-trading-4 .cards .card .points ul { list-style-position: inside; list-style-type: disc; } .prop-trading-4 .cards .card .points ul li { padding-top: 15px; color: var(--e2); font-size: 20px; font-weight: 400; line-height: 24px; } @media (max-width: 767.98px) { .prop-trading-4 .cards .card .points { padding-top: 16px; } } .prop-trading-4 .cards .card:nth-child(2) { margin: 0 32px; } @media (max-width: 767.98px) { .prop-trading-4 .cards .card:nth-child(2) { margin: 16px 0; } } @media (max-width: 767.98px) { .prop-trading-4 .cards .card { width: 100%; padding: 32px 24px; } } .prop-trading-4 .actions { width: 100%; padding-top: 64px; display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-4 .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .prop-trading-4 .actions a:first-child { margin-right: 0; margin-bottom: 32px; } } @media (max-width: 767.98px) { .prop-trading-4 .actions a { width: 100%; } } @media (max-width: 767.98px) { .prop-trading-4 { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-5 { position: relative; } .prop-trading-5__bg { position: absolute; left: 0; top: 0; width: 100%; } .prop-trading-5__bg picture img { width: 100%; } .prop-trading-5__content { padding-top: 128px; padding-bottom: 128px; } .prop-trading-5__content .info { display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-5__content .info .title { width: 100%; } .prop-trading-5__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .prop-trading-5__content .info .title p { font-size: 48px; } } .prop-trading-5__content .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-5__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .prop-trading-5__content .info .subtitle { padding-top: 32px; } } .prop-trading-5__content .stories { width: 100%; margin-top: 96px; padding: 64px 128px; border-radius: 24px; background: var(--black-100); } .prop-trading-5__content .stories .flickity-viewport { width: 100%; overflow: visible; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div { min-height: 100%; opacity: 0; transition: opacity 0.3s; will-change: opacity; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div.is-selected { opacity: 1; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story { position: relative; width: 100%; display: flex; flex-direction: column; align-items: flex-start; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user { display: flex; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .avatar { width: 64px; height: 64px; padding: 16px; border-radius: 32px; background: #0E0E0E; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .info { margin-left: 32px; display: flex; flex-wrap: wrap; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .info .username { width: 100%; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .info .username p { color: #36C006; font-size: 20px; font-weight: 700; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .info .role { width: 100%; padding-top: 16px; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .info .role p { color: var(--a1); font-size: 16px; font-weight: 400; } @media (max-width: 767.98px) { .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .user .info .role { padding-top: 8px; } } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .comment { padding: 48px 0; } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .comment p { color: var(--e2); font-size: 20px; font-style: italic; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .comment { padding: 32px 0; } } .prop-trading-5__content .stories .flickity-viewport .flickity-slider > div .story .subtitle p { color: var(--a1); font-size: 14px; font-weight: 400; line-height: 16px; letter-spacing: 0.28px; } .prop-trading-5__content .stories .flickity-button { background: transparent !important; color: var(--gray-100) !important; } .prop-trading-5__content .stories .previous { left: 48px !important; } @media (max-width: 767.98px) { .prop-trading-5__content .stories .previous { display: none; } } .prop-trading-5__content .stories .next { right: 48px !important; } @media (max-width: 767.98px) { .prop-trading-5__content .stories .next { display: none; } } .prop-trading-5__content .stories .flickity-page-dots { position: absolute; left: 0; bottom: -50px; } .prop-trading-5__content .stories .flickity-page-dots .dot { background: var(--gray-300); opacity: 1; } .prop-trading-5__content .stories .flickity-page-dots .dot.is-selected { background: var(--green); } @media (max-width: 767.98px) { .prop-trading-5__content .stories { margin-top: 64px; padding: 32px; } } @media (max-width: 767.98px) { .prop-trading-5__content { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-6 { position: relative; padding-top: 128px; padding-bottom: 128px; } .prop-trading-6 .info { display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-6 .info .title { width: 100%; } .prop-trading-6 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .prop-trading-6 .info .title p { font-size: 48px; } } .prop-trading-6 .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-6 .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .prop-trading-6 .info .subtitle { padding-top: 32px; } } .prop-trading-6 .start_amount { margin-top: 64px; width: 100%; display: flex; padding: 24px; align-items: center; gap: 24px; align-self: stretch; border-radius: 12px; background: var(--black-300); } .prop-trading-6 .start_amount .amount { display: flex; width: 30%; padding: 12px 24px; align-items: center; gap: 16px; border-radius: 6px; background: var(--black-100); white-space: nowrap; flex-wrap: wrap; } .prop-trading-6 .start_amount .amount .title p { color: var(--e2); font-size: 16px; font-weight: 400; line-height: 18px; } .prop-trading-6 .start_amount .amount .sum p { color: #36C006; text-align: right; font-size: 24px; font-weight: 700; line-height: 32px; } @media (max-width: 1199.98px) { .prop-trading-6 .start_amount .amount { width: 100%; background: none; justify-content: space-between; padding: 0; } } .prop-trading-6 .start_amount .slider-container { width: 70%; } .prop-trading-6 .start_amount .slider-container .slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; height: 0; padding: 0; border: 1px solid #000; background: var(--black); cursor: pointer; } .prop-trading-6 .start_amount .slider-container .slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 16px; background: url("../images/svg/slider.svg") center no-repeat; cursor: pointer; border: 2px solid #36C006; border-radius: 2px; box-shadow: -600px 0 0 600px #36C006; } .prop-trading-6 .start_amount .slider-container .slider::-moz-range-thumb { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 24px; height: 24px; background: url("../images/svg/slider.svg") center no-repeat; cursor: pointer; border: 2px solid #36C006; border-radius: 2px; box-shadow: -600px 0 0 600px #36C006; } .prop-trading-6 .start_amount .slider-container .slider::-webkit-slider-runnable-track { background: transparent; cursor: pointer; overflow: hidden; border-radius: 8px; height: 16px; } @media (max-width: 1199.98px) { .prop-trading-6 .start_amount .slider-container { width: 100%; } } @media (max-width: 1199.98px) { .prop-trading-6 .start_amount { flex-wrap: wrap; } } .prop-trading-6 .steps { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-around; align-content: stretch; margin: 32px 0; } .prop-trading-6 .steps .step { display: flex; flex-wrap: wrap; min-width: 325px; width: 32%; align-self: stretch; } .prop-trading-6 .steps .step .title { width: 100%; margin: 0; color: var(--e2); font-size: 32px; font-weight: 600; line-height: 48px; white-space: nowrap; } @media (max-width: 767.98px) { .prop-trading-6 .steps .step .title { text-align: center; } } .prop-trading-6 .steps .step .subtitle { width: 100%; margin-top: 12px; margin-bottom: 0; color: var(--a1); font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.32px; } @media (max-width: 767.98px) { .prop-trading-6 .steps .step .subtitle { text-align: center; } } .prop-trading-6 .steps .step .card { margin-top: 24px; display: flex; padding: 24px; flex-direction: column; align-items: flex-start; gap: 24px; align-self: stretch; border-radius: 12px; border: 6px dashed var(--black-100); background: var(--black-100); } .prop-trading-6 .steps .step .card .info { display: block; width: 100%; } .prop-trading-6 .steps .step .card .info .point { display: flex; padding: 8px; justify-content: space-between; align-items: center; align-self: stretch; border-radius: 12px; background: var(--alabaster-solid); margin-top: 8px; } .prop-trading-6 .steps .step .card .info .point .name { display: flex; padding: 6px 12px; align-items: center; gap: 12px; } .prop-trading-6 .steps .step .card .info .point .name p { color: var(--a1); font-size: 14px; font-weight: 400; letter-spacing: 0.28px; } .prop-trading-6 .steps .step .card .info .point .value { display: flex; padding: 12px 24px; justify-content: flex-end; align-items: center; gap: 12px; border-radius: 8px; background: var(--black-100); } .prop-trading-6 .steps .step .card .info .point .value p { color: var(--e2); font-size: 16px; font-weight: 600; } .prop-trading-6 .steps .step .card .info .point:first-child { margin: 0; } .prop-trading-6 .steps .step .description p { color: var(--a1); font-size: 16px; font-weight: 400; line-height: 20px; letter-spacing: 0.32px; } .prop-trading-6 .steps .step .benefits ul li { position: relative; padding-left: 1em; margin-bottom: 0.5em; color: var(--e2); font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: 0.32px; } .prop-trading-6 .steps .step .benefits ul li:before { content: ""; position: absolute; left: 0; top: 0.5em; width: 0.25em; height: 0.25em; border-radius: 50%; background-color: currentColor; } @media (max-width: 767.98px) { .prop-trading-6 .steps .step:nth-child(2) { margin: 12px 0; } } .prop-trading-6 .actions { width: 100%; padding-top: 64px; display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-6 .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .prop-trading-6 .actions a:first-child { margin-right: 0; margin-bottom: 32px; } } @media (max-width: 767.98px) { .prop-trading-6 .actions a { width: 100%; } } @media (max-width: 767.98px) { .prop-trading-6 { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-7 { position: relative; } .prop-trading-7__bg { position: absolute; left: 0; top: 0; width: 100%; } .prop-trading-7__bg picture img { min-width: 100%; } @media (max-width: 767.98px) { .prop-trading-7__bg picture { display: none; } } .prop-trading-7__bg .mobile { display: none; } @media (max-width: 767.98px) { .prop-trading-7__bg .mobile { display: block; } } @media (max-width: 767.98px) { .prop-trading-7__bg { top: 247px; } } .prop-trading-7__content { padding-top: 128px; padding-bottom: 128px; } .prop-trading-7__content .info { display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-7__content .info .title { width: 100%; } .prop-trading-7__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .prop-trading-7__content .info .title p { font-size: 48px; } } .prop-trading-7__content .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-7__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .prop-trading-7__content .info .subtitle { padding-top: 32px; } } .prop-trading-7__content .telegram { padding-top: 64px; display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-7__content .telegram .logo { width: 96px; height: 96px; padding: 28px; border-radius: 128px; background: var(--black-100); } .prop-trading-7__content .telegram .title { width: 100%; padding-top: 24px; } .prop-trading-7__content .telegram .title p { color: var(--e2); text-align: center; font-size: 24px; font-weight: 600; line-height: 32px; } .prop-trading-7__content .telegram .subtitle { width: 100%; padding-top: 12px; } .prop-trading-7__content .telegram .subtitle p { color: var(--a1); text-align: center; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.32px; } .prop-trading-7__content .telegram .qr { margin-top: 24px; padding: 24px; border-radius: 12px; border: 6px dashed #FFF; background: #FFF; } .prop-trading-7__content .telegram .qr img { width: 150px; height: 150px; } .prop-trading-7__content .telegram .description { margin-top: 64px; width: 100%; } .prop-trading-7__content .telegram .description p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .prop-trading-7__content .telegram .link { margin-top: 12px; width: 100%; text-align: center; } .prop-trading-7__content .telegram .link a { color: #36C006; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .prop-trading-7__content .actions { width: 100%; padding-top: 64px; display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-7__content .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .prop-trading-7__content .actions a:first-child { margin-right: 0; margin-bottom: 32px; } } @media (max-width: 767.98px) { .prop-trading-7__content .actions a { width: 100%; } } @media (max-width: 767.98px) { .prop-trading-7__content { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-8 { position: relative; padding-top: 128px; padding-bottom: 128px; } .prop-trading-8 .info .title { width: 100%; } .prop-trading-8 .info .title p { color: var(--e2); text-align: center; font-size: 48px; font-weight: 700; } @media (max-width: 767.98px) { .prop-trading-8 .info .title p { font-size: 32px; } } .prop-trading-8 .table { margin-top: 32px; width: 100%; } .prop-trading-8 .table .row { margin-bottom: 5px; } .prop-trading-8 .table .row > div { padding: 12px; } .prop-trading-8 .table .row:nth-child(odd) { background: #1A1A1A; } .prop-trading-8 .table .row:nth-child(even) { background: #1E1E1E; } .prop-trading-8 .table .row:first-child { border-radius: 16px 16px 0 0; background: #2A2A2A; } .prop-trading-8 .table .row:last-child { border-radius: 0 0 16px 16px; } .prop-trading-8 .table .row .value { padding: 20px; background: #2A2A2A; font-weight: 700; color: #36c006; border-radius: 5px; } @media (max-width: 575px) { .prop-trading-8 header { display: none; } .prop-trading-8 .value { width: 100%; } .prop-trading-8 .label { color: var(--e2); font-size: 14px; font-weight: 900; } } @media (min-width: 576px) { .prop-trading-8 .table { margin-top: 64px; display: grid; grid-template-columns: repeat(3, auto) max-content; } .prop-trading-8 .table .row { display: grid; grid-column: 1/4; grid-template-columns: subgrid; align-items: center; padding-left: 1.875rem; padding-right: 1.875rem; } .prop-trading-8 .table .row > div { max-width: unset; width: auto; } .prop-trading-8 .table .row .label { display: none; } .prop-trading-8 .table .row .value { width: 50%; } } @media (max-width: 767.98px) { .prop-trading-8 { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-9 { position: relative; padding-top: 128px; padding-bottom: 128px; background: var(--black-300); } .prop-trading-9 .info .title { width: 100%; } .prop-trading-9 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; } @media (max-width: 767.98px) { .prop-trading-9 .info .title p { font-size: 48px; } } .prop-trading-9 .questions { position: relative; width: 100%; max-width: 1300px; padding: 96px var(--container-gap) 0; margin: 64px auto 0; } .prop-trading-9 .questions .content-collapsed { transition: none !important; } .prop-trading-9 .questions .content-collapsed .question-description { max-height: 0 !important; } .prop-trading-9 .questions .content-collapsed .question-description .question-content { max-height: 0 !important; padding: 0 !important; } .prop-trading-9 .questions .content-collapsed:hover { transition: 0.3s ease-in-out; background-color: var(--green); } .prop-trading-9 .questions .content-collapsed:hover .question-header .question-number { color: var(--cod-gray); } .prop-trading-9 .questions .content-collapsed:hover .question-header .question-title { color: var(--cod-gray); } .prop-trading-9 .questions .content-collapsed:hover .question-header .icon { fill: var(--cod-gray); } @media (max-width: 991.98px) { .prop-trading-9 .questions .content-collapsed { border-radius: 0 !important; } } .prop-trading-9 .questions .content-expanded { transition: 0.3s ease-in-out; border-bottom: 8px var(--green) solid; padding-bottom: 0 !important; } .prop-trading-9 .questions .content-expanded .question-header .question-number { color: var(--green); } .prop-trading-9 .questions .content-expanded .question-header .icon { transform: rotate(90deg); fill: var(--e2); } .prop-trading-9 .questions .content-expanded .question-description { transition: 0.3s ease-in-out; } .prop-trading-9 .questions .content-expanded .question-description .question-content { color: var(--a1); font-size: 16px; line-height: 140%; padding: 32px 78px; } .prop-trading-9 .questions .content-expanded .question-description .question-content-point { padding: 16px 0; } .prop-trading-9 .questions .content-expanded .question-description .question-content-point ul { padding-top: 16px; list-style-position: inside; list-style-type: disc; } @media (max-width: 991.98px) { .prop-trading-9 .questions .content-expanded .question-description .question-content-point ul { padding-top: 6px; } } @media (max-width: 991.98px) { .prop-trading-9 .questions .content-expanded .question-description .question-content-point { padding: 6px 0; } } @media (max-width: 991.98px) { .prop-trading-9 .questions .content-expanded .question-description .question-content { padding: 24px 12px; } } .prop-trading-9 .questions .content-expanded .question-description:before { content: ""; border-left: var(--green) 2px solid; margin-left: 14px; } .prop-trading-9 .questions .question { margin: 24px 0; color: var(--e2); width: 100%; padding: 32px; background-color: var(--black-100); border-radius: 12px; } .prop-trading-9 .questions .question .question-header .question-number { color: var(--e2); font-size: 20px; font-weight: 500; } .prop-trading-9 .questions .question .question-header .question-title { color: var(--e2); margin-left: 64px; font-size: 32px; font-weight: 500; line-height: 110%; } @media (max-width: 991.98px) { .prop-trading-9 .questions .question .question-header .question-title { font-size: 20px; margin-left: 0; } } .prop-trading-9 .questions .question .question-header .icon { stroke-width: 3px; transition: all 0.3s; } .prop-trading-9 .questions .question .question-description { overflow: hidden; transition: 0.3s ease-in-out; } @media (max-width: 991.98px) { .prop-trading-9 .questions .question { padding: 12px 20px; } } @media (max-width: 991.98px) { .prop-trading-9 .questions { margin: 0; padding: 48px 0 0; } } @media (max-width: 767.98px) { .prop-trading-9 { padding-top: 64px; padding-bottom: 64px; } } .prop-trading-10 { position: relative; } .prop-trading-10__bg { position: absolute; left: 0; top: 0; width: 100%; } .prop-trading-10__bg picture img { min-width: 100%; } @media (max-width: 767.98px) { .prop-trading-10__bg picture { display: none; } } .prop-trading-10__bg .mobile { display: none; } @media (max-width: 767.98px) { .prop-trading-10__bg .mobile { display: block; } } .prop-trading-10__content { padding-top: 128px; padding-bottom: 128px; } .prop-trading-10__content .info { display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-10__content .info .title { width: 100%; } .prop-trading-10__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .prop-trading-10__content .info .title p { font-size: 48px; } } .prop-trading-10__content .info .subtitle { width: 100%; padding-top: 48px; } .prop-trading-10__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .prop-trading-10__content .actions { width: 100%; padding-top: 64px; display: flex; justify-content: center; flex-wrap: wrap; } .prop-trading-10__content .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .prop-trading-10__content .actions a:first-child { margin-right: 0; margin-bottom: 32px; } } @media (max-width: 767.98px) { .prop-trading-10__content .actions a { width: 100%; } } @media (max-width: 767.98px) { .prop-trading-10__content { padding-top: 64px; padding-bottom: 64px; } } /* PROP TRADING page (inverted) */ .inverted .prop-trading-4 .card { background: #FFF; } .inverted .prop-trading-5 .avatar { background: #2E2E2E; } .inverted .prop-trading-6 .amount { background: #FFF; } .inverted .prop-trading-8 .table .row:nth-child(odd) { background: var(--black-300); } .inverted .prop-trading-8 .table .row:nth-child(even) { background: var(--black-100); } .inverted .prop-trading-8 .table .row:first-child { background: var(--black-300); } .inverted .prop-trading-8 .table .row .value { background: #FFF; } .inverted .prop-trading-3__bg .inverted-visible, .inverted .prop-trading-5__bg .inverted-visible, .inverted .prop-trading-10__bg .inverted-visible { display: block !important; } @media (max-width: 767.98px) { .inverted .prop-trading-3__bg .inverted-visible, .inverted .prop-trading-5__bg .inverted-visible, .inverted .prop-trading-10__bg .inverted-visible { display: none !important; } } .inverted .qr { border: 6px dashed var(--black-100) !important; background: var(--black-100) !important; } /* Meta Trader page */ .meta-trader-1 { position: relative; padding-top: 160px; padding-bottom: 128px; } .meta-trader-1__bg { position: absolute; left: 0; top: 0; min-width: 100%; } .meta-trader-1__bg:before { content: ""; } .meta-trader-1__bg picture img { min-width: 100%; min-height: 100%; } .meta-trader-1__bg .desktop { display: block; } @media (max-width: 767.98px) { .meta-trader-1__bg .desktop { display: none; } } .meta-trader-1__bg .mobile { margin-top: 70px; display: none; } @media (max-width: 767.98px) { .meta-trader-1__bg .mobile { display: block; } } .meta-trader-1__bg .mobile picture img { min-width: 120%; min-height: 120%; } .meta-trader-1__content .meta-trader-logo img { width: 128px; height: 128px; } .meta-trader-1__content .info { width: 100%; } .meta-trader-1__content .info .title { margin-top: 64px; color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; } @media (max-width: 767.98px) { .meta-trader-1__content .info .title { margin-top: 32px; font-size: 48px; } } .meta-trader-1__content .info .description { margin-top: 48px; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .meta-trader-1__content .info .description { margin-top: 32px; font-size: 24px; } } .meta-trader-1__content .actions { margin-top: 48px; display: flex; justify-content: center; align-items: center; } .meta-trader-1__content .actions .btn { padding: 19px 71px; } @media (max-width: 767.98px) { .meta-trader-1__content .actions .btn { width: 100%; } } .meta-trader-1__content .actions .divider { margin: 0 64px; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .meta-trader-1__content .actions .divider { width: 100%; margin: 32px 0; } } .meta-trader-1__content .actions .meta-trader-1__link { color: #36C006; text-align: center; font-size: 24px; font-weight: 700; text-decoration: none; border-bottom: 1px var(--green) dashed; } @media (max-width: 767.98px) { .meta-trader-1__content .actions { flex-wrap: wrap; margin-top: 32px; } } .meta-trader-2 { padding-top: 128px; padding-bottom: 128px; } .meta-trader-2 .nav { flex-wrap: nowrap; } .meta-trader-2 .nav .nav-item .nav-link { display: flex; flex-wrap: wrap; padding: 6px 0; align-items: flex-end; color: var(--a1); font-size: 48px; font-weight: 900; background-color: transparent !important; } @media (max-width: 767.98px) { .meta-trader-2 .nav .nav-item .nav-link { font-size: 32px; font-weight: 700; } } .meta-trader-2 .nav .nav-item .active { color: var(--white); border-bottom: 2px solid #36C006; } .meta-trader-2 .nav .nav-item:last-child { margin-left: 64px; } @media (max-width: 767.98px) { .meta-trader-2 .nav .nav-item:last-child { margin-left: 32px; } } .meta-trader-2 .tab-content .tab-pane .info { margin-top: 32px; color: var(--a1); font-size: 18px; font-weight: 400; line-height: 25px; } @media (max-width: 991.98px) { .meta-trader-2 .tab-content .tab-pane .info { margin-top: 24px; } } @media (max-width: 767.98px) { .meta-trader-2 .tab-content .tab-pane .info { margin-top: 16px; } } .meta-trader-2 .tab-content .tab-pane .points { margin-top: 64px; } .meta-trader-2 .tab-content .tab-pane .points .point { display: flex; align-items: center; } .meta-trader-2 .tab-content .tab-pane .points .point .number { text-align: right; font-size: 48px; font-weight: 700; line-height: 97.188%; } .meta-trader-2 .tab-content .tab-pane .points .point .text { margin-left: 16px; color: var(--e2); font-size: 24px; font-weight: 400; line-height: 97.188%; text-transform: capitalize; } @media (max-width: 767.98px) { .meta-trader-2 .tab-content .tab-pane .points .point { margin-bottom: 16px; } .meta-trader-2 .tab-content .tab-pane .points .point:last-child { margin-bottom: 0; } } .meta-trader-2 .tab-content .tab-pane .cards { width: 100%; padding-top: 64px; display: flex; flex-wrap: wrap; justify-content: space-between; } .meta-trader-2 .tab-content .tab-pane .cards .card { width: 49.5%; display: flex; flex-wrap: wrap; padding: 48px 32px; border-radius: 24px; background: var(--black-100); } .meta-trader-2 .tab-content .tab-pane .cards .card:first-child { width: 100%; margin-bottom: 16px; } @media (max-width: 767.98px) { .meta-trader-2 .tab-content .tab-pane .cards .card:last-child { margin-top: 16px; } } .meta-trader-2 .tab-content .tab-pane .cards .card .title { width: 100%; padding-top: 32px; } .meta-trader-2 .tab-content .tab-pane .cards .card .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: 117.27%; } .meta-trader-2 .tab-content .tab-pane .cards .card .description { padding-top: 32px; } .meta-trader-2 .tab-content .tab-pane .cards .card .description p { color: var(--a1); font-size: 20px; font-weight: 400; line-height: 24px; } @media (max-width: 767.98px) { .meta-trader-2 .tab-content .tab-pane .cards .card { width: 100%; padding: 32px; } } @media (max-width: 767.98px) { .meta-trader-2 { padding-top: 64px; padding-bottom: 64px; } } .meta-trader-3__bg { position: absolute; left: 0; top: 0; width: 100%; } .meta-trader-3__bg:before { content: ""; } .meta-trader-3__bg picture img { min-width: 100%; min-height: 100%; } .meta-trader-3__bg .desktop { display: block; } @media (max-width: 767.98px) { .meta-trader-3__bg .desktop { display: none; } } .meta-trader-3__bg .mobile { display: none; } @media (max-width: 767.98px) { .meta-trader-3__bg .mobile { display: block; } } .meta-trader-3__content { padding-top: 128px; padding-bottom: 128px; } .meta-trader-3__content .meta-trader-3__logo { width: 100%; display: flex; justify-content: center; align-items: end; } .meta-trader-3__content .meta-trader-3__logo .icon { margin-right: 32px; } .meta-trader-3__content .meta-trader-3__logo .icon:first-child { width: 60px; height: 60px; } @media (max-width: 767.98px) { .meta-trader-3__content .meta-trader-3__logo .icon:first-child { width: 48px; height: 48px; } } .meta-trader-3__content .meta-trader-3__logo .icon:nth-child(2) { width: 96px; height: 96px; } @media (max-width: 767.98px) { .meta-trader-3__content .meta-trader-3__logo .icon:nth-child(2) { width: 72px; height: 72px; } } .meta-trader-3__content .meta-trader-3__logo .icon:nth-child(3) { width: 128px; height: 128px; } @media (max-width: 767.98px) { .meta-trader-3__content .meta-trader-3__logo .icon:nth-child(3) { width: 96px; height: 96px; } } .meta-trader-3__content .meta-trader-3__logo .icon:last-child { margin-right: 0; width: 80px; height: 80px; } @media (max-width: 767.98px) { .meta-trader-3__content .meta-trader-3__logo .icon:last-child { width: 60px; height: 60px; } } @media (max-width: 767.98px) { .meta-trader-3__content .meta-trader-3__logo .icon { margin-right: 16px; } } .meta-trader-3__content .info { width: 100%; } .meta-trader-3__content .info .title { margin-top: 64px; color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; } @media (max-width: 767.98px) { .meta-trader-3__content .info .title { margin-top: 32px; font-size: 48px; } } .meta-trader-3__content .info .description { margin-top: 48px; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .meta-trader-3__content .info .description { margin-top: 32px; font-size: 24px; } } .meta-trader-3__content .actions { margin-top: 64px; display: flex; justify-content: center; align-items: center; } .meta-trader-3__content .actions .btn { padding: 19px 71px; } @media (max-width: 767.98px) { .meta-trader-3__content .actions { margin-top: 32px; } } @media (max-width: 767.98px) { .meta-trader-3__content { padding-top: 64px; padding-bottom: 64px; } } .meta-trader-4 { padding-top: 128px; padding-bottom: 128px; } .meta-trader-4 .info { width: 100%; } .meta-trader-4 .info .title { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; } @media (max-width: 767.98px) { .meta-trader-4 .info .title { font-size: 36px; } } .meta-trader-4 .info .description { margin-top: 32px; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .meta-trader-4 .info .description { margin-top: 16px; } } .meta-trader-4 .cards { width: 100%; padding-top: 64px; display: flex; flex-wrap: wrap; justify-content: space-between; } .meta-trader-4 .cards .card { width: 49%; display: flex; flex-wrap: wrap; padding: 48px 32px; border-radius: 24px; background: var(--black-100); } .meta-trader-4 .cards .card .title { width: 100%; padding-top: 48px; } .meta-trader-4 .cards .card .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: 117.27%; } @media (max-width: 767.98px) { .meta-trader-4 .cards .card .title p { line-height: normal; } } @media (max-width: 767.98px) { .meta-trader-4 .cards .card .title { padding-top: 32px; } } .meta-trader-4 .cards .card .description { padding-top: 24px; } .meta-trader-4 .cards .card .description p { color: var(--a1); font-size: 20px; font-weight: 400; line-height: 24px; } @media (max-width: 767.98px) { .meta-trader-4 .cards .card .description p { line-height: normal; } } @media (max-width: 767.98px) { .meta-trader-4 .cards .card .description { padding-top: 16px; } } @media (max-width: 767.98px) { .meta-trader-4 .cards .card:nth-child(2) { margin-top: 16px; } } .meta-trader-4 .cards .card:nth-child(3), .meta-trader-4 .cards .card:last-child { margin-top: 24px; } @media (max-width: 767.98px) { .meta-trader-4 .cards .card:nth-child(3), .meta-trader-4 .cards .card:last-child { margin-top: 16px; } } @media (max-width: 767.98px) { .meta-trader-4 .cards .card { width: 100%; padding: 32px; } } @media (max-width: 767.98px) { .meta-trader-4 .cards { padding-top: 32px; } } @media (max-width: 767.98px) { .meta-trader-4 { padding-top: 64px; padding-bottom: 64px; } } .meta-trader-5 { padding-top: 128px; padding-bottom: 128px; border-radius: 24px; } .meta-trader-5 .info { width: 100%; padding: 32px 0; background: #0E0E0E; } .meta-trader-5 .info .title { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; } @media (max-width: 767.98px) { .meta-trader-5 .info .title { font-size: 36px; } } .meta-trader-5 .info .description { margin-top: 32px; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .meta-trader-5 .info .description { margin-top: 16px; } } @media (max-width: 767.98px) { .meta-trader-5 .info { padding: 32px 16px; } } .meta-trader-5 .meta-trader-logo { margin-top: 64px; width: 100%; display: flex; justify-content: center; } .meta-trader-5 .meta-trader-logo img { width: 128px; height: 128px; } @media (max-width: 767.98px) { .meta-trader-5 .meta-trader-logo { margin-top: 32px; } } .meta-trader-5 .nav { margin-top: 64px; flex-wrap: nowrap; } .meta-trader-5 .nav .nav-item .nav-link { display: flex; flex-wrap: wrap; padding: 6px 0; align-items: flex-end; color: var(--a1); font-size: 48px; font-weight: 900; background-color: transparent !important; } @media (max-width: 767.98px) { .meta-trader-5 .nav .nav-item .nav-link { font-size: 32px; font-weight: 700; } } .meta-trader-5 .nav .nav-item .active { color: var(--white); border-bottom: 2px solid #36C006; } .meta-trader-5 .nav .nav-item:last-child { margin-left: 64px; } @media (max-width: 767.98px) { .meta-trader-5 .nav .nav-item:last-child { margin-left: 32px; } } @media (max-width: 767.98px) { .meta-trader-5 .nav { margin-top: 32px; } } .meta-trader-5 .tab-content { margin-top: 64px; } .meta-trader-5 .tab-content .tab-pane .available { display: flex; justify-content: center; flex-wrap: wrap; } .meta-trader-5 .tab-content .tab-pane .available .title { margin-top: 32px; width: 100%; } .meta-trader-5 .tab-content .tab-pane .available .title p { color: var(--e2); text-align: center; font-size: 32px; font-weight: 700; } @media (max-width: 767.98px) { .meta-trader-5 .tab-content .tab-pane .available .title p { font-size: 24px; } } @media (max-width: 767.98px) { .meta-trader-5 .tab-content .tab-pane .available .title { margin-top: 16px; } } .meta-trader-5 .tab-content .tab-pane .available .description { margin-top: 16px; width: 100%; } .meta-trader-5 .tab-content .tab-pane .available .description p { color: var(--a1); text-align: center; font-size: 20px; font-weight: 400; } .meta-trader-5 .tab-content .tab-pane .available .link { margin-top: 32px; width: 100%; text-align: center; } .meta-trader-5 .tab-content .tab-pane .available .link a { color: #36C006; font-size: 24px; font-weight: 400; text-decoration-line: underline; text-decoration-style: solid; } @media (max-width: 767.98px) { .meta-trader-5 .tab-content .tab-pane .available { margin-bottom: 32px; } } @media (max-width: 767.98px) { .meta-trader-5 .tab-content .tab-pane .available:last-child { margin-bottom: 0; } } @media (max-width: 767.98px) { .meta-trader-5 .tab-content { margin-top: 32px; } } @media (max-width: 767.98px) { .meta-trader-5 { padding-top: 64px; padding-bottom: 64px; } } /* Meta Trader page (inverted) */ .inverted .meta-trader-5 .info { background: #FFF; } /* Awards page */ .awards-1 { position: relative; padding-top: 160px; } .awards-1__bg { position: absolute; left: 0; top: 0; width: 100%; } .awards-1__bg picture img { width: 100%; } .awards-1__bg .desktop { display: block; } @media (max-width: 767.98px) { .awards-1__bg .desktop { display: none; } } .awards-1__bg .mobile { display: none; } @media (max-width: 767.98px) { .awards-1__bg .mobile { display: block; } } .awards-1__bg .mobile picture img { min-width: 120%; min-height: 120%; } .awards-1__content { padding-top: 128px; padding-bottom: 128px; } .awards-1__content .award-icons { display: flex; justify-content: center; } .awards-1__content .award-icons .award-icon { margin-right: 72px; } .awards-1__content .award-icons .award-icon:last-child { margin-right: 0; } @media (max-width: 767.98px) { .awards-1__content .award-icons .award-icon { margin-right: 24px; } } .awards-1__content .info { margin-top: 48px; display: flex; justify-content: center; flex-wrap: wrap; } .awards-1__content .info .title { width: 100%; } .awards-1__content .info .title p { color: var(--e2); text-align: center; font-size: 96px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .awards-1__content .info .title p { font-size: 48px; } } .awards-1__content .info .description { width: 100%; padding-top: 48px; } .awards-1__content .info .description p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; margin: 0; } @media (max-width: 767.98px) { .awards-1__content .info .description { padding-top: 32px; } } @media (max-width: 767.98px) { .awards-1__content .info { margin-top: 32px; } } .awards-2 { position: relative; padding-top: 128px; padding-bottom: 128px; } .awards-2 .awards-blog { width: 100%; margin-bottom: 64px; } .awards-2 .awards-blog .awards-year { width: 100%; display: flex; align-items: center; } .awards-2 .awards-blog .awards-year .year { display: flex; align-items: center; } .awards-2 .awards-blog .awards-year .year p { color: var(--e2); font-size: 40px; font-weight: 700; font-variant: all-small-caps; margin: 0; } .awards-2 .awards-blog .awards-year:before { content: ""; order: 1; width: 5px; height: 5px; background-color: #36C006; border-radius: 50%; margin-left: 24px; flex-shrink: 0; } .awards-2 .awards-blog .awards-year:after { position: relative; content: ""; order: 2; flex-grow: 1; height: 1px; background-color: #36C006; margin-left: -2px; } .awards-2 .awards-blog .awards-list { display: flex; flex-wrap: wrap; margin-top: 64px; row-gap: 40px; } .awards-2 .awards-blog .awards-list .award { width: 50%; display: flex; align-items: center; padding: 0 24px; } .awards-2 .awards-blog .awards-list .award .logo { position: relative; width: 200px; height: 280px; flex-shrink: 0; display: flex; justify-content: center; align-items: center; } .awards-2 .awards-blog .awards-list .award .logo img { position: relative; z-index: 2; max-width: 100%; max-height: 100%; width: auto; height: auto; -o-object-fit: contain; object-fit: contain; } .awards-2 .awards-blog .awards-list .award .logo:before { position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 145.5px; height: 145.5px; border-radius: 50%; background-color: rgba(54, 192, 6, 0.32); z-index: 1; } .awards-2 .awards-blog .awards-list .award .info { display: flex; align-items: center; flex-wrap: wrap; margin-left: 24px; } .awards-2 .awards-blog .awards-list .award .info .title { width: 100%; } .awards-2 .awards-blog .awards-list .award .info .title p { color: var(--e2); font-size: 24px; font-weight: 400; margin: 0; } .awards-2 .awards-blog .awards-list .award .info .subtitle { margin-top: 24px; width: 100%; } .awards-2 .awards-blog .awards-list .award .info .subtitle p { color: var(--e2); font-size: 20px; font-weight: 400; line-height: 24px; margin: 0; } @media (max-width: 767.98px) { .awards-2 .awards-blog .awards-list .award .info .subtitle { margin-top: 8px; } } .awards-2 .awards-blog .awards-list .award .info .year { margin-top: 16px; width: 100%; } .awards-2 .awards-blog .awards-list .award .info .year p { color: var(--a1); font-size: 16px; font-weight: 400; line-height: 24px; margin: 0; } @media (max-width: 767.98px) { .awards-2 .awards-blog .awards-list .award .info { margin-left: 0; margin-top: 24px; } } @media (max-width: 767.98px) { .awards-2 .awards-blog .awards-list .award { width: 100%; flex-wrap: wrap; } } @media (max-width: 767.98px) { .awards-2 .awards-blog .awards-list { margin-top: 32px; flex-direction: column; row-gap: 12px; } } .awards-2 .awards-blog:last-child { margin-bottom: 0; } @media (max-width: 767.98px) { .awards-2 .awards-blog { margin-bottom: 32px; } } /* Affiliate Webinar page */ .affiliate-webinar-1 { padding-top: 160px; } .affiliate-webinar-1__bg { position: absolute; left: 0; top: 160px; width: 1920px; height: 1107px; } .affiliate-webinar-1__bg picture img { min-width: 100%; } @media (max-width: 767.98px) { .affiliate-webinar-1__bg { left: -773px; top: 70px; } } .affiliate-webinar-1__content { position: relative; padding-top: 128px; padding-bottom: 128px; z-index: 1; } .affiliate-webinar-1__content .info { display: flex; justify-content: center; flex-wrap: wrap; } .affiliate-webinar-1__content .info .logo { display: flex; padding: 12px 24px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; background: #36C006; } .affiliate-webinar-1__content .info .logo p { color: #0E0E0E; font-size: 16px; font-weight: 700; text-transform: uppercase; } .affiliate-webinar-1__content .info .title { margin-top: 48px; width: 100%; } .affiliate-webinar-1__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; text-transform: uppercase; margin: 0; } @media (max-width: 767.98px) { .affiliate-webinar-1__content .info .title p { font-size: 48px; } } @media (max-width: 767.98px) { .affiliate-webinar-1__content .info .title { margin-top: 32px; } } .affiliate-webinar-1__content .info .description { margin-top: 48px; width: 100%; } .affiliate-webinar-1__content .info .description p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .affiliate-webinar-1__content .info .description { margin-top: 32px; } } .affiliate-webinar-1__content .info .actions { margin-top: 48px; } @media (max-width: 767.98px) { .affiliate-webinar-1__content .info .actions { width: 100%; } } @media (max-width: 767.98px) { .affiliate-webinar-1__content .info .actions .btn { width: 100%; } } @media (max-width: 767.98px) { .affiliate-webinar-1__content { padding-top: 64px; padding-bottom: 64px; } } .affiliate-webinar-2 { position: relative; } .affiliate-webinar-2__bg { position: absolute; left: 0; top: -350px; width: 100%; } .affiliate-webinar-2__bg picture img { width: 100%; } .affiliate-webinar-2__bg .desktop { display: block; } @media (max-width: 767.98px) { .affiliate-webinar-2__bg .desktop { display: none; } } .affiliate-webinar-2__bg .mobile { display: none; } @media (max-width: 767.98px) { .affiliate-webinar-2__bg .mobile { display: block; } } @media (max-width: 767.98px) { .affiliate-webinar-2__bg { top: -200px; } } .affiliate-webinar-2__content { padding-top: 128px; padding-bottom: 128px; } .affiliate-webinar-2__content .info { position: relative; display: flex; justify-content: center; flex-wrap: wrap; } .affiliate-webinar-2__content .info .title { width: 100%; } .affiliate-webinar-2__content .info .title p { color: var(--e2); text-align: center; font-size: 48px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .affiliate-webinar-2__content .info .title { font-size: 36px; } } .affiliate-webinar-2__content .info .subtitle { width: 100%; margin-top: 32px; } .affiliate-webinar-2__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .affiliate-webinar-2__content .info .subtitle { margin-top: 16px; } } .affiliate-webinar-2__content .cards { position: relative; width: 100%; margin-top: 64px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px; } .affiliate-webinar-2__content .cards .card { width: 32%; display: flex; flex-wrap: wrap; padding: 48px; border-radius: 24px; background: var(--black-50); } .affiliate-webinar-2__content .cards .card .logo { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border-radius: 6px; background: rgba(54, 192, 6, 0.1); } .affiliate-webinar-2__content .cards .card .title { width: 100%; margin-top: 32px; } .affiliate-webinar-2__content .cards .card .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: normal; } @media (max-width: 767.98px) { .affiliate-webinar-2__content .cards .card .title { margin-top: 32px; } } .affiliate-webinar-2__content .cards .card .description { margin-top: 24px; } .affiliate-webinar-2__content .cards .card .description p { color: var(--a1); font-size: 20px; font-weight: 400; line-height: normal; } @media (max-width: 767.98px) { .affiliate-webinar-2__content .cards .card .description { margin-top: 16px; } } @media (max-width: 767.98px) { .affiliate-webinar-2__content .cards .card { width: 100%; padding: 32px; } } @media (max-width: 767.98px) { .affiliate-webinar-2__content .cards { margin-top: 32px; gap: 16px; } } @media (max-width: 767.98px) { .affiliate-webinar-2__content { padding-top: 64px; padding-bottom: 64px; } } .affiliate-webinar-3 { position: relative; padding-top: 128px; padding-bottom: 128px; background-color: #131313; } .affiliate-webinar-3 .image { width: 45%; display: block; border-radius: 24px; } .affiliate-webinar-3 .image img { height: 100%; width: 100%; border-radius: 24px; } @media (max-width: 767.98px) { .affiliate-webinar-3 .image { width: 100%; } } .affiliate-webinar-3 .info { width: 45%; margin: auto 0; } .affiliate-webinar-3 .info .title { width: 100%; } .affiliate-webinar-3 .info .title p { color: var(--e2); font-size: 48px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .affiliate-webinar-3 .info .title { font-size: 36px; } } .affiliate-webinar-3 .info .subtitle { width: 100%; margin-top: 32px; } .affiliate-webinar-3 .info .subtitle p { color: var(--a1); font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .affiliate-webinar-3 .info .subtitle { margin-top: 16px; } } .affiliate-webinar-3 .info .points { margin-top: 32px; display: flex; flex-wrap: wrap; row-gap: 24px; } .affiliate-webinar-3 .info .points .point { display: flex; align-items: center; } .affiliate-webinar-3 .info .points .point .logo { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border-radius: 6px; background: rgba(54, 192, 6, 0.1); } .affiliate-webinar-3 .info .points .point .title { margin-left: 12px; } .affiliate-webinar-3 .info .points .point .title p { color: var(--e2); font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .affiliate-webinar-3 .info { margin: 32px 0 0; width: 100%; } } @media (max-width: 767.98px) { .affiliate-webinar-3 { padding-top: 64px; padding-bottom: 64px; } } .affiliate-webinar-4 { position: relative; padding-top: 128px; padding-bottom: 128px; } .affiliate-webinar-4 .info { width: 100%; } .affiliate-webinar-4 .info .title p { color: var(--e2); font-size: 48px; text-align: center; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .affiliate-webinar-4 .info .title { font-size: 36px; } } .affiliate-webinar-4 .cards { margin-top: 48px; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px; } .affiliate-webinar-4 .cards .card { width: 31%; display: flex; justify-content: center; flex-wrap: wrap; padding: 64px 48px; border-radius: 24px; background: var(--black-50); } .affiliate-webinar-4 .cards .card .volume { width: 100%; } .affiliate-webinar-4 .cards .card .volume p { color: #36C006; text-align: center; font-size: 48px; font-weight: 700; } .affiliate-webinar-4 .cards .card .title { width: 100%; margin-top: 32px; } .affiliate-webinar-4 .cards .card .title p { color: var(--e2); font-size: 32px; text-align: center; font-weight: 700; line-height: normal; } .affiliate-webinar-4 .cards .card .description { margin-top: 12px; } .affiliate-webinar-4 .cards .card .description p { color: var(--a1); font-size: 20px; text-align: center; font-weight: 400; line-height: 32px; } .affiliate-webinar-4 .cards .card .line { margin-top: 32px; width: 64px; height: 6px; background: #36C006; } @media (max-width: 767.98px) { .affiliate-webinar-4 .cards .card { width: 100%; padding: 32px; } } @media (max-width: 767.98px) { .affiliate-webinar-4 .cards { margin-top: 32px; gap: 16px; } } @media (max-width: 767.98px) { .affiliate-webinar-4 { padding-top: 64px; padding-bottom: 64px; } } .affiliate-webinar-5 { position: relative; } .affiliate-webinar-5__bg { position: absolute; left: 0; top: -300px; width: 100%; } .affiliate-webinar-5__bg picture img { width: 100%; } .affiliate-webinar-5__bg .desktop { display: block; } @media (max-width: 767.98px) { .affiliate-webinar-5__bg .desktop { display: none; } } .affiliate-webinar-5__bg .mobile { display: none; } @media (max-width: 767.98px) { .affiliate-webinar-5__bg .mobile { display: block; } } @media (max-width: 767.98px) { .affiliate-webinar-5__bg { top: -150px; } } .affiliate-webinar-5__content { padding-top: 128px; padding-bottom: 128px; } .affiliate-webinar-5__content .info { display: flex; justify-content: center; flex-wrap: wrap; } .affiliate-webinar-5__content .info .title { width: 100%; } .affiliate-webinar-5__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .affiliate-webinar-5__content .info .title p { font-size: 48px; } } .affiliate-webinar-5__content .info .description { margin-top: 48px; width: 100%; } .affiliate-webinar-5__content .info .description p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .affiliate-webinar-5__content .info .description { margin-top: 32px; } } .affiliate-webinar-5__content .info .access { margin-top: 64px; border-radius: 6px; border: 1.5px solid rgba(226, 226, 226, 0.48); background: rgba(226, 226, 226, 0.03); padding: 20px 10px; } .affiliate-webinar-5__content .info .access p { color: var(--e2); text-align: center; font-size: 18px; font-weight: 700; text-transform: uppercase; } @media (max-width: 767.98px) { .affiliate-webinar-5__content .info .access { margin-top: 32px; } } @media (max-width: 767.98px) { .affiliate-webinar-5__content { padding-top: 64px; padding-bottom: 64px; } } .affiliate-webinar-6 { position: relative; } .affiliate-webinar-6__bg { position: absolute; left: 0; top: 0; width: 100%; } .affiliate-webinar-6__bg picture img { width: 100%; } .affiliate-webinar-6__content { padding-top: 128px; padding-bottom: 128px; } .affiliate-webinar-6__content #reservation-form { display: flex; padding: 128px; flex-direction: column; align-items: center; border-radius: 48px; background: var(--black-50); } .affiliate-webinar-6__content #reservation-form .info { display: flex; justify-content: center; flex-wrap: wrap; } .affiliate-webinar-6__content #reservation-form .info .title { width: 100%; } .affiliate-webinar-6__content #reservation-form .info .title p { color: var(--e2); text-align: center; font-size: 48px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .affiliate-webinar-6__content #reservation-form .info .title p { font-size: 40px; } } .affiliate-webinar-6__content #reservation-form .info .subtitle { width: 100%; margin-top: 12px; } .affiliate-webinar-6__content #reservation-form .info .subtitle p { color: #36C006; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .affiliate-webinar-6__content #reservation-form form { margin-top: 64px; } .affiliate-webinar-6__content #reservation-form form .field { padding: 32px; margin-bottom: 24px; } .affiliate-webinar-6__content #reservation-form form .field .form_row { margin-bottom: 0; } .affiliate-webinar-6__content #reservation-form form .field .form_row label { color: #9D9D9D; font-size: 14px; font-weight: 400; } .affiliate-webinar-6__content #reservation-form form .field:focus-within { border-radius: 12px; background: rgba(226, 226, 226, 0.06); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } @media (max-width: 767.98px) { .affiliate-webinar-6__content #reservation-form form .field { margin-bottom: 16px; } } .affiliate-webinar-6__content #reservation-form form .terms { display: flex; align-items: center; padding: 8px 0; } .affiliate-webinar-6__content #reservation-form form .terms .logo { display: flex; align-items: center; } .affiliate-webinar-6__content #reservation-form form .terms .text { margin-left: 16px; } .affiliate-webinar-6__content #reservation-form form .terms .text p { color: #666; font-size: 14px; font-weight: 400; } .affiliate-webinar-6__content #reservation-form form button { width: 100%; margin: 64px 0; } @media (max-width: 767.98px) { .affiliate-webinar-6__content #reservation-form form button { margin-bottom: 32px 0; } } .affiliate-webinar-6__content #reservation-form form .agree { width: 100%; } .affiliate-webinar-6__content #reservation-form form .agree p { color: #666; text-align: center; font-size: 14px; font-weight: 400; } @media (max-width: 767.98px) { .affiliate-webinar-6__content #reservation-form form { margin-top: 32px; } } @media (max-width: 767.98px) { .affiliate-webinar-6__content #reservation-form { padding: 64px 20px; border-radius: 0; } } @media (max-width: 767.98px) { .affiliate-webinar-6__content { padding: 0; } } .affiliate-webinar-popup { padding: 0 375px; } .affiliate-webinar-popup .content { display: flex; padding: 128px; flex-direction: column; align-items: center; border-radius: 48px; background: var(--black-50); } .affiliate-webinar-popup .content .title { margin-top: 64px; margin-bottom: 0; color: var(--e2); text-align: center; font-size: 48px; font-weight: 700; } @media (max-width: 767.98px) { .affiliate-webinar-popup .content .title { font-size: 40px; } } .affiliate-webinar-popup .content .subtitle { margin-top: 48px; margin-bottom: 0; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .affiliate-webinar-popup .content .subtitle { margin-top: 16px; } } .affiliate-webinar-popup .content .actions { width: 100%; margin-top: 64px; display: flex; justify-content: space-between; flex-wrap: wrap; } .affiliate-webinar-popup .content .actions .btn { width: 100%; } @media (max-width: 767.98px) { .affiliate-webinar-popup .content { padding: 128px 20px; border-radius: 0; } } @media (max-width: 767.98px) { .affiliate-webinar-popup { padding: 0; } } /* Affiliate Webinar page (inverted) */ .inverted .affiliate-webinar-1__bg { z-index: 2; } .inverted .affiliate-webinar-1__content { z-index: 3; } .inverted .affiliate-webinar-2 { background-color: #FAFAFA; } .inverted .affiliate-webinar-2__bg { z-index: 1; } .inverted .affiliate-webinar-2__content .info { z-index: 4; } .inverted .affiliate-webinar-2__content .cards { z-index: 3; } .inverted .affiliate-webinar-3 { background-color: #FFFFFF; } .inverted .affiliate-webinar-4 { background-color: #FAFAFA; } .inverted .affiliate-webinar-5 { background-color: #FFFFFF; } .inverted .affiliate-webinar-5 .access { border: 1.5px solid rgba(226, 226, 226, 0.48); background: rgba(226, 226, 226, 0.03); } .inverted .affiliate-webinar-6 { background-color: #FAFAFA; } .inverted .affiliate-webinar-popup .actions .btn-primary, .inverted .affiliate-webinar-popup .actions .tabulator .tabulator-footer .tabulator-paginator button, .tabulator .tabulator-footer .tabulator-paginator .inverted .affiliate-webinar-popup .actions button { border-color: #2E2E2E; background-color: rgba(226, 226, 226, 0.03); } /* Survey page */ .survey { position: relative; padding-top: 160px; } .survey__bg { position: absolute; left: 0; top: 0; width: 100%; } .survey__bg picture img { width: 100%; } @media (max-width: 767.98px) { .survey__bg { display: none; } } .survey__content { padding-top: 128px; padding-bottom: 128px; } .survey__content .info { display: flex; flex-wrap: wrap; } .survey__content .info .logo { display: flex; padding: 12px 24px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; background: #36C006; } .survey__content .info .logo p { color: #0E0E0E; font-size: 16px; font-weight: 700; text-transform: uppercase; } .survey__content .info .title { margin-top: 48px; width: 100%; } .survey__content .info .title p { color: var(--e2); font-size: 64px; font-weight: 700; text-transform: uppercase; margin: 0; } @media (max-width: 767.98px) { .survey__content .info .title p { font-size: 48px; } } @media (max-width: 767.98px) { .survey__content .info .title { margin-top: 32px; } } .survey__content .info .description { margin-top: 48px; width: 100%; } .survey__content .info .description p { color: var(--a1); font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .survey__content .info .description { margin-top: 32px; } } .survey__content .complete { margin-top: 64px; width: 100%; padding: 12px 0; } .survey__content .complete .label p { color: #9D9D9D; font-size: 20px; font-weight: 400; } .survey__content .complete .percent p { color: #36C006; font-size: 32px; font-weight: 700; } .survey__content .complete .slider-container { width: 100%; } .survey__content .complete .slider-container .slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; height: 12px; padding: 0; border-radius: 8px; background: #1A1A1A; cursor: pointer; } .survey__content .complete .slider-container .slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; background-color: #36C006; cursor: pointer; border: 2px solid #36C006; border-radius: 8px; box-shadow: -1000px 0 0 1000px #36C006; } .survey__content .complete .slider-container .slider::-moz-range-thumb { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 12px; height: 12px; background-color: #36C006; cursor: pointer; border: 2px solid #36C006; border-radius: 8px; box-shadow: -1000px 0 0 1000px #36C006; } .survey__content .complete .slider-container .slider::-webkit-slider-runnable-track { background: transparent; cursor: pointer; overflow: hidden; border-radius: 8px; height: 12px; } @media (max-width: 767.98px) { .survey__content .complete { margin-top: 32px; } } .survey__content .form { margin-top: 64px; width: 100%; display: flex; padding: 64px; border-radius: 24px; background: #1A1A1A; flex-direction: column; align-items: center; gap: 64px; } .survey__content .form .field { width: 100%; } .survey__content .form .field .title { color: var(--e2); font-size: 24px; font-weight: 700; } .survey__content .form .field .form_row { margin-bottom: 0; } .survey__content .form .field .description { color: #9D9D9D; font-size: 20px; font-weight: 400; } .survey__content .form .field .rating { margin-top: 32px; display: flex; justify-content: space-between; } .survey__content .form .field .rating .rate-input { display: none; } .survey__content .form .field .rating .rate-input:checked + .rate { background: #36C006; color: #0E0E0E; border-color: #36C006; font-weight: 700; } .survey__content .form .field .rating .rate { display: flex; width: 48px; height: 48px; justify-content: center; align-items: center; border-radius: 6px; border: 1px solid rgba(255, 255, 255, 0.08); background: #1A1A1A; cursor: pointer; transition: all 0.2s ease-in-out; color: var(--e2); text-align: center; font-size: 20px; font-weight: 500; line-height: 24px; } .survey__content .form .field .rating .rate:hover { background: #3D3D3D; } .survey__content .form .field .range { margin-top: 16px; } .survey__content .form .field .select { margin-top: 32px; width: 100%; display: flex; flex-wrap: wrap; gap: 16px; } .survey__content .form .field .select .advantage-input { display: none; } .survey__content .form .field .select .advantage-input:checked + .checkbox { background: #36C006; border-color: #36C006; color: #0E0E0E; } .survey__content .form .field .select .advantage-input:checked + .checkbox:before { border-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.25 4.75L6 12L2.75 8.75' stroke='%230E0E0E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-size: 80%; background-position: center; background-repeat: no-repeat; } .survey__content .form .field .select .advantage-input:checked + .checkbox:hover { background: rgba(54, 192, 6, 0.8); border-color: rgba(54, 192, 6, 0.8); } .survey__content .form .field .select .checkbox { width: 49%; display: flex; padding: 16px; align-items: center; border-radius: 6px; border: 1px solid rgba(226, 226, 226, 0.12); background: #1A1A1A; cursor: pointer; transition: all 0.2s ease-in-out; gap: 12px; color: var(--e2); font-size: 16px; font-weight: 500; line-height: 24px; } .survey__content .form .field .select .checkbox:before { content: ""; display: block; width: 20px; height: 20px; border-radius: 4px; border: 1px solid rgba(255, 255, 255, 0.2); background: transparent; flex-shrink: 0; transition: all 0.2s ease-in-out; } .survey__content .form .field .select .checkbox:hover { background: #2A2A2A; } .survey__content .form .field .select .checkbox:hover:before { background-color: #36C006; border-color: #36C006; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.25 4.75L6 12L2.75 8.75' stroke='%230E0E0E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-size: 80%; background-position: center; background-repeat: no-repeat; } .survey__content .form .field .textarea { margin-top: 32px; display: flex; flex-wrap: wrap; padding: 32px; gap: 10px; border-radius: 12px; border: 1px solid rgba(226, 226, 226, 0.12); background: #1A1A1A; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } .survey__content .form .field .textarea .label { margin-bottom: 0; color: #9D9D9D; font-size: 14px; font-weight: 400; } .survey__content .form .field .textarea .custom-textarea-input { width: 100%; min-height: 1px; background: transparent; border: none; border-bottom: 1px solid #434343; color: #FFFFFF; font-size: 18px; font-weight: 400; resize: vertical; outline: none; transition: border-color 0.2s ease-in-out; } .survey__content .form .field .textarea .custom-textarea-input::-moz-placeholder { color: #6D6D6D; font-size: 18px; font-weight: 400; } .survey__content .form .field .textarea .custom-textarea-input::placeholder { color: #6D6D6D; font-size: 18px; font-weight: 400; } .survey__content .form .field .textarea .custom-textarea-input:focus { border-bottom-color: #36C006; } .survey__content .form .field .choice { margin-top: 32px; display: flex; justify-content: space-between; } .survey__content .form .field .choice .advice-input { display: none; } .survey__content .form .field .choice .advice-input:checked + .option { background: #36C006; border-color: #36C006; color: #0E0E0E; } .survey__content .form .field .choice .option { width: 32%; display: flex; padding: 16px; justify-content: center; align-items: center; border-radius: 6px; border: 1px solid rgba(226, 226, 226, 0.12); background: #1A1A1A; cursor: pointer; transition: all 0.2s ease-in-out; color: var(--e2); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; margin: 0; } .survey__content .form .field .choice .option:hover { border-radius: 6px; border: 1px solid rgba(226, 226, 226, 0.12); background: #2D2D2D; } .survey__content .form .btn { width: 100%; } @media (max-width: 767.98px) { .survey__content .form { margin-top: 32px; width: 115%; padding: 24px 20px; } } @media (max-width: 767.98px) { .survey__content { padding-top: 64px; padding-bottom: 64px; } } .survey__thanx { padding-top: 128px; padding-bottom: 128px; } .survey__thanx .content { display: flex; padding: 128px; flex-direction: column; align-items: center; border-radius: 48px; background: var(--black-50); } .survey__thanx .content .title { margin-top: 64px; margin-bottom: 0; color: var(--e2); text-align: center; font-size: 48px; font-weight: 700; } @media (max-width: 767.98px) { .survey__thanx .content .title { margin-top: 32px; font-size: 40px; } } .survey__thanx .content .subtitle { margin-top: 48px; margin-bottom: 0; color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .survey__thanx .content .subtitle { margin-top: 16px; } } .survey__thanx .content .actions { width: 100%; margin-top: 64px; display: flex; justify-content: space-between; flex-wrap: wrap; } .survey__thanx .content .actions .btn { width: 100%; } @media (max-width: 767.98px) { .survey__thanx .content .actions { margin-top: 32px; } } @media (max-width: 767.98px) { .survey__thanx .content { padding: 64px 20px; } } @media (max-width: 767.98px) { .survey__thanx { padding-top: 64px; padding-bottom: 64px; } } @media (max-width: 767.98px) { .survey { padding-top: 70px; } } /* Survey page (inverted) */ .inverted .survey__content .complete .label p { color: #6D6D6D; } .inverted .survey__content .complete .slider-container .slider { border-color: #CCC; background: #CCC; } .inverted .survey__content .form { background: #FFF; } .inverted .survey__content .form .field .rating .rate-input:checked + .rate { background: #36C006; color: #FFF; } .inverted .survey__content .form .field .rating .rate { border-color: rgba(46, 46, 46, 0.12); background: #FFF; } .inverted .survey__content .form .field .rating .rate:hover { background: #F1F1F1; } .inverted .survey__content .form .field .select .advantage-input:checked + .checkbox { color: #FFF; } .inverted .survey__content .form .field .select .advantage-input:checked + .checkbox:before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.25 4.75L6 12L2.75 8.75' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); } .inverted .survey__content .form .field .select .checkbox { border-color: rgba(46, 46, 46, 0.12); background: #FFF; } .inverted .survey__content .form .field .select .checkbox:before { border-color: rgba(0, 0, 0, 0.08); } .inverted .survey__content .form .field .select .checkbox:hover { background: #F1F1F1; } .inverted .survey__content .form .field .select .checkbox:hover:before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.25 4.75L6 12L2.75 8.75' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); } .inverted .survey__content .form .field .textarea { border-color: rgba(46, 46, 46, 0.12); background: #FFF; } .inverted .survey__content .form .field .textarea .label { margin-bottom: 0; color: #3D3D3D; } .inverted .survey__content .form .field .textarea .custom-textarea-input { color: #0E0E0E; } .inverted .survey__content .form .field .choice .advice-input:checked + .option { background: #36C006; color: #FFF; } .inverted .survey__content .form .field .choice .option { border-color: rgba(46, 46, 46, 0.12); background: #FFF; } .inverted .survey__thanx .content { background: #FFF; } /* LUCKY DRAW MALAYSIA page */ .lucky-draw-my { padding-top: 160px; } .lucky-draw-my__bg { position: absolute; left: 0; top: 0; width: 100%; } .lucky-draw-my__bg:before { content: ""; } .lucky-draw-my__content { padding: 128px 0; } .lucky-draw-my__content .content_bg { position: absolute; left: 0; top: 128px; width: 100%; } @media (max-width: 767.98px) { .lucky-draw-my__content .content_bg { display: none; } } .lucky-draw-my__content .marathon-title { padding: 0 !important; } @media (max-width: 767.98px) { .lucky-draw-my__content .marathon-title { text-align: center; } } .lucky-draw-my__content .ticket-title { margin-top: 48px; margin-bottom: 64px; } .lucky-draw-my__content .ticket-title .promocode { color: #36C006; font-size: 24px; font-weight: 400; } @media (max-width: 767.98px) { .lucky-draw-my__content .ticket-title { margin-top: 32px; margin-bottom: 32px; text-align: center; } } .lucky-draw-my__content .prize_fund { position: relative; } .lucky-draw-my__content .prize_fund p { margin: 0; } .lucky-draw-my__content .prize_fund .title { color: var(--white); font-size: 32px; font-weight: 400; z-index: 1; } @media (max-width: 767.98px) { .lucky-draw-my__content .prize_fund .title { font-size: 24px; } } .lucky-draw-my__content .prize_fund .sum { font-size: 48px; font-weight: 900; color: #36C006; z-index: 1; } .lucky-draw-my__content .prize_fund .bg_sum { position: absolute; top: -15%; left: 0; font-size: 128px; font-weight: 900; letter-spacing: -4%; color: rgba(54, 192, 6, 0.0588235294); text-wrap: none; } @media (max-width: 767.98px) { .lucky-draw-my__content .prize_fund .bg_sum { top: -20%; left: 3%; } } @media (max-width: 767.98px) { .lucky-draw-my__content .prize_fund { text-align: center; } } .lucky-draw-my .list-of-participants { position: relative; top: 30rem; z-index: 1; } @media (min-width: 768px) { .lucky-draw-my .list-of-participants { position: static; margin-top: 48px; margin-bottom: 10px; } } #lucky-draw-my .intro_15 { margin-top: 200px; } #lucky-draw-my .intro_15 .card-img { position: absolute; top: 16%; right: -4%; } @media (max-width: 767.98px) { #lucky-draw-my .intro_15 .card-img { top: -45%; right: -20%; } } #lucky-draw-my .intro_15 .card-img img { width: 80%; height: 80%; } /* LUCKY DRAW MALAYSIA page (inverted) */ .inverted #lucky-draw-my { background-color: #FFF !important; } /* TRADING LEAGUE page */ .trading-league-1 { position: relative; padding-top: 160px; } .trading-league-1__bg { position: absolute; left: 0; top: 160px; min-width: 100%; } .trading-league-1__bg picture { display: block; } .trading-league-1__bg picture img { min-width: 100%; } @media (max-width: 767.98px) { .trading-league-1__bg picture { display: none; } } .trading-league-1__bg .mobile { display: none; } @media (max-width: 767.98px) { .trading-league-1__bg .mobile { display: block; } } @media (max-width: 767.98px) { .trading-league-1__bg { top: 70px; } } .trading-league-1__content { padding-top: 128px; padding-bottom: 128px; } .trading-league-1__content .info .logo { display: flex; justify-content: center; } .trading-league-1__content .info .title { width: 100%; padding-top: 48px; } .trading-league-1__content .info .title h1 { color: var(--e2); font-size: 96px; font-weight: 700; text-align: center; } @media (max-width: 767.98px) { .trading-league-1__content .info .title h1 { font-size: 48px; } } .trading-league-1__content .info .subtitle { width: 100%; padding-top: 24px; } .trading-league-1__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-1__content .actions { width: 100%; padding-top: 96px; display: flex; justify-content: center; flex-wrap: wrap; } .trading-league-1__content .actions a:first-child { margin-right: 32px; } @media (max-width: 767.98px) { .trading-league-1__content .actions a:first-child { margin-right: 0; margin-bottom: 32px; } } @media (max-width: 767.98px) { .trading-league-1__content .actions a { width: 100%; } } @media (max-width: 767.98px) { .trading-league-1__content .actions { padding-top: 64px; } } @media (max-width: 767.98px) { .trading-league-1 { padding-top: 70px; } } .trading-league-2 { position: relative; padding-top: 128px; padding-bottom: 128px; } .trading-league-2 .info { display: flex; justify-content: center; flex-wrap: wrap; } .trading-league-2 .info .logo { display: flex; padding: 12px 24px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; background: #36C006; } .trading-league-2 .info .logo p { display: flex; align-items: center; color: #0E0E0E; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; text-transform: uppercase; margin: 0; } .trading-league-2 .info .title { padding-top: 64px; width: 100%; } .trading-league-2 .info .title p { color: var(--e2); text-align: center; font-size: 96px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .trading-league-2 .info .title { font-size: 48px; } } .trading-league-2 .info .prize { width: 100%; } .trading-league-2 .info .prize .amount p { align-self: stretch; text-align: center; text-shadow: 0 3px 0 rgba(0, 0, 0, 0.25), 0 0 96px rgba(54, 192, 6, 0.48); -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #36C006; font-family: Roboto Mono, sans-serif; font-size: 128px; font-style: normal; font-weight: 700; line-height: 128px; letter-spacing: 7.68px; text-transform: uppercase; background: linear-gradient(180deg, #36C006 49.76%, #195A03 68.8%, #36C006 87.29%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .trading-league-2 .info .prize .description { padding-top: 32px; width: 100%; display: flex; justify-content: space-between; } .trading-league-2 .info .prize .description .line { width: 80%; display: flex; align-items: center; } .trading-league-2 .info .prize .description .line:before { content: ""; order: 2; width: 5px; height: 5px; background-color: #3D3D3D; border-radius: 50%; flex-shrink: 0; } .trading-league-2 .info .prize .description .line:after { position: relative; content: ""; order: 1; flex-grow: 1; height: 1px; background-color: #3D3D3D; margin-left: -2px; } .trading-league-2 .info .prize .description p { color: #36C006; text-align: right; font-size: 20px; font-weight: 500; line-height: 24px; font-variant: all-small-caps; letter-spacing: 0.8px; margin: 0; } .trading-league-2 .info .time { width: 100%; margin-top: 64px; display: flex; padding: 32px; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; border-radius: 24px; border: 1px solid #3D3D3D; background: #0E0E0E; } .trading-league-2 .info .time .description { width: 100%; display: flex; justify-content: space-between; } .trading-league-2 .info .time .description .line { width: 83%; display: flex; align-items: center; } .trading-league-2 .info .time .description .line:before { content: ""; order: 1; width: 5px; height: 5px; background-color: #3D3D3D; border-radius: 50%; flex-shrink: 0; } .trading-league-2 .info .time .description .line:after { position: relative; content: ""; order: 2; flex-grow: 1; height: 1px; background-color: #3D3D3D; margin-right: -2px; } .trading-league-2 .info .time .description p { color: #D92252; font-size: 20px; font-weight: 500; line-height: 24px; font-variant: all-small-caps; letter-spacing: 0.8px; margin: 0; } .trading-league-2 .info .time .deadline { padding-top: 16px; width: 100%; display: flex; justify-content: center; } .trading-league-2 .info .time .deadline .scale .scale-count p { color: #D92252; text-align: center; text-shadow: 0 0 64px rgba(217, 34, 82, 0.48); font-family: Roboto Mono, sans-serif; font-size: 64px; font-style: normal; font-weight: 500; line-height: 80px; text-transform: uppercase; } .trading-league-2 .info .time .deadline .scale .scale-title { padding-top: 0; } .trading-league-2 .info .time .deadline .scale .scale-title p { color: #6D6D6D; text-align: center; text-shadow: 0 0 64px rgba(217, 34, 82, 0.48); font-family: Roboto Mono, sans-serif; font-size: 12px; font-style: normal; font-weight: 500; line-height: 16px; letter-spacing: 0.72px; text-transform: uppercase; } .trading-league-2 .info .time .deadline .scale-divider { color: #D92252; text-align: center; text-shadow: 0 0 64px rgba(217, 34, 82, 0.48); font-family: Roboto Mono, sans-serif; font-size: 64px; font-style: normal; font-weight: 500; line-height: 80px; /* 125% */ letter-spacing: 3.84px; text-transform: uppercase; } @media (max-width: 767.98px) { .trading-league-2 { padding-top: 64px; padding-bottom: 64px; } } .page-divider { position: relative; padding-top: 128px; padding-bottom: 128px; display: flex; justify-content: center; } .trading-league-3 { position: relative; } .trading-league-3 .card { display: flex; padding: 128px; flex-direction: column; align-items: center; gap: 64px; border-radius: 32px; background: #1A1A1A; } .trading-league-3 .card .title p { color: #E2E2E2; text-align: center; font-size: 64px; font-weight: 700; line-height: 80px; } .trading-league-3 .card .title p .win { background: linear-gradient(90deg, #06C0B6 53.85%, #36C006 88.94%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .trading-league-3 .card .subtitle { padding-top: 24px; } .trading-league-3 .card .subtitle p { color: #9D9D9D; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-3 .card .actions { width: 100%; padding-top: 64px; display: flex; } .trading-league-3 .card .actions a { width: 48%; } .trading-league-3 .card .actions a:first-child { margin-right: 32px; } .trading-league-4 { position: relative; } .trading-league-4__bg { position: absolute; left: 0; top: -350px; width: 100%; } .trading-league-4__bg picture img { width: 100%; } .trading-league-4__bg .desktop { display: block; } @media (max-width: 767.98px) { .trading-league-4__bg .desktop { display: none; } } .trading-league-4__bg .mobile { display: none; } @media (max-width: 767.98px) { .trading-league-4__bg .mobile { display: block; } } @media (max-width: 767.98px) { .trading-league-4__bg { top: -200px; } } .trading-league-4__content .info .title { width: 100%; } .trading-league-4__content .info .title p { color: var(--e2); font-size: 64px; font-weight: 700; text-align: center; line-height: 80px; } @media (max-width: 767.98px) { .trading-league-4__content .info .title p { font-size: 48px; } } .trading-league-4__content .info .subtitle { width: 100%; padding-top: 24px; } .trading-league-4__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-4__content .cards { position: relative; width: 100%; margin-top: 64px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px; } .trading-league-4__content .cards .card { width: 32%; display: flex; flex-wrap: wrap; padding: 32px; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-4__content .cards .card .head { width: 100%; display: flex; justify-content: space-between; } .trading-league-4__content .cards .card .head .logo { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border-radius: 6px; background: rgba(54, 192, 6, 0.1); } .trading-league-4__content .cards .card .head .sort { color: #3D3D3D; text-align: right; font-family: Roboto Mono, sans-serif; font-size: 48px; font-weight: 700; line-height: 48px; text-transform: uppercase; } .trading-league-4__content .cards .card .title { width: 100%; margin-top: 32px; } .trading-league-4__content .cards .card .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: normal; } @media (max-width: 767.98px) { .trading-league-4__content .cards .card .title { margin-top: 32px; } } .trading-league-4__content .cards .card .description { margin-top: 24px; } .trading-league-4__content .cards .card .description p { color: var(--a1); font-size: 20px; font-weight: 400; line-height: normal; } @media (max-width: 767.98px) { .trading-league-4__content .cards .card .description { margin-top: 16px; } } @media (max-width: 767.98px) { .trading-league-4__content .cards .card { width: 100%; padding: 32px; } } @media (max-width: 767.98px) { .trading-league-4__content .cards { margin-top: 32px; gap: 16px; } } .trading-league-5 { position: relative; } .trading-league-5 .card { width: 100%; display: flex; padding: 128px; flex-direction: column; align-items: center; gap: 64px; border-radius: 32px; background: #1A1A1A; } .trading-league-5 .card .info .title p { color: #E2E2E2; text-align: center; font-size: 64px; font-weight: 700; line-height: 80px; } .trading-league-5 .card .info .subtitle { padding-top: 24px; } .trading-league-5 .card .info .subtitle p { color: #9D9D9D; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-5 .card .content { padding-top: 64px; display: flex; width: 100%; } .trading-league-5 .card .content .guarantee { width: 48%; margin-right: 48px; display: flex; padding: 48px; flex-direction: column; justify-content: space-between; align-items: flex-start; flex: 1 0 0; align-self: stretch; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-5 .card .content .guarantee .seed { display: flex; padding-bottom: 90px; } .trading-league-5 .card .content .guarantee .seed .logo { display: flex; width: 96px; height: 96px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.12); margin-right: 24px; } .trading-league-5 .card .content .guarantee .seed .label p { color: #6D6D6D; font-size: 20px; font-weight: 400; } .trading-league-5 .card .content .guarantee .seed .sum p { color: #36C006; font-family: Roboto Mono, sans-serif; font-size: 48px; font-weight: 700; line-height: 48px; text-transform: uppercase; } .trading-league-5 .card .content .guarantee .per-trade { border-top: 1px solid #3D3D3D; padding-top: 90px; display: flex; flex-wrap: wrap; } .trading-league-5 .card .content .guarantee .per-trade .logo { display: flex; min-width: 96px; min-height: 96px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.12); margin-right: 24px; } .trading-league-5 .card .content .guarantee .per-trade .label p { color: #6D6D6D; font-size: 20px; font-weight: 400; } .trading-league-5 .card .content .guarantee .per-trade .title p { color: #E2E2E2; font-size: 32px; font-weight: 700; } .trading-league-5 .card .content .guarantee .per-trade .slider-container { width: 100%; padding-top: 32px; } .trading-league-5 .card .content .guarantee .per-trade .slider-container .slider { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; height: 12px; padding: 0; border-radius: 8px; background: #0D0D0D; cursor: pointer; } .trading-league-5 .card .content .guarantee .per-trade .slider-container .slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; background-color: #36C006; cursor: pointer; border: 2px solid #36C006; border-radius: 8px; box-shadow: -1000px 0 0 1000px #36C006; } .trading-league-5 .card .content .guarantee .per-trade .slider-container .slider::-moz-range-thumb { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 12px; height: 12px; background-color: #36C006; cursor: pointer; border: 2px solid #36C006; border-radius: 8px; box-shadow: -1000px 0 0 1000px #36C006; } .trading-league-5 .card .content .guarantee .per-trade .slider-container .slider::-webkit-slider-runnable-track { background: transparent; cursor: pointer; overflow: hidden; border-radius: 8px; height: 12px; } .trading-league-5 .card .content .guarantee .per-trade .cap { width: 100%; } .trading-league-5 .card .content .guarantee .per-trade .cap p { color: #E2E2E2; font-size: 20px; font-weight: 700; } .trading-league-5 .card .content .guarantee .per-trade .cap p .label { color: #6D6D6D; font-size: 20px; font-weight: 400; } .trading-league-5 .card .content .protection { width: 48%; } .trading-league-5 .card .content .protection .title p { color: #E2E2E2; font-size: 32px; font-weight: 700; } .trading-league-5 .card .content .protection .subtitle { padding-top: 12px; } .trading-league-5 .card .content .protection .subtitle p { color: #9D9D9D; font-size: 20px; font-weight: 400; } .trading-league-5 .card .content .protection .quantity-rules { width: 100%; padding-top: 48px; display: flex; flex-wrap: wrap; gap: 12px; } .trading-league-5 .card .content .protection .quantity-rules .rule { width: 100%; display: flex; padding: 24px; justify-content: space-between; align-items: center; gap: 32px; align-self: stretch; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-5 .card .content .protection .quantity-rules .rule .quantity p { color: #9D9D9D; font-family: Roboto Mono, sans-serif; font-size: 32px; font-weight: 700; line-height: 48px; text-transform: uppercase; } .trading-league-5 .card .content .protection .quantity-rules .rule .per-text p { color: #9D9D9D; font-size: 20px; font-weight: 400; text-transform: capitalize; } .trading-league-5 .card .content .protection .quantity-rules .rule .factor p { color: #36C006; text-align: right; font-family: Roboto Mono, sans-serif; font-size: 40px; font-weight: 700; line-height: 48px; text-transform: uppercase; } .trading-league-6 { position: relative; } .trading-league-6__bg { position: absolute; left: 0; top: -350px; width: 100%; } .trading-league-6__bg picture img { width: 100%; } .trading-league-6__bg .desktop { display: block; } @media (max-width: 767.98px) { .trading-league-6__bg .desktop { display: none; } } .trading-league-6__bg .mobile { display: none; } @media (max-width: 767.98px) { .trading-league-6__bg .mobile { display: block; } } @media (max-width: 767.98px) { .trading-league-6__bg { top: -200px; } } .trading-league-6__content .info .title { width: 100%; } .trading-league-6__content .info .title p { color: var(--e2); font-size: 64px; font-weight: 700; text-align: center; line-height: 80px; } @media (max-width: 767.98px) { .trading-league-6__content .info .title p { font-size: 48px; } } .trading-league-6__content .info .subtitle { width: 100%; padding-top: 24px; } .trading-league-6__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-6__content .formula { width: 100%; margin-top: 64px; display: flex; padding: 24px; justify-content: center; align-items: center; gap: 32px; align-self: stretch; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-6__content .formula p { color: #9D9D9D; font-family: Roboto Mono, sans-serif; font-size: 24px; font-weight: 500; line-height: 32px; letter-spacing: -0.48px; text-transform: lowercase; } .trading-league-6__content .formula p .avg { color: #36C006; } .trading-league-6__content .formula p .size_bonus { color: #25C044; } .trading-league-6__content .formula p .captain_multiplier { color: #16C079; } .trading-league-6__content .formula p .discipline_factor { color: #06C0B6; } .trading-league-6__content .points { margin-top: 48px; width: 100%; display: flex; flex-wrap: wrap; gap: 32px; } .trading-league-6__content .points .point { width: 48%; display: flex; padding: 24px; align-items: center; gap: 32px; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-6__content .points .point .dot { position: relative; width: 32px; height: 32px; border-radius: 32px; background: #36C006; } .trading-league-6__content .points .point .title p { color: #E2E2E2; font-size: 24px; font-weight: 700; line-height: 32px; } .trading-league-6__content .points .point .subtitle { padding-top: 6px; } .trading-league-6__content .points .point .subtitle p { color: #9D9D9D; font-size: 20px; font-weight: 400; line-height: 24px; } .trading-league-7 { position: relative; } .trading-league-7 .card { width: 100%; display: flex; padding: 128px; flex-direction: column; align-items: center; gap: 64px; border-radius: 32px; background: #1A1A1A; } .trading-league-7 .card .info .title p { color: #E2E2E2; text-align: center; font-size: 64px; font-weight: 700; line-height: 80px; } .trading-league-7 .card .info .subtitle { padding-top: 24px; } .trading-league-7 .card .info .subtitle p { color: #9D9D9D; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-7 .card .content { padding-top: 64px; display: flex; justify-content: space-between; width: 100%; } .trading-league-7 .card .content .diagram { width: 48%; display: flex; justify-content: center; align-items: center; } .trading-league-7 .card .content .diagram .pie { position: relative; width: 400px; height: 400px; border-radius: 50%; flex-shrink: 0; background: #36C006; } .trading-league-7 .card .content .diagram .pie::after { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 200px; height: 200px; background-color: #1A1A1A; border-radius: 50%; } .trading-league-7 .card .content .points { width: 48%; display: grid; row-gap: 12px; } .trading-league-7 .card .content .points .point { width: 100%; display: flex; padding: 24px; justify-content: space-between; align-items: center; align-self: stretch; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-7 .card .content .points .point .dot { position: relative; width: 32px; height: 32px; border-radius: 32px; background: #36C006; } .trading-league-7 .card .content .points .point .title p { color: #9D9D9D; font-family: Roboto Mono, sans-serif; font-size: 24px; font-weight: 700; line-height: 48px; text-transform: capitalize; } .trading-league-7 .card .content .points .point .percent p { color: #2CC029; text-align: right; font-family: Roboto Mono, sans-serif; font-size: 40px; font-weight: 700; line-height: 48px; text-transform: uppercase; } .trading-league-8 { position: relative; } .trading-league-8__bg { position: absolute; left: 0; top: -350px; width: 100%; } .trading-league-8__bg picture img { width: 100%; } .trading-league-8__bg .desktop { display: block; } @media (max-width: 767.98px) { .trading-league-8__bg .desktop { display: none; } } .trading-league-8__bg .mobile { display: none; } @media (max-width: 767.98px) { .trading-league-8__bg .mobile { display: block; } } @media (max-width: 767.98px) { .trading-league-8__bg { top: -200px; } } .trading-league-8__content .info .title { width: 100%; } .trading-league-8__content .info .title p { color: var(--e2); font-size: 64px; font-weight: 700; text-align: center; line-height: 80px; } @media (max-width: 767.98px) { .trading-league-8__content .info .title p { font-size: 48px; } } .trading-league-8__content .info .subtitle { width: 100%; padding-top: 24px; } .trading-league-8__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-8__content .table { margin-top: 64px; width: 100%; } .trading-league-8__content .table .row { border: 1px solid rgba(226, 226, 226, 0.12); background: linear-gradient(90deg, rgba(226, 226, 226, 0.04) 0%, rgba(226, 226, 226, 0.01) 100%); } .trading-league-8__content .table .row > div { padding: 12px; } .trading-league-8__content .table .row:first-child { border-radius: 16px 16px 0 0; background: #0E0E0E; } .trading-league-8__content .table .row:nth-child(2) { background: linear-gradient(90deg, rgba(54, 192, 6, 0.12) 0%, rgba(54, 192, 6, 0.03) 100%); } .trading-league-8__content .table .row:nth-child(3) { background: linear-gradient(90deg, rgba(6, 192, 182, 0.12) 0%, rgba(6, 192, 182, 0.03) 100%); } .trading-league-8__content .table .row:nth-child(4) { background: linear-gradient(90deg, rgba(22, 192, 121, 0.12) 0%, rgba(22, 192, 121, 0.03) 100%); } .trading-league-8__content .table .row:last-child { border-radius: 0 0 16px 16px; } .trading-league-8__content .table .row .value { padding: 20px; background: #2A2A2A; font-weight: 700; color: #36c006; border-radius: 5px; } .trading-league-9 { position: relative; } .trading-league-9 .card { width: 100%; display: flex; padding: 128px; flex-direction: column; align-items: center; gap: 64px; border-radius: 32px; background: #1A1A1A; } .trading-league-9 .card .info .title p { color: #E2E2E2; text-align: center; font-size: 64px; font-weight: 700; line-height: 80px; } .trading-league-9 .card .info .subtitle { padding-top: 24px; } .trading-league-9 .card .info .subtitle p { color: #9D9D9D; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-9 .card .requirements { padding-top: 64px; width: 100%; display: flex; -moz-column-gap: 24px; column-gap: 24px; gap: 24px; } .trading-league-9 .card .requirements .requirement { width: 25%; display: flex; padding: 32px; flex-direction: column; align-items: center; border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-9 .card .requirements .requirement .logo { display: flex; width: 48px; height: 48px; justify-content: center; align-items: center; border-radius: 8px; background: rgba(54, 192, 6, 0.1); } .trading-league-9 .card .requirements .requirement .title { width: 100%; margin-top: 32px; } .trading-league-9 .card .requirements .requirement .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: normal; } @media (max-width: 767.98px) { .trading-league-9 .card .requirements .requirement .title { margin-top: 32px; } } .trading-league-9 .card .requirements .requirement .description { margin-top: 24px; } .trading-league-9 .card .requirements .requirement .description p { color: var(--a1); font-size: 20px; font-weight: 400; line-height: normal; } @media (max-width: 767.98px) { .trading-league-9 .card .requirements .requirement .description { margin-top: 16px; } } .trading-league-10 { position: relative; } .trading-league-10__bg { position: absolute; left: 0; top: -350px; width: 100%; } .trading-league-10__bg picture img { width: 100%; } .trading-league-10__bg .desktop { display: block; } @media (max-width: 767.98px) { .trading-league-10__bg .desktop { display: none; } } .trading-league-10__bg .mobile { display: none; } @media (max-width: 767.98px) { .trading-league-10__bg .mobile { display: block; } } @media (max-width: 767.98px) { .trading-league-10__bg { top: -200px; } } .trading-league-10__content .info .title { width: 100%; } .trading-league-10__content .info .title p { color: var(--e2); font-size: 64px; font-weight: 700; text-align: center; line-height: 80px; } @media (max-width: 767.98px) { .trading-league-10__content .info .title p { font-size: 48px; } } .trading-league-10__content .info .subtitle { width: 100%; padding-top: 24px; } .trading-league-10__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-10__content .dates { width: 100%; padding-top: 64px; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; } .trading-league-10__content .dates .date { flex: 1; position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; } .trading-league-10__content .dates .date .line { position: absolute; width: 108%; top: 40px; display: flex; align-items: center; } .trading-league-10__content .dates .date .line:before { content: ""; order: 1; width: 5px; height: 5px; background-color: #3D3D3D; border-radius: 50%; flex-shrink: 0; } .trading-league-10__content .dates .date .line:after { position: relative; content: ""; order: 2; flex-grow: 1; height: 1px; background-color: #3D3D3D; margin-right: -2px; } .trading-league-10__content .dates .date .logo { width: 80px; height: 80px; border-radius: 50%; background-color: #0E0E0E; border: 2px solid #3D3D3D; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; position: relative; z-index: 2; } .trading-league-10__content .dates .date .title { padding-top: 24px; } .trading-league-10__content .dates .date .title p { color: #E2E2E2; font-size: 20px; font-weight: 700; line-height: 24px; } .trading-league-10__content .dates .date .duration { padding: 6px 0; } .trading-league-10__content .dates .date .duration p { color: #36C006; font-family: Roboto Mono, sans-serif; font-size: 16px; font-weight: 500; line-height: 24px; letter-spacing: -0.32px; text-transform: lowercase; } .trading-league-10__content .dates .date .subtitle p { color: #6D6D6D; font-size: 12px; font-weight: 400; line-height: 16px; } .trading-league-11 { position: relative; } .trading-league-11 .card { width: 100%; display: flex; padding: 128px; flex-direction: column; align-items: center; gap: 64px; border-radius: 32px; background: #1A1A1A; } .trading-league-11 .card .info .title p { color: #E2E2E2; text-align: center; font-size: 64px; font-weight: 700; line-height: 80px; } .trading-league-11 .card .info .subtitle { padding-top: 24px; } .trading-league-11 .card .info .subtitle p { color: #9D9D9D; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-11 .card .questions { position: relative; width: 100%; max-width: 1300px; margin: 0 auto; } .trading-league-11 .card .questions .content-collapsed { transition: none !important; } .trading-league-11 .card .questions .content-collapsed .question-description { max-height: 0 !important; } .trading-league-11 .card .questions .content-collapsed .question-description .question-content { max-height: 0 !important; padding: 0 !important; } .trading-league-11 .card .questions .content-collapsed:hover { transition: 0.3s ease-in-out; background-color: var(--green); } .trading-league-11 .card .questions .content-collapsed:hover .question-header .question-number { color: var(--cod-gray); } .trading-league-11 .card .questions .content-collapsed:hover .question-header .question-title { color: var(--cod-gray); } .trading-league-11 .card .questions .content-collapsed:hover .question-header .icon { fill: var(--cod-gray); } .trading-league-11 .card .questions .content-expanded { transition: 0.3s ease-in-out; padding-bottom: 0 !important; background-color: var(--green) !important; } .trading-league-11 .card .questions .content-expanded .question-header .question-number { color: #0E0E0E !important; } .trading-league-11 .card .questions .content-expanded .question-header .question-title { color: #0E0E0E !important; } .trading-league-11 .card .questions .content-expanded .question-header .icon { transform: rotate(180deg); fill: #0E0E0E !important; } .trading-league-11 .card .questions .content-expanded .question-description { transition: 0.3s ease-in-out; } .trading-league-11 .card .questions .content-expanded .question-description .question-content { color: #0E0E0E; font-size: 16px; line-height: 140%; padding: 32px 78px; } .trading-league-11 .card .questions .content-expanded .question-description .question-content-point { padding: 16px 0; } .trading-league-11 .card .questions .content-expanded .question-description .question-content-point ul { padding-top: 16px; list-style-position: inside; list-style-type: disc; } @media (max-width: 991.98px) { .trading-league-11 .card .questions .content-expanded .question-description .question-content-point ul { padding-top: 6px; } } @media (max-width: 991.98px) { .trading-league-11 .card .questions .content-expanded .question-description .question-content-point { padding: 6px 0; } } @media (max-width: 991.98px) { .trading-league-11 .card .questions .content-expanded .question-description .question-content { padding: 24px 12px; } } .trading-league-11 .card .questions .content-expanded .question-description:before { content: ""; border-left: #0E0E0E 2px solid; margin-left: 14px; } .trading-league-11 .card .questions .question { margin: 24px 0; color: var(--e2); width: 100%; padding: 32px; background-color: var(--black-100); border-radius: 24px; border: 1px solid #3D3D3D; } .trading-league-11 .card .questions .question .question-header .question-number { color: var(--e2); font-size: 20px; font-weight: 500; } .trading-league-11 .card .questions .question .question-header .question-title { color: var(--e2); margin-left: 64px; font-size: 20px; font-weight: 500; line-height: 110%; } @media (max-width: 991.98px) { .trading-league-11 .card .questions .question .question-header .question-title { font-size: 16px; margin-left: 20px; } } .trading-league-11 .card .questions .question .question-header .icon { stroke-width: 3px; transition: all 0.3s; rotate: 90deg; } .trading-league-11 .card .questions .question .question-description { overflow: hidden; transition: 0.3s ease-in-out; } @media (max-width: 991.98px) { .trading-league-11 .card .questions { margin: 0; padding: 48px 0 0; } } .trading-league-12 { position: relative; } .trading-league-12__bg { position: absolute; left: 0; top: -350px; min-width: 100%; } .trading-league-12__bg picture { display: block; } .trading-league-12__bg picture img { min-width: 100%; } @media (max-width: 767.98px) { .trading-league-12__bg picture { display: none; } } .trading-league-12__bg .mobile { display: none; } @media (max-width: 767.98px) { .trading-league-12__bg .mobile { display: block; } } @media (max-width: 767.98px) { .trading-league-12__bg { top: 70px; } } .trading-league-12__content .info { width: 100%; } .trading-league-12__content .info .logo { display: flex; justify-content: center; } .trading-league-12__content .info .title { width: 100%; padding-top: 48px; } .trading-league-12__content .info .title p { color: var(--e2); font-size: 96px; font-weight: 700; text-align: center; } @media (max-width: 767.98px) { .trading-league-12__content .info .title p { font-size: 48px; } } .trading-league-12__content .info .subtitle { width: 100%; padding-top: 24px; } .trading-league-12__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } .trading-league-12__content .info .actions { width: 100%; padding: 128px; display: flex; } .trading-league-12__content .info .actions a { width: 48%; } .trading-league-12__content .info .actions a:first-child { margin-right: 32px; } .trading-league-12__content .disclaimer { width: 100%; padding-bottom: 128px; text-align: center; } .trading-league-12__content .disclaimer .title p { color: #E2E2E2; font-size: 32px; font-weight: 700; } .trading-league-12__content .disclaimer .description { padding-top: 24px; } .trading-league-12__content .disclaimer .description p { color: #6D6D6D; font-size: 20px; font-weight: 400; } .trading-league-3 .card .actions, .trading-league-12__content .info .actions { justify-content: center; } .trading-league-3 .card .actions a:only-child, .trading-league-12__content .info .actions a:only-child { margin-right: 0; } @media (max-width: 767.98px) { .trading-league-3 .card .actions, .trading-league-12__content .info .actions { padding: 32px 0 0; flex-direction: column; gap: 16px; } .trading-league-3 .card .actions a, .trading-league-12__content .info .actions a { width: 100%; } .trading-league-3 .card .actions a:first-child, .trading-league-12__content .info .actions a:first-child { margin-right: 0; } .trading-league-2 .info .prize .amount p { font-size: 56px; line-height: 64px; letter-spacing: 2px; } .trading-league-2 .info .prize .description .line { width: 30%; } .trading-league-2 .info .prize .description p { flex: 1; } .trading-league-2 .info .time { padding: 24px 16px; } .trading-league-2 .info .time .deadline .scale .scale-count p, .trading-league-2 .info .time .deadline .scale-divider { font-size: 36px; } .trading-league-3 .card, .trading-league-7 .card, .trading-league-9 .card, .trading-league-11 .card { padding: 48px 16px; } .trading-league-7 .card .content .points { width: 100%; } .trading-league-9 .card .info .title p { font-size: 40px; } .trading-league-9 .card .requirements { flex-wrap: wrap; gap: 16px; } .trading-league-9 .card .requirements .requirement { width: 100%; } .trading-league-10 .dates { flex-direction: column; gap: 32px; } .trading-league-10 .dates .date .line { display: none; } } .contest-monthly p { margin-bottom: 0; } .contest-monthly .trading-league-1__bg, .contest-monthly .trading-league-4__bg, .contest-monthly .trading-league-8__bg, .contest-monthly .trading-league-10__bg, .contest-monthly .trading-league-12__bg { pointer-events: none; opacity: 0.2; } .contest-monthly .page-divider { padding-top: 48px; padding-bottom: 48px; } @media (max-width: 767.98px) { .contest-monthly .page-divider { padding-top: 32px; padding-bottom: 32px; } } .contest-monthly .trading-league-1__content { padding-top: 64px; padding-bottom: 64px; } @media (max-width: 767.98px) { .contest-monthly .trading-league-1__content { padding-top: 48px; padding-bottom: 32px; } } .contest-monthly .trading-league-2 { padding-top: 48px; padding-bottom: 0; } @media (max-width: 767.98px) { .contest-monthly .trading-league-2 { padding-top: 32px; } } .contest-monthly .trading-league-3 .card, .contest-monthly .trading-league-7 .card, .contest-monthly .trading-league-9 .card, .contest-monthly .trading-league-11 .card { gap: 0; } .contest-monthly .trading-league-11 .card .questions { padding-top: 64px; } .contest-monthly .trading-league-8__content .info { width: 100%; } .contest-monthly .trading-league-12__content .disclaimer { padding-bottom: 64px; } @media (min-width: 768px) { .contest-monthly .trading-league-3 .card, .contest-monthly .trading-league-7 .card, .contest-monthly .trading-league-9 .card, .contest-monthly .trading-league-11 .card { padding: 80px; } .contest-monthly .trading-league-7 .card .content .points { width: 100%; grid-template-columns: repeat(auto-fit, minmax(176px, 1fr)); gap: 16px; } .contest-monthly .trading-league-7 .card .content .points .point { flex-wrap: wrap; justify-content: center; gap: 8px 16px; } .contest-monthly .trading-league-7 .card .content .points .point .percent { width: 100%; } .contest-monthly .trading-league-7 .card .content .points .point .percent p { text-align: center; font-size: 32px; white-space: nowrap; } .contest-monthly .trading-league-12__content .info .actions { padding-top: 64px; padding-bottom: 64px; } .contest-monthly .trading-league-4__content .cards .card { width: calc((100% - 48px) / 3); } } @media (min-width: 768px) and (max-width: 991.98px) { .contest-monthly .trading-league-4__content .cards .card { width: 100%; } } @media (min-width: 768px) and (max-width: 1199.98px) { .contest-monthly .trading-league-9 .card .requirements { flex-wrap: wrap; } .contest-monthly .trading-league-9 .card .requirements .requirement { width: calc(50% - 12px); } } @media (min-width: 1200px) { .contest-monthly .trading-league-9 .card .requirements .requirement .title p { font-size: 24px; } } .contest-monthly .trading-league-4__content .cards .card .title p, .contest-monthly .trading-league-9 .card .requirements .requirement .title p { -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 10 4 4; overflow-wrap: break-word; } .contest-monthly .trading-league-2 .info .logo { background: rgba(var(--green-rgb), 0.05); border: 1px solid rgba(var(--green-rgb), 0.3); } .contest-monthly .trading-league-2 .info .logo p { color: var(--green); } .contest-monthly .trading-league-2 .info .prize .amount p, .contest-monthly .trading-league-3 .card .title p .win { color: var(--green); background: none; -webkit-text-fill-color: currentColor; -webkit-text-stroke-width: 0; text-shadow: none; } .contest-monthly .trading-league-2 .info .prize .description p, .contest-monthly .trading-league-7 .card .content .points .point .percent p, .contest-monthly .trading-league-10__content .dates .date .duration p { color: var(--green); } .contest-monthly .trading-league-2 .info .time .description p, .contest-monthly .trading-league-2 .info .time .deadline .scale .scale-count p, .contest-monthly .trading-league-2 .info .time .deadline .scale-divider { color: var(--red); text-shadow: none; } .contest-monthly .trading-league-2 .info .time .deadline .scale .scale-title p { color: #A1A1A1; text-shadow: none; } .contest-monthly .trading-league-10__content .dates .date .line:before, .contest-monthly .trading-league-10__content .dates .date .line:after { background-color: var(--gray-200); } .contest-monthly .trading-league-10__content .dates .date .logo { background-color: var(--black-400); border-color: var(--gray-200); } .contest-monthly .trading-league-10__content .dates .date .title p { color: var(--e2); } .contest-monthly .trading-league-10__content .dates .date .subtitle p { color: var(--a1); } .contest-monthly .trading-league-12__content .disclaimer .title p { color: var(--e2); } .contest-monthly .trading-league-12__content .disclaimer .description p { color: var(--a1); } .contest-monthly .trading-league-4__content .cards .card .head .logo, .contest-monthly .trading-league-9 .card .requirements .requirement .logo { background: rgba(var(--green-rgb), 0.1); } .contest-monthly .trading-league-7 .card .content .points .point .dot { background: var(--green); } .contest-monthly .trading-league-8__content .table .row:nth-child(2) { background: linear-gradient(90deg, rgba(var(--green-rgb), 0.12) 0%, rgba(var(--green-rgb), 0.03) 100%); } .contest-monthly .trading-league-8__content .table .row:nth-child(3) { background: linear-gradient(90deg, rgba(var(--green-rgb), 0.09) 0%, rgba(var(--green-rgb), 0.02) 100%); } .contest-monthly .trading-league-8__content .table .row:nth-child(4) { background: linear-gradient(90deg, rgba(var(--green-rgb), 0.06) 0%, rgba(var(--green-rgb), 0.01) 100%); } .contest-monthly .trading-league-11 .questions .content-expanded { background-color: var(--black-100) !important; } .contest-monthly .trading-league-11 .questions .content-expanded .question-header .question-number, .contest-monthly .trading-league-11 .questions .content-expanded .question-header .question-title { color: var(--green) !important; } .contest-monthly .trading-league-11 .questions .content-expanded .question-header .icon { fill: var(--green) !important; } .contest-monthly .trading-league-11 .questions .content-expanded .question-description .question-content { color: var(--a1); } .contest-monthly .trading-league-11 .questions .content-expanded .question-description:before { border-left-color: rgba(var(--green-rgb), 0.3); } .contest-monthly .trading-league-11 .questions .content-collapsed:hover { background-color: var(--black-100); } .contest-monthly .trading-league-11 .questions .content-collapsed:hover .question-header .question-number, .contest-monthly .trading-league-11 .questions .content-collapsed:hover .question-header .question-title { color: var(--e2); } .contest-monthly .trading-league-11 .questions .content-collapsed:hover .question-header .icon { fill: var(--white); } @media (hover: hover) { .contest-monthly .trading-league-11 .questions .content-collapsed:hover { border-color: rgba(var(--green-rgb), 0.3); } .contest-monthly .trading-league-11 .questions .content-collapsed:hover .question-header .question-number, .contest-monthly .trading-league-11 .questions .content-collapsed:hover .question-header .question-title { color: var(--green); } .contest-monthly .trading-league-11 .questions .content-collapsed:hover .question-header .icon { fill: var(--green); } } @media (max-width: 767.98px) { .contest-monthly .trading-league-2 .info .title p, .contest-monthly .trading-league-3 .card .title p, .contest-monthly .trading-league-4 .info .title p, .contest-monthly .trading-league-7 .card .info .title p, .contest-monthly .trading-league-8 .info .title p, .contest-monthly .trading-league-9 .card .info .title p, .contest-monthly .trading-league-10 .info .title p, .contest-monthly .trading-league-11 .card .info .title p, .contest-monthly .trading-league-12__content .info .title p { font-size: 40px; line-height: 48px; } .contest-monthly .trading-league-7 .card .content, .contest-monthly .trading-league-9 .card .requirements, .contest-monthly .trading-league-10__content .dates, .contest-monthly .trading-league-11 .card .questions { padding-top: 32px; } .contest-monthly .trading-league-8__content .table { margin-top: 32px; } .contest-monthly .trading-league-8__content .table .row > div { min-width: 0; padding-left: 4px; padding-right: 4px; overflow-wrap: anywhere; } .contest-monthly .trading-league-8__content .table .row > div strong { font-size: 13px; } .contest-monthly .trading-league-8__content .table .row > div:nth-child(2) { flex-grow: 2; } .contest-monthly .trading-league-8__content .table header strong { font-size: 12px; -webkit-hyphens: auto; hyphens: auto; } .contest-monthly .trading-league-12__content .disclaimer { padding-top: 48px; } .contest-monthly .trading-league-10__content .dates { align-items: stretch; gap: 0; } .contest-monthly .trading-league-10__content .dates .date { display: grid; grid-template-columns: 56px minmax(0, 1fr); -moz-column-gap: 16px; column-gap: 16px; overflow-wrap: break-word; align-items: start; padding-bottom: 24px; text-align: left; } .contest-monthly .trading-league-10__content .dates .date .logo { grid-row: 1/span 3; width: 56px; height: 56px; margin-bottom: 0; } .contest-monthly .trading-league-10__content .dates .date .logo .icon { width: 24px; height: 24px; flex-basis: 24px; } .contest-monthly .trading-league-10__content .dates .date .title, .contest-monthly .trading-league-10__content .dates .date .duration, .contest-monthly .trading-league-10__content .dates .date .subtitle { grid-column: 2; } .contest-monthly .trading-league-10__content .dates .date .title { padding-top: 4px; } .contest-monthly .trading-league-10__content .dates .date .title p { font-size: 18px; } .contest-monthly .trading-league-10__content .dates .date .duration { padding: 2px 0; } .contest-monthly .trading-league-10__content .dates .date .subtitle p { font-size: 13px; line-height: 18px; } .contest-monthly .trading-league-10__content .dates .date .line { display: block; left: 27px; top: 60px; bottom: 4px; width: 2px; background: var(--gray-200); } .contest-monthly .trading-league-10__content .dates .date .line:before, .contest-monthly .trading-league-10__content .dates .date .line:after { display: none; } .contest-monthly .trading-league-10__content .dates .date:last-child { padding-bottom: 0; } .contest-monthly .trading-league-10__content .dates .date:last-child .line { display: none; } } /* ACADEMY page */ .academy-1 { position: relative; padding-top: 160px; } .academy-1__bg { position: absolute; right: 0; bottom: 0; min-width: 70%; } .academy-1__bg picture { display: block; } .academy-1__bg picture img { min-width: 70%; } @media (max-width: 767.98px) { .academy-1__bg picture { display: none; } } .academy-1__bg .mobile { display: none; } @media (max-width: 767.98px) { .academy-1__bg .mobile { display: block; } } @media (max-width: 767.98px) { .academy-1__bg { top: 70px; } } .academy-1__content { padding-top: 128px; padding-bottom: 128px; } .academy-1__content .info { width: 40%; } .academy-1__content .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); margin-bottom: 26px; } .academy-1__content .info .marker__dot { width: 6px; height: 6px; border-radius: 50%; background: #36C006; box-shadow: 0 0 0 3px rgba(54, 192, 6, 0.12); } .academy-1__content .info .marker__text p { color: #36C006; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; text-align: left; } .academy-1__content .info .title { width: 100%; } .academy-1__content .info .title h1 { font-size: 48px; font-weight: 900; letter-spacing: -0.02em; line-height: 1.12; margin-bottom: 22px; color: var(--e2); } @media (max-width: 767.98px) { .academy-1__content .info .title h1 { font-size: 48px; } } .academy-1__content .info .subtitle { width: 100%; } .academy-1__content .info .subtitle p { font-size: 16.5px; color: var(--a1); line-height: 1.7; max-width: 520px; margin-bottom: 38px; font-weight: 400; } .academy-1__content .info .actions { width: 100%; display: flex; } .academy-1__content .info .actions a:first-child { margin-right: 10px; } @media (max-width: 767.98px) { .academy-1__content .info .actions a:first-child { margin-right: 0; margin-bottom: 10px; } } @media (max-width: 767.98px) { .academy-1__content .info .actions a { width: 100%; } } @media (max-width: 767.98px) { .academy-1__content .info .actions { padding-top: 64px; } } .academy-1__content .poster { width: 40%; } @media (max-width: 767.98px) { .academy-1 { padding-top: 70px; } } .academy-2 { position: relative; padding-top: 160px; } .academy-2__bg { position: absolute; right: -205px; bottom: 0; min-width: 70%; } .academy-2__bg picture { display: block; } .academy-2__bg picture img { min-width: 70%; } @media (max-width: 767.98px) { .academy-2__bg picture { display: none; } } .academy-2__bg .mobile { display: none; } @media (max-width: 767.98px) { .academy-2__bg .mobile { display: block; } } @media (max-width: 767.98px) { .academy-2__bg { top: 70px; } } .academy-2__content { padding-top: 128px; padding-bottom: 128px; } .academy-2__content .info { width: 50%; margin-right: 64px; } .academy-2__content .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); margin-bottom: 48px; } .academy-2__content .info .marker__dot { width: 6px; height: 6px; border-radius: 50%; background: #36C006; box-shadow: 0 0 0 3px rgba(54, 192, 6, 0.12); } .academy-2__content .info .marker__text p { color: #36C006; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; text-align: left; } .academy-2__content .info .title { width: 100%; } .academy-2__content .info .title h1 { color: var(--e2); font-size: 80px; font-style: normal; font-weight: 700; line-height: 80px; text-transform: capitalize; margin-bottom: 48px; } @media (max-width: 767.98px) { .academy-2__content .info .title h1 { font-size: 48px; } } .academy-2__content .info .subtitle { width: 100%; } .academy-2__content .info .subtitle p { color: #9D9D9D; font-size: 24px; font-style: normal; font-weight: 400; line-height: 32px; } .academy-2__content .webinar { display: flex; padding: 48px; flex-direction: column; align-items: flex-start; gap: 32px; flex: 1 0 0; border-radius: 48px; background: rgba(226, 226, 226, 0.06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); } .academy-2__content .webinar__header { width: 100%; display: flex; justify-content: space-between; align-items: center; } .academy-2__content .webinar__header .title p { color: #9D9D9D; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-2__content .webinar__header .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-2__content .webinar__header .marker__dot { width: 6px; height: 6px; border-radius: 50%; background: #36C006; box-shadow: 0 0 0 3px rgba(54, 192, 6, 0.12); } .academy-2__content .webinar__header .marker__text p { color: #36C006; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; text-align: left; } .academy-2__content .webinar__teacher { width: 100%; display: flex; align-items: center; } .academy-2__content .webinar__teacher .avatar { width: 128px; height: 128px; flex-shrink: 0; margin-right: 32px; border-radius: 50%; overflow: hidden; } .academy-2__content .webinar__teacher .avatar img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } .academy-2__content .webinar__teacher .info { width: 100%; display: flex; align-items: center; flex-wrap: wrap; } .academy-2__content .webinar__teacher .info .title { width: 100%; } .academy-2__content .webinar__teacher .info .title p { color: var(--e2); font-size: 24px; font-weight: 400; line-height: 28px; } .academy-2__content .webinar__teacher .info .subtitle { width: 100%; margin-top: 6px; } .academy-2__content .webinar__teacher .info .subtitle p { color: var(--a1); font-size: 16px; font-weight: 400; line-height: 18px; } .academy-2__content .webinar .divider { width: 100%; height: 1px; border-top: 1px solid rgba(226, 226, 226, 0.12); } .academy-2__content .webinar__title { width: 100%; } .academy-2__content .webinar__title p { color: var(--e2); font-size: 24px; font-weight: 700; line-height: 32px; } .academy-2__content .webinar__date { width: 100%; display: flex; gap: 16px; margin-bottom: 32px; } .academy-2__content .webinar__date .board { display: flex; padding: 8px 16px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 6px; flex: 1 0 0; border-radius: 8px; border: 1px solid rgba(226, 226, 226, 0.12); background: #0E0E0E; } .academy-2__content .webinar__date .board .header p { color: #6B6B6B; font-family: "Roboto Mono", sans-serif; font-size: 12px; font-weight: 400; line-height: 16px; letter-spacing: 2px; } .academy-2__content .webinar__date .board .text { margin-top: 6px; } .academy-2__content .webinar__date .board .text p { color: #E2E2E2; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; /* 150% */ } .academy-2__content .webinar .actions { width: 100%; } .academy-2__content .webinar .actions a { width: 100%; } @media (max-width: 767.98px) { .academy-2 { padding-top: 70px; } } .academy-3 { position: relative; padding-top: 128px; padding-bottom: 128px; } .academy-3 .info { display: flex; flex-direction: column; align-items: center; gap: 32px; align-self: stretch; } .academy-3 .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-3 .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-3 .info .title { width: 100%; } .academy-3 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .academy-3 .info .title { font-size: 48px; } } .academy-3 .info .subtitle { width: 100%; } .academy-3 .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .academy-3 .info .subtitle { padding-top: 32px; } } .academy-3 .cards { padding-top: 64px; display: flex; flex-wrap: wrap; align-items: stretch; gap: 24px; align-self: stretch; } .academy-3 .cards .card { width: 30%; display: flex; padding: 48px; flex-direction: column; align-items: stretch; border-radius: 24px; background: #1A1A1A; } .academy-3 .cards .card .logo { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.1); } .academy-3 .cards .card .title { padding-top: 48px; } .academy-3 .cards .card .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: 32px; } .academy-3 .cards .card .description { padding-top: 16px; } .academy-3 .cards .card .description p { color: #9D9D9D; font-size: 20px; font-style: normal; font-weight: 400; line-height: 24px; } .academy-3 .cards .card:hover { box-shadow: inset 0 0 0 2px #36C006; background: transparent; } @media (max-width: 767.98px) { .academy-3 .cards .card { padding: 32px 24px; } } @media (max-width: 767.98px) { .academy-3 .cards { flex-wrap: wrap; } } @media (max-width: 767.98px) { .academy-3 { padding-top: 64px; padding-bottom: 64px; } } .academy-4 { position: relative; } .academy-4__bg { position: absolute; top: 0; left: -210px; min-width: 70%; rotate: 180deg; } .academy-4__bg picture { display: block; } .academy-4__bg picture img { min-width: 70%; } @media (max-width: 767.98px) { .academy-4__bg picture { display: none; } } .academy-4__bg .mobile { display: none; } @media (max-width: 767.98px) { .academy-4__bg .mobile { display: block; } } @media (max-width: 767.98px) { .academy-4__bg { top: 70px; } } .academy-4__content { padding-top: 128px; padding-bottom: 128px; } .academy-4__content .poster { width: 500px; height: 500px; flex-shrink: 0; margin-right: 64px; border-radius: 80px; overflow: hidden; } .academy-4__content .poster img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 80px; } .academy-4__content .about { width: 50%; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; } .academy-4__content .about .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-4__content .about .marker__text p { color: #36C006; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; text-align: left; } .academy-4__content .about .speaker .title p { color: var(--e2); font-size: 48px; font-style: normal; font-weight: 700; line-height: 52px; } .academy-4__content .about .speaker .position { margin-top: 8px; } .academy-4__content .about .speaker .position p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-4__content .about .description p { color: #9D9D9D; font-size: 24px; font-weight: 400; line-height: 32px; } .academy-4__content .about .portfolio { display: flex; align-items: center; gap: 16px; align-self: stretch; } .academy-4__content .about .portfolio .board { display: flex; padding: 8px 16px; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; border-radius: 16px; background: rgba(226, 226, 226, 0.06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); } .academy-4__content .about .portfolio .board .count p { color: var(--e2); font-family: "Roboto Mono", sans-serif; font-size: 32px; font-weight: 700; line-height: 48px; } .academy-4__content .about .portfolio .board .text { margin-top: 8px; } .academy-4__content .about .portfolio .board .text p { color: #9D9D9D; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 150% */ } .academy-4__content .about .skills { display: flex; align-items: flex-start; align-content: flex-start; gap: 8px; align-self: stretch; flex-wrap: wrap; } .academy-4__content .about .skills .skill { display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(109, 109, 109, 0.64); background: rgba(109, 109, 109, 0.16); } .academy-4__content .about .skills .skill p { color: #6D6D6D; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: capitalize; } .academy-5 { position: relative; padding-top: 128px; padding-bottom: 128px; } .academy-5 .info { display: flex; flex-direction: column; align-items: center; gap: 32px; align-self: stretch; } .academy-5 .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-5 .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-5 .info .title { width: 100%; } .academy-5 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .academy-5 .info .title { font-size: 48px; } } .academy-5 .info .subtitle { width: 100%; } .academy-5 .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .academy-5 .info .subtitle { padding-top: 32px; } } .academy-5 .cards { padding-top: 64px; display: flex; flex-wrap: wrap; align-items: stretch; gap: 24px; align-self: stretch; } .academy-5 .cards .card { width: 45%; display: flex; padding: 48px; flex-direction: column; align-items: stretch; border-radius: 24px; background: #1A1A1A; } .academy-5 .cards .card .logo { display: flex; width: 45px; height: 45px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.1); } .academy-5 .cards .card .title { padding-top: 48px; } .academy-5 .cards .card .title p { color: var(--e2); font-size: 32px; font-weight: 700; line-height: 32px; } .academy-5 .cards .card .description { padding-top: 24px; } .academy-5 .cards .card .description p { color: #9D9D9D; font-size: 20px; font-style: normal; font-weight: 400; line-height: 24px; } .academy-5 .cards .card:hover { box-shadow: inset 0 0 0 2px #36C006; background: transparent; } @media (max-width: 767.98px) { .academy-5 .cards .card { padding: 32px 24px; } } @media (max-width: 767.98px) { .academy-5 .cards { flex-wrap: wrap; } } @media (max-width: 767.98px) { .academy-5 { padding-top: 64px; padding-bottom: 64px; } } .academy-6 { position: relative; } .academy-6__bg { position: absolute; top: 0; right: 75px; min-width: 70%; rotate: 180deg; } .academy-6__bg picture { display: block; } .academy-6__bg picture img { min-width: 70%; } @media (max-width: 767.98px) { .academy-6__bg picture { display: none; } } .academy-6__bg .mobile { display: none; } @media (max-width: 767.98px) { .academy-6__bg .mobile { display: block; } } @media (max-width: 767.98px) { .academy-6__bg { top: 70px; } } .academy-6__content { padding-top: 128px; padding-bottom: 128px; } .academy-6__content .info { width: 50%; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; flex: 1 0 0; } .academy-6__content .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-6__content .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-6__content .info .title p { color: var(--e2); font-size: 48px; font-weight: 700; line-height: 52px; } .academy-6__content .info .subtitle p { color: var(--a1); font-size: 24px; font-weight: 400; line-height: 32px; } .academy-6__content .info .points { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; align-self: stretch; } .academy-6__content .info .points .point { display: flex; padding: 8px; align-items: center; gap: 16px; align-self: stretch; } .academy-6__content .register-form { width: 50%; display: flex; padding: 48px; flex-direction: column; align-items: flex-start; gap: 32px; flex: 1 0 0; border-radius: 48px; background: rgba(226, 226, 226, 0.06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); } .academy-6__content .register-form .row { width: 100%; } .academy-6__content .register-form .field label { color: var(--e2); font-family: "Roboto Mono", sans-serif; font-size: 12px; font-weight: 400; line-height: 16px; } .academy-6__content .register-form .field input { margin-top: 16px; display: flex; padding: 16px; flex-direction: column; align-items: flex-start; gap: 32px; align-self: stretch; border-radius: 8px; border: 1px solid rgba(226, 226, 226, 0.12); background: rgba(226, 226, 226, 0.04); color: var(--e2); font-size: 14px; font-weight: 500; line-height: 24px; letter-spacing: -0.28px; } .academy-6__content .register-form .field input:focus { outline: none; } .academy-6__content .register-form .field input::-moz-placeholder { color: #6D6D6D; } .academy-6__content .register-form .field input::placeholder { color: #6D6D6D; } .academy-6__content .register-form .field .academy-select { width: 100%; display: flex; flex-direction: column; align-items: flex-start; } .academy-6__content .register-form .field .academy-select .form_field { width: 100%; margin-top: 16px; } .academy-6__content .register-form .field .academy-select .form_field .select2-container--default .select2-selection--single { display: flex; align-items: center; width: 100%; height: auto; padding: 16px; border-radius: 8px; border: 1px solid rgba(226, 226, 226, 0.12); background: rgba(226, 226, 226, 0.04); outline: none; } .academy-6__content .register-form .field .academy-select .form_field .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 0; color: #E2E2E2; font-size: 16px; line-height: 1.2; } .academy-6__content .register-form .field .academy-select .form_field .select2-container--default .select2-selection--single .select2-selection__arrow { right: 15px; top: 18px; } .academy-6__content .register-form .field .form__error { margin-top: 2px; color: #D92252; font-size: 12px; font-weight: 400; line-height: 16px; } .academy-6__content .register-form .terms { display: flex; align-items: center; padding: 8px 0; } .academy-6__content .register-form .terms .logo { display: flex; align-items: center; } .academy-6__content .register-form .terms .text { margin-left: 16px; } .academy-6__content .register-form .terms .text p { color: #9D9D9D; font-size: 14px; font-weight: 400; line-height: 16px; } .academy-6__content .register-form .divider { width: 100%; height: 1px; border-top: 1px solid rgba(226, 226, 226, 0.12); } .academy-6__content .register-form button { width: 100%; } .academy-6__content .register-form .agree { width: 100%; } .academy-6__content .register-form .agree p { color: #6D6D6D; font-size: 12px; font-weight: 400; line-height: 16px; } .academy-6__content .register-form .title { width: 100%; } .academy-6__content .register-form .title p { color: var(--e2); text-align: center; font-size: 32px; font-weight: 700; line-height: 32px; margin: 0; } .academy-6__content .register-form .subtitle { width: 100%; } .academy-6__content .register-form .subtitle p { color: #9D9D9D; text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; margin: 0; } .academy-6__content .register-form .description { width: 100%; } .academy-6__content .register-form .description p { color: #6D6D6D; text-align: center; font-size: 20px; font-weight: 400; line-height: 24px; margin: 0; } .academy-6__content .register-form .actions { width: 100%; } .academy-6__content .register-form .actions a { width: 100%; } .select2-container--open .select2-dropdown--below { margin-top: 40px; } .academy-7 { position: relative; } .academy-7__bg { position: absolute; bottom: 0; right: 200px; min-width: 70%; } .academy-7__bg picture { display: block; } .academy-7__bg picture img { min-width: 70%; } @media (max-width: 767.98px) { .academy-7__bg picture { display: none; } } .academy-7__bg .mobile { display: none; } @media (max-width: 767.98px) { .academy-7__bg .mobile { display: block; } } @media (max-width: 767.98px) { .academy-7__bg { top: 70px; } } .academy-7__content { padding-top: 128px; padding-bottom: 128px; } .academy-7__content .info { display: flex; flex-direction: column; align-items: center; gap: 32px; align-self: stretch; } .academy-7__content .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-7__content .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-7__content .info .title { width: 100%; } .academy-7__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .academy-7__content .info .title { font-size: 48px; } } .academy-7__content .info .subtitle { width: 100%; } .academy-7__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .academy-7__content .info .subtitle { padding-top: 32px; } } .academy-7__content .actions { margin-top: 64px; display: flex; padding: 48px; align-items: flex-start; gap: 32px; align-self: stretch; border-radius: 48px; background: rgba(226, 226, 226, 0.06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); } .academy-7__content .actions .action .logo { display: flex; width: 45px; height: 45px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.1); } .academy-7__content .actions .action .title { margin-top: 24px; } .academy-7__content .actions .action .title p { color: var(--e2); font-size: 24px; font-weight: 700; line-height: 32px; } .academy-7__content .actions .action .subtitle { margin-top: 12px; } .academy-7__content .actions .action .subtitle p { color: #9D9D9D; font-size: 16px; font-weight: 400; line-height: 24px; } .academy-8 { position: relative; padding-top: 128px; padding-bottom: 128px; } .academy-8 .info { display: flex; flex-direction: column; align-items: center; gap: 32px; align-self: stretch; } .academy-8 .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-8 .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-8 .info .title { width: 100%; } .academy-8 .info .title p { color: var(--e2); font-size: 64px; text-align: center; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .academy-8 .info .title { font-size: 48px; } } .academy-8 .info .subtitle { width: 100%; } .academy-8 .info .subtitle p { color: var(--a1); font-size: 24px; text-align: center; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .academy-8 .info .subtitle { padding-top: 32px; } } .academy-8 .cards { width: 100%; padding-top: 64px; display: flex; flex-wrap: wrap; align-items: stretch; gap: 24px; align-self: stretch; } .academy-8 .cards .card { width: 30%; display: flex; padding: 48px; flex-direction: column; align-items: stretch; border-radius: 24px; background: #1A1A1A; } .academy-8 .cards .card .player { width: 100%; aspect-ratio: 16/9; border-radius: 12px; margin-bottom: 24px; overflow: hidden; position: relative; background-size: cover; background-position: center; } .academy-8 .cards .card .player .player-link { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; text-decoration: none; transition: color 0.3s ease; } .academy-8 .cards .card .player .player-link .play-icon { fill: none; stroke: #9D9D9D; transition: transform 0.3s ease; } .academy-8 .cards .card .logo { display: flex; width: 45px; height: 45px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.1); } .academy-8 .cards .card .title { margin-top: 24px; } .academy-8 .cards .card .title p { color: var(--e2); font-size: 24px; font-weight: 700; line-height: 32px; } .academy-8 .cards .card .speaker { margin-top: 12px; } .academy-8 .cards .card .speaker p { color: #9D9D9D; font-size: 16px; font-weight: 400; line-height: 24px; } .academy-8 .cards .card .date { margin-top: 12px; margin-bottom: 24px; } .academy-8 .cards .card .date p { color: #6D6D6D; font-size: 16px; font-weight: 400; line-height: 24px; } .academy-8 .cards .card .description { margin-top: 16px; margin-bottom: 24px; } .academy-8 .cards .card .description p { color: #9D9D9D; font-size: 16px; font-weight: 400; line-height: 24px; } .academy-8 .cards .card .actions { margin-top: auto; width: 100%; } .academy-8 .cards .card .actions .btn { width: 100%; } .academy-8 .cards .card:hover { box-shadow: inset 0 0 0 2px #36C006; background: transparent; } .academy-8 .cards .card:hover .player .player-link .play-icon { stroke: #36C006; transform: scale(1.1); } @media (max-width: 767.98px) { .academy-8 .cards .card { padding: 32px 24px; } } @media (max-width: 767.98px) { .academy-8 .cards { flex-wrap: wrap; } } .academy-8 .actions { margin-top: 64px; width: 100%; } .academy-8 .actions .btn { width: 100%; } @media (max-width: 767.98px) { .academy-8 { padding-top: 64px; padding-bottom: 64px; } } .academy-9 { position: relative; } .academy-9__bg { position: absolute; bottom: 0; right: 200px; min-width: 70%; } .academy-9__bg picture { display: block; } .academy-9__bg picture img { min-width: 70%; } @media (max-width: 767.98px) { .academy-9__bg picture { display: none; } } .academy-9__bg .mobile { display: none; } @media (max-width: 767.98px) { .academy-9__bg .mobile { display: block; } } @media (max-width: 767.98px) { .academy-9__bg { top: 70px; } } .academy-9__content { padding-top: 128px; padding-bottom: 128px; } .academy-9__content .info { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 32px; align-self: stretch; } .academy-9__content .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-9__content .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-9__content .info .title { width: 100%; } .academy-9__content .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .academy-9__content .info .title { font-size: 48px; } } .academy-9__content .info .subtitle { width: 100%; } .academy-9__content .info .subtitle p { color: var(--a1); text-align: center; font-size: 24px; font-weight: 400; line-height: 32px; } @media (max-width: 767.98px) { .academy-9__content .info .subtitle { padding-top: 32px; } } .academy-9__content .card { margin-top: 64px; display: flex; padding: 48px; flex-direction: column; align-items: center; gap: 32px; border-radius: 48px; background: rgba(226, 226, 226, 0.06); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); } .academy-9__content .card .logo { display: flex; width: 45px; height: 45px; justify-content: center; align-items: center; border-radius: 12px; background: rgba(54, 192, 6, 0.1); } .academy-9__content .card .actions { width: 100%; } .academy-9__content .card .actions .btn { width: 100%; } .academy-10 { position: relative; padding-top: 128px; padding-bottom: 128px; } .academy-10 .info { display: flex; flex-direction: column; align-items: center; gap: 32px; align-self: stretch; } .academy-10 .info .marker { width: -moz-fit-content; width: fit-content; display: flex; padding: 8px 16px; justify-content: center; align-items: center; gap: 12px; border-radius: 111px; border: 1px solid rgba(54, 192, 6, 0.64); background: rgba(54, 192, 6, 0.16); } .academy-10 .info .marker p { color: #36C006; font-family: "Roboto Mono", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; letter-spacing: 0.32px; text-transform: uppercase; } .academy-10 .info .title { width: 100%; } .academy-10 .info .title p { color: var(--e2); text-align: center; font-size: 64px; font-weight: 700; margin: 0; } @media (max-width: 767.98px) { .academy-10 .info .title { font-size: 48px; } } .academy-10 .academy-10__faqs { position: relative; width: 100%; max-width: 1300px; margin: 64px auto 0; } .academy-10 .academy-10__faqs .content-collapsed { transition: none !important; } .academy-10 .academy-10__faqs .content-collapsed .academy-10__faq-description { max-height: 0 !important; } .academy-10 .academy-10__faqs .content-collapsed .academy-10__faq-description .academy-10__faq-content { max-height: 0 !important; padding: 0 !important; } .academy-10 .academy-10__faqs .content-collapsed:hover { transition: 0.3s ease-in-out; background-color: var(--green); } .academy-10 .academy-10__faqs .content-collapsed:hover .academy-10__faq-header .academy-10__faq-number { color: var(--cod-gray); } .academy-10 .academy-10__faqs .content-collapsed:hover .academy-10__faq-header .academy-10__faq-title { color: var(--cod-gray); } .academy-10 .academy-10__faqs .content-collapsed:hover .academy-10__faq-header .icon { fill: var(--cod-gray); } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs .content-collapsed { border-radius: 0 !important; } } .academy-10 .academy-10__faqs .content-expanded { transition: 0.3s ease-in-out; border-bottom: 8px var(--green) solid; padding-bottom: 0 !important; } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-header .academy-10__faq-number { color: var(--green); } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-header .icon { transform: rotate(90deg); fill: var(--e2); } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description { transition: 0.3s ease-in-out; } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description .academy-10__faq-content { color: var(--a1); font-size: 16px; line-height: 140%; padding: 32px 78px; } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description .academy-10__faq-content-point { padding: 16px 0; } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description .academy-10__faq-content-point ul { padding-top: 16px; list-style-position: inside; list-style-type: disc; } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description .academy-10__faq-content-point ul { padding-top: 6px; } } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description .academy-10__faq-content-point { padding: 6px 0; } } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description .academy-10__faq-content { padding: 24px 12px; } } .academy-10 .academy-10__faqs .content-expanded .academy-10__faq-description:before { content: ""; border-left: var(--green) 2px solid; margin-left: 14px; } .academy-10 .academy-10__faqs .academy-10__faq { margin: 24px 0; color: var(--e2); width: 100%; padding: 32px; background-color: var(--black-100); border-radius: 12px; } .academy-10 .academy-10__faqs .academy-10__faq .academy-10__faq-header .academy-10__faq-number { color: var(--e2); font-size: 20px; font-weight: 500; } .academy-10 .academy-10__faqs .academy-10__faq .academy-10__faq-header .academy-10__faq-title { color: var(--e2); margin-left: 64px; font-size: 32px; font-weight: 500; line-height: 110%; } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs .academy-10__faq .academy-10__faq-header .academy-10__faq-title { font-size: 20px; margin-left: 0; } } .academy-10 .academy-10__faqs .academy-10__faq .academy-10__faq-header .icon { stroke-width: 3px; transition: all 0.3s; } .academy-10 .academy-10__faqs .academy-10__faq .academy-10__faq-description { overflow: hidden; transition: 0.3s ease-in-out; } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs .academy-10__faq { padding: 12px 20px; } } @media (max-width: 991.98px) { .academy-10 .academy-10__faqs { margin: 0; padding: 48px 0 0; } } @media (max-width: 767.98px) { .academy-10 { padding-top: 64px; padding-bottom: 64px; } } /* BUTTONS */ #academy .btn-primary, #academy .tabulator .tabulator-footer .tabulator-paginator button, .tabulator .tabulator-footer .tabulator-paginator #academy button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 700; font-size: 14.5px; letter-spacing: 0.01em; padding: 15px 26px; transition: transform 0.15s, box-shadow 0.15s, background 0.15s, border-color 0.15s; border-radius: 64px; } #academy .btn-secondary { border-radius: 64px; background: linear-gradient(155deg, #43DF08 12.38%, #36C006 53.76%, #279105 87.62%); box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.25) inset, 0 8px 24px -6px rgba(54, 192, 6, 0.35); display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 700; font-size: 14.5px; letter-spacing: 0.01em; padding: 15px 26px; color: var(--black); }