body[data-aos-duration="50"] [data-aos], [data-aos][data-aos][data-aos-duration="50"] {
  transition-duration: 50ms;
}
body[data-aos-delay="50"] [data-aos], [data-aos][data-aos][data-aos-delay="50"] {
  transition-delay: 0;
}
body[data-aos-delay="50"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="50"].aos-animate {
  transition-delay: 50ms;
}
body[data-aos-duration="100"] [data-aos], [data-aos][data-aos][data-aos-duration="100"] {
  transition-duration: 100ms;
}
body[data-aos-delay="100"] [data-aos], [data-aos][data-aos][data-aos-delay="100"] {
  transition-delay: 0;
}
body[data-aos-delay="100"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="100"].aos-animate {
  transition-delay: 100ms;
}
body[data-aos-duration="150"] [data-aos], [data-aos][data-aos][data-aos-duration="150"] {
  transition-duration: 150ms;
}
body[data-aos-delay="150"] [data-aos], [data-aos][data-aos][data-aos-delay="150"] {
  transition-delay: 0;
}
body[data-aos-delay="150"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="150"].aos-animate {
  transition-delay: 150ms;
}
body[data-aos-duration="200"] [data-aos], [data-aos][data-aos][data-aos-duration="200"] {
  transition-duration: 200ms;
}
body[data-aos-delay="200"] [data-aos], [data-aos][data-aos][data-aos-delay="200"] {
  transition-delay: 0;
}
body[data-aos-delay="200"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="200"].aos-animate {
  transition-delay: 200ms;
}
body[data-aos-duration="250"] [data-aos], [data-aos][data-aos][data-aos-duration="250"] {
  transition-duration: 250ms;
}
body[data-aos-delay="250"] [data-aos], [data-aos][data-aos][data-aos-delay="250"] {
  transition-delay: 0;
}
body[data-aos-delay="250"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="250"].aos-animate {
  transition-delay: 250ms;
}
body[data-aos-duration="300"] [data-aos], [data-aos][data-aos][data-aos-duration="300"] {
  transition-duration: 300ms;
}
body[data-aos-delay="300"] [data-aos], [data-aos][data-aos][data-aos-delay="300"] {
  transition-delay: 0;
}
body[data-aos-delay="300"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="300"].aos-animate {
  transition-delay: 300ms;
}
body[data-aos-duration="350"] [data-aos], [data-aos][data-aos][data-aos-duration="350"] {
  transition-duration: 350ms;
}
body[data-aos-delay="350"] [data-aos], [data-aos][data-aos][data-aos-delay="350"] {
  transition-delay: 0;
}
body[data-aos-delay="350"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="350"].aos-animate {
  transition-delay: 350ms;
}
body[data-aos-duration="400"] [data-aos], [data-aos][data-aos][data-aos-duration="400"] {
  transition-duration: 400ms;
}
body[data-aos-delay="400"] [data-aos], [data-aos][data-aos][data-aos-delay="400"] {
  transition-delay: 0;
}
body[data-aos-delay="400"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="400"].aos-animate {
  transition-delay: 400ms;
}
body[data-aos-duration="450"] [data-aos], [data-aos][data-aos][data-aos-duration="450"] {
  transition-duration: 450ms;
}
body[data-aos-delay="450"] [data-aos], [data-aos][data-aos][data-aos-delay="450"] {
  transition-delay: 0;
}
body[data-aos-delay="450"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="450"].aos-animate {
  transition-delay: 450ms;
}
body[data-aos-duration="500"] [data-aos], [data-aos][data-aos][data-aos-duration="500"] {
  transition-duration: 500ms;
}
body[data-aos-delay="500"] [data-aos], [data-aos][data-aos][data-aos-delay="500"] {
  transition-delay: 0;
}
body[data-aos-delay="500"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="500"].aos-animate {
  transition-delay: 500ms;
}
body[data-aos-duration="550"] [data-aos], [data-aos][data-aos][data-aos-duration="550"] {
  transition-duration: 550ms;
}
body[data-aos-delay="550"] [data-aos], [data-aos][data-aos][data-aos-delay="550"] {
  transition-delay: 0;
}
body[data-aos-delay="550"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="550"].aos-animate {
  transition-delay: 550ms;
}
body[data-aos-duration="600"] [data-aos], [data-aos][data-aos][data-aos-duration="600"] {
  transition-duration: 600ms;
}
body[data-aos-delay="600"] [data-aos], [data-aos][data-aos][data-aos-delay="600"] {
  transition-delay: 0;
}
body[data-aos-delay="600"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="600"].aos-animate {
  transition-delay: 600ms;
}
body[data-aos-duration="650"] [data-aos], [data-aos][data-aos][data-aos-duration="650"] {
  transition-duration: 650ms;
}
body[data-aos-delay="650"] [data-aos], [data-aos][data-aos][data-aos-delay="650"] {
  transition-delay: 0;
}
body[data-aos-delay="650"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="650"].aos-animate {
  transition-delay: 650ms;
}
body[data-aos-duration="700"] [data-aos], [data-aos][data-aos][data-aos-duration="700"] {
  transition-duration: 700ms;
}
body[data-aos-delay="700"] [data-aos], [data-aos][data-aos][data-aos-delay="700"] {
  transition-delay: 0;
}
body[data-aos-delay="700"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="700"].aos-animate {
  transition-delay: 700ms;
}
body[data-aos-duration="750"] [data-aos], [data-aos][data-aos][data-aos-duration="750"] {
  transition-duration: 750ms;
}
body[data-aos-delay="750"] [data-aos], [data-aos][data-aos][data-aos-delay="750"] {
  transition-delay: 0;
}
body[data-aos-delay="750"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="750"].aos-animate {
  transition-delay: 750ms;
}
body[data-aos-duration="800"] [data-aos], [data-aos][data-aos][data-aos-duration="800"] {
  transition-duration: 800ms;
}
body[data-aos-delay="800"] [data-aos], [data-aos][data-aos][data-aos-delay="800"] {
  transition-delay: 0;
}
body[data-aos-delay="800"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="800"].aos-animate {
  transition-delay: 800ms;
}
body[data-aos-duration="850"] [data-aos], [data-aos][data-aos][data-aos-duration="850"] {
  transition-duration: 850ms;
}
body[data-aos-delay="850"] [data-aos], [data-aos][data-aos][data-aos-delay="850"] {
  transition-delay: 0;
}
body[data-aos-delay="850"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="850"].aos-animate {
  transition-delay: 850ms;
}
body[data-aos-duration="900"] [data-aos], [data-aos][data-aos][data-aos-duration="900"] {
  transition-duration: 900ms;
}
body[data-aos-delay="900"] [data-aos], [data-aos][data-aos][data-aos-delay="900"] {
  transition-delay: 0;
}
body[data-aos-delay="900"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="900"].aos-animate {
  transition-delay: 900ms;
}
body[data-aos-duration="950"] [data-aos], [data-aos][data-aos][data-aos-duration="950"] {
  transition-duration: 950ms;
}
body[data-aos-delay="950"] [data-aos], [data-aos][data-aos][data-aos-delay="950"] {
  transition-delay: 0;
}
body[data-aos-delay="950"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="950"].aos-animate {
  transition-delay: 950ms;
}
body[data-aos-duration="1000"] [data-aos], [data-aos][data-aos][data-aos-duration="1000"] {
  transition-duration: 1000ms;
}
body[data-aos-delay="1000"] [data-aos], [data-aos][data-aos][data-aos-delay="1000"] {
  transition-delay: 0;
}
body[data-aos-delay="1000"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1000"].aos-animate {
  transition-delay: 1000ms;
}
body[data-aos-duration="1050"] [data-aos], [data-aos][data-aos][data-aos-duration="1050"] {
  transition-duration: 1050ms;
}
body[data-aos-delay="1050"] [data-aos], [data-aos][data-aos][data-aos-delay="1050"] {
  transition-delay: 0;
}
body[data-aos-delay="1050"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1050"].aos-animate {
  transition-delay: 1050ms;
}
body[data-aos-duration="1100"] [data-aos], [data-aos][data-aos][data-aos-duration="1100"] {
  transition-duration: 1100ms;
}
body[data-aos-delay="1100"] [data-aos], [data-aos][data-aos][data-aos-delay="1100"] {
  transition-delay: 0;
}
body[data-aos-delay="1100"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1100"].aos-animate {
  transition-delay: 1100ms;
}
body[data-aos-duration="1150"] [data-aos], [data-aos][data-aos][data-aos-duration="1150"] {
  transition-duration: 1150ms;
}
body[data-aos-delay="1150"] [data-aos], [data-aos][data-aos][data-aos-delay="1150"] {
  transition-delay: 0;
}
body[data-aos-delay="1150"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1150"].aos-animate {
  transition-delay: 1150ms;
}
body[data-aos-duration="1200"] [data-aos], [data-aos][data-aos][data-aos-duration="1200"] {
  transition-duration: 1200ms;
}
body[data-aos-delay="1200"] [data-aos], [data-aos][data-aos][data-aos-delay="1200"] {
  transition-delay: 0;
}
body[data-aos-delay="1200"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1200"].aos-animate {
  transition-delay: 1200ms;
}
body[data-aos-duration="1250"] [data-aos], [data-aos][data-aos][data-aos-duration="1250"] {
  transition-duration: 1250ms;
}
body[data-aos-delay="1250"] [data-aos], [data-aos][data-aos][data-aos-delay="1250"] {
  transition-delay: 0;
}
body[data-aos-delay="1250"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1250"].aos-animate {
  transition-delay: 1250ms;
}
body[data-aos-duration="1300"] [data-aos], [data-aos][data-aos][data-aos-duration="1300"] {
  transition-duration: 1300ms;
}
body[data-aos-delay="1300"] [data-aos], [data-aos][data-aos][data-aos-delay="1300"] {
  transition-delay: 0;
}
body[data-aos-delay="1300"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1300"].aos-animate {
  transition-delay: 1300ms;
}
body[data-aos-duration="1350"] [data-aos], [data-aos][data-aos][data-aos-duration="1350"] {
  transition-duration: 1350ms;
}
body[data-aos-delay="1350"] [data-aos], [data-aos][data-aos][data-aos-delay="1350"] {
  transition-delay: 0;
}
body[data-aos-delay="1350"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1350"].aos-animate {
  transition-delay: 1350ms;
}
body[data-aos-duration="1400"] [data-aos], [data-aos][data-aos][data-aos-duration="1400"] {
  transition-duration: 1400ms;
}
body[data-aos-delay="1400"] [data-aos], [data-aos][data-aos][data-aos-delay="1400"] {
  transition-delay: 0;
}
body[data-aos-delay="1400"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1400"].aos-animate {
  transition-delay: 1400ms;
}
body[data-aos-duration="1450"] [data-aos], [data-aos][data-aos][data-aos-duration="1450"] {
  transition-duration: 1450ms;
}
body[data-aos-delay="1450"] [data-aos], [data-aos][data-aos][data-aos-delay="1450"] {
  transition-delay: 0;
}
body[data-aos-delay="1450"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1450"].aos-animate {
  transition-delay: 1450ms;
}
body[data-aos-duration="1500"] [data-aos], [data-aos][data-aos][data-aos-duration="1500"] {
  transition-duration: 1500ms;
}
body[data-aos-delay="1500"] [data-aos], [data-aos][data-aos][data-aos-delay="1500"] {
  transition-delay: 0;
}
body[data-aos-delay="1500"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1500"].aos-animate {
  transition-delay: 1500ms;
}
body[data-aos-duration="1550"] [data-aos], [data-aos][data-aos][data-aos-duration="1550"] {
  transition-duration: 1550ms;
}
body[data-aos-delay="1550"] [data-aos], [data-aos][data-aos][data-aos-delay="1550"] {
  transition-delay: 0;
}
body[data-aos-delay="1550"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1550"].aos-animate {
  transition-delay: 1550ms;
}
body[data-aos-duration="1600"] [data-aos], [data-aos][data-aos][data-aos-duration="1600"] {
  transition-duration: 1600ms;
}
body[data-aos-delay="1600"] [data-aos], [data-aos][data-aos][data-aos-delay="1600"] {
  transition-delay: 0;
}
body[data-aos-delay="1600"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1600"].aos-animate {
  transition-delay: 1600ms;
}
body[data-aos-duration="1650"] [data-aos], [data-aos][data-aos][data-aos-duration="1650"] {
  transition-duration: 1650ms;
}
body[data-aos-delay="1650"] [data-aos], [data-aos][data-aos][data-aos-delay="1650"] {
  transition-delay: 0;
}
body[data-aos-delay="1650"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1650"].aos-animate {
  transition-delay: 1650ms;
}
body[data-aos-duration="1700"] [data-aos], [data-aos][data-aos][data-aos-duration="1700"] {
  transition-duration: 1700ms;
}
body[data-aos-delay="1700"] [data-aos], [data-aos][data-aos][data-aos-delay="1700"] {
  transition-delay: 0;
}
body[data-aos-delay="1700"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1700"].aos-animate {
  transition-delay: 1700ms;
}
body[data-aos-duration="1750"] [data-aos], [data-aos][data-aos][data-aos-duration="1750"] {
  transition-duration: 1750ms;
}
body[data-aos-delay="1750"] [data-aos], [data-aos][data-aos][data-aos-delay="1750"] {
  transition-delay: 0;
}
body[data-aos-delay="1750"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1750"].aos-animate {
  transition-delay: 1750ms;
}
body[data-aos-duration="1800"] [data-aos], [data-aos][data-aos][data-aos-duration="1800"] {
  transition-duration: 1800ms;
}
body[data-aos-delay="1800"] [data-aos], [data-aos][data-aos][data-aos-delay="1800"] {
  transition-delay: 0;
}
body[data-aos-delay="1800"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1800"].aos-animate {
  transition-delay: 1800ms;
}
body[data-aos-duration="1850"] [data-aos], [data-aos][data-aos][data-aos-duration="1850"] {
  transition-duration: 1850ms;
}
body[data-aos-delay="1850"] [data-aos], [data-aos][data-aos][data-aos-delay="1850"] {
  transition-delay: 0;
}
body[data-aos-delay="1850"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1850"].aos-animate {
  transition-delay: 1850ms;
}
body[data-aos-duration="1900"] [data-aos], [data-aos][data-aos][data-aos-duration="1900"] {
  transition-duration: 1900ms;
}
body[data-aos-delay="1900"] [data-aos], [data-aos][data-aos][data-aos-delay="1900"] {
  transition-delay: 0;
}
body[data-aos-delay="1900"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1900"].aos-animate {
  transition-delay: 1900ms;
}
body[data-aos-duration="1950"] [data-aos], [data-aos][data-aos][data-aos-duration="1950"] {
  transition-duration: 1950ms;
}
body[data-aos-delay="1950"] [data-aos], [data-aos][data-aos][data-aos-delay="1950"] {
  transition-delay: 0;
}
body[data-aos-delay="1950"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="1950"].aos-animate {
  transition-delay: 1950ms;
}
body[data-aos-duration="2000"] [data-aos], [data-aos][data-aos][data-aos-duration="2000"] {
  transition-duration: 2000ms;
}
body[data-aos-delay="2000"] [data-aos], [data-aos][data-aos][data-aos-delay="2000"] {
  transition-delay: 0;
}
body[data-aos-delay="2000"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2000"].aos-animate {
  transition-delay: 2000ms;
}
body[data-aos-duration="2050"] [data-aos], [data-aos][data-aos][data-aos-duration="2050"] {
  transition-duration: 2050ms;
}
body[data-aos-delay="2050"] [data-aos], [data-aos][data-aos][data-aos-delay="2050"] {
  transition-delay: 0;
}
body[data-aos-delay="2050"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2050"].aos-animate {
  transition-delay: 2050ms;
}
body[data-aos-duration="2100"] [data-aos], [data-aos][data-aos][data-aos-duration="2100"] {
  transition-duration: 2100ms;
}
body[data-aos-delay="2100"] [data-aos], [data-aos][data-aos][data-aos-delay="2100"] {
  transition-delay: 0;
}
body[data-aos-delay="2100"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2100"].aos-animate {
  transition-delay: 2100ms;
}
body[data-aos-duration="2150"] [data-aos], [data-aos][data-aos][data-aos-duration="2150"] {
  transition-duration: 2150ms;
}
body[data-aos-delay="2150"] [data-aos], [data-aos][data-aos][data-aos-delay="2150"] {
  transition-delay: 0;
}
body[data-aos-delay="2150"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2150"].aos-animate {
  transition-delay: 2150ms;
}
body[data-aos-duration="2200"] [data-aos], [data-aos][data-aos][data-aos-duration="2200"] {
  transition-duration: 2200ms;
}
body[data-aos-delay="2200"] [data-aos], [data-aos][data-aos][data-aos-delay="2200"] {
  transition-delay: 0;
}
body[data-aos-delay="2200"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2200"].aos-animate {
  transition-delay: 2200ms;
}
body[data-aos-duration="2250"] [data-aos], [data-aos][data-aos][data-aos-duration="2250"] {
  transition-duration: 2250ms;
}
body[data-aos-delay="2250"] [data-aos], [data-aos][data-aos][data-aos-delay="2250"] {
  transition-delay: 0;
}
body[data-aos-delay="2250"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2250"].aos-animate {
  transition-delay: 2250ms;
}
body[data-aos-duration="2300"] [data-aos], [data-aos][data-aos][data-aos-duration="2300"] {
  transition-duration: 2300ms;
}
body[data-aos-delay="2300"] [data-aos], [data-aos][data-aos][data-aos-delay="2300"] {
  transition-delay: 0;
}
body[data-aos-delay="2300"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2300"].aos-animate {
  transition-delay: 2300ms;
}
body[data-aos-duration="2350"] [data-aos], [data-aos][data-aos][data-aos-duration="2350"] {
  transition-duration: 2350ms;
}
body[data-aos-delay="2350"] [data-aos], [data-aos][data-aos][data-aos-delay="2350"] {
  transition-delay: 0;
}
body[data-aos-delay="2350"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2350"].aos-animate {
  transition-delay: 2350ms;
}
body[data-aos-duration="2400"] [data-aos], [data-aos][data-aos][data-aos-duration="2400"] {
  transition-duration: 2400ms;
}
body[data-aos-delay="2400"] [data-aos], [data-aos][data-aos][data-aos-delay="2400"] {
  transition-delay: 0;
}
body[data-aos-delay="2400"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2400"].aos-animate {
  transition-delay: 2400ms;
}
body[data-aos-duration="2450"] [data-aos], [data-aos][data-aos][data-aos-duration="2450"] {
  transition-duration: 2450ms;
}
body[data-aos-delay="2450"] [data-aos], [data-aos][data-aos][data-aos-delay="2450"] {
  transition-delay: 0;
}
body[data-aos-delay="2450"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2450"].aos-animate {
  transition-delay: 2450ms;
}
body[data-aos-duration="2500"] [data-aos], [data-aos][data-aos][data-aos-duration="2500"] {
  transition-duration: 2500ms;
}
body[data-aos-delay="2500"] [data-aos], [data-aos][data-aos][data-aos-delay="2500"] {
  transition-delay: 0;
}
body[data-aos-delay="2500"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2500"].aos-animate {
  transition-delay: 2500ms;
}
body[data-aos-duration="2550"] [data-aos], [data-aos][data-aos][data-aos-duration="2550"] {
  transition-duration: 2550ms;
}
body[data-aos-delay="2550"] [data-aos], [data-aos][data-aos][data-aos-delay="2550"] {
  transition-delay: 0;
}
body[data-aos-delay="2550"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2550"].aos-animate {
  transition-delay: 2550ms;
}
body[data-aos-duration="2600"] [data-aos], [data-aos][data-aos][data-aos-duration="2600"] {
  transition-duration: 2600ms;
}
body[data-aos-delay="2600"] [data-aos], [data-aos][data-aos][data-aos-delay="2600"] {
  transition-delay: 0;
}
body[data-aos-delay="2600"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2600"].aos-animate {
  transition-delay: 2600ms;
}
body[data-aos-duration="2650"] [data-aos], [data-aos][data-aos][data-aos-duration="2650"] {
  transition-duration: 2650ms;
}
body[data-aos-delay="2650"] [data-aos], [data-aos][data-aos][data-aos-delay="2650"] {
  transition-delay: 0;
}
body[data-aos-delay="2650"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2650"].aos-animate {
  transition-delay: 2650ms;
}
body[data-aos-duration="2700"] [data-aos], [data-aos][data-aos][data-aos-duration="2700"] {
  transition-duration: 2700ms;
}
body[data-aos-delay="2700"] [data-aos], [data-aos][data-aos][data-aos-delay="2700"] {
  transition-delay: 0;
}
body[data-aos-delay="2700"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2700"].aos-animate {
  transition-delay: 2700ms;
}
body[data-aos-duration="2750"] [data-aos], [data-aos][data-aos][data-aos-duration="2750"] {
  transition-duration: 2750ms;
}
body[data-aos-delay="2750"] [data-aos], [data-aos][data-aos][data-aos-delay="2750"] {
  transition-delay: 0;
}
body[data-aos-delay="2750"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2750"].aos-animate {
  transition-delay: 2750ms;
}
body[data-aos-duration="2800"] [data-aos], [data-aos][data-aos][data-aos-duration="2800"] {
  transition-duration: 2800ms;
}
body[data-aos-delay="2800"] [data-aos], [data-aos][data-aos][data-aos-delay="2800"] {
  transition-delay: 0;
}
body[data-aos-delay="2800"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2800"].aos-animate {
  transition-delay: 2800ms;
}
body[data-aos-duration="2850"] [data-aos], [data-aos][data-aos][data-aos-duration="2850"] {
  transition-duration: 2850ms;
}
body[data-aos-delay="2850"] [data-aos], [data-aos][data-aos][data-aos-delay="2850"] {
  transition-delay: 0;
}
body[data-aos-delay="2850"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2850"].aos-animate {
  transition-delay: 2850ms;
}
body[data-aos-duration="2900"] [data-aos], [data-aos][data-aos][data-aos-duration="2900"] {
  transition-duration: 2900ms;
}
body[data-aos-delay="2900"] [data-aos], [data-aos][data-aos][data-aos-delay="2900"] {
  transition-delay: 0;
}
body[data-aos-delay="2900"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2900"].aos-animate {
  transition-delay: 2900ms;
}
body[data-aos-duration="2950"] [data-aos], [data-aos][data-aos][data-aos-duration="2950"] {
  transition-duration: 2950ms;
}
body[data-aos-delay="2950"] [data-aos], [data-aos][data-aos][data-aos-delay="2950"] {
  transition-delay: 0;
}
body[data-aos-delay="2950"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="2950"].aos-animate {
  transition-delay: 2950ms;
}
body[data-aos-duration="3000"] [data-aos], [data-aos][data-aos][data-aos-duration="3000"] {
  transition-duration: 3000ms;
}
body[data-aos-delay="3000"] [data-aos], [data-aos][data-aos][data-aos-delay="3000"] {
  transition-delay: 0;
}
body[data-aos-delay="3000"] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay="3000"].aos-animate {
  transition-delay: 3000ms;
}

body[data-aos-easing=linear] [data-aos], [data-aos][data-aos][data-aos-easing=linear] {
  transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
}
body[data-aos-easing=ease] [data-aos], [data-aos][data-aos][data-aos-easing=ease] {
  transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
}
body[data-aos-easing=ease-in] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in] {
  transition-timing-function: cubic-bezier(0.42, 0, 1, 1);
}
body[data-aos-easing=ease-out] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out] {
  transition-timing-function: cubic-bezier(0, 0, 0.58, 1);
}
body[data-aos-easing=ease-in-out] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out] {
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
}
body[data-aos-easing=ease-in-back] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-back] {
  transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
body[data-aos-easing=ease-out-back] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-back] {
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
body[data-aos-easing=ease-in-out-back] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-back] {
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
body[data-aos-easing=ease-in-sine] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-sine] {
  transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
}
body[data-aos-easing=ease-out-sine] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-sine] {
  transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
}
body[data-aos-easing=ease-in-out-sine] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-sine] {
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
body[data-aos-easing=ease-in-quad] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-quad] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
body[data-aos-easing=ease-out-quad] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-quad] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body[data-aos-easing=ease-in-out-quad] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-quad] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
body[data-aos-easing=ease-in-cubic] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-cubic] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
body[data-aos-easing=ease-out-cubic] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-cubic] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body[data-aos-easing=ease-in-out-cubic] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-cubic] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
body[data-aos-easing=ease-in-quart] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-quart] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
}
body[data-aos-easing=ease-out-quart] [data-aos], [data-aos][data-aos][data-aos-easing=ease-out-quart] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
body[data-aos-easing=ease-in-out-quart] [data-aos], [data-aos][data-aos][data-aos-easing=ease-in-out-quart] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

/**
 * Fade animations:
 * fade
 * fade-up, fade-down, fade-left, fade-right
 * fade-up-right, fade-up-left, fade-down-right, fade-down-left
 */
[data-aos^=fade][data-aos^=fade] {
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos^=fade][data-aos^=fade].aos-animate {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

[data-aos=fade-up] {
  transform: translate3d(0, 100px, 0);
}

[data-aos=fade-down] {
  transform: translate3d(0, -100px, 0);
}

[data-aos=fade-right] {
  transform: translate3d(-100px, 0, 0);
}

[data-aos=fade-left] {
  transform: translate3d(100px, 0, 0);
}

[data-aos=fade-up-right] {
  transform: translate3d(-100px, 100px, 0);
}

[data-aos=fade-up-left] {
  transform: translate3d(100px, 100px, 0);
}

[data-aos=fade-down-right] {
  transform: translate3d(-100px, -100px, 0);
}

[data-aos=fade-down-left] {
  transform: translate3d(100px, -100px, 0);
}

/**
 * Zoom animations:
 * zoom-in, zoom-in-up, zoom-in-down, zoom-in-left, zoom-in-right
 * zoom-out, zoom-out-up, zoom-out-down, zoom-out-left, zoom-out-right
 */
[data-aos^=zoom][data-aos^=zoom] {
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos^=zoom][data-aos^=zoom].aos-animate {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

[data-aos=zoom-in] {
  transform: scale(0.6);
}

[data-aos=zoom-in-up] {
  transform: translate3d(0, 100px, 0) scale(0.6);
}

[data-aos=zoom-in-down] {
  transform: translate3d(0, -100px, 0) scale(0.6);
}

[data-aos=zoom-in-right] {
  transform: translate3d(-100px, 0, 0) scale(0.6);
}

[data-aos=zoom-in-left] {
  transform: translate3d(100px, 0, 0) scale(0.6);
}

[data-aos=zoom-out] {
  transform: scale(1.2);
}

[data-aos=zoom-out-up] {
  transform: translate3d(0, 100px, 0) scale(1.2);
}

[data-aos=zoom-out-down] {
  transform: translate3d(0, -100px, 0) scale(1.2);
}

[data-aos=zoom-out-right] {
  transform: translate3d(-100px, 0, 0) scale(1.2);
}

[data-aos=zoom-out-left] {
  transform: translate3d(100px, 0, 0) scale(1.2);
}

/**
 * Slide animations
 */
[data-aos^=slide][data-aos^=slide] {
  transition-property: transform;
}
[data-aos^=slide][data-aos^=slide].aos-animate {
  transform: translate3d(0, 0, 0);
}

[data-aos=slide-up] {
  transform: translate3d(0, 100%, 0);
}

[data-aos=slide-down] {
  transform: translate3d(0, -100%, 0);
}

[data-aos=slide-right] {
  transform: translate3d(-100%, 0, 0);
}

[data-aos=slide-left] {
  transform: translate3d(100%, 0, 0);
}

/**
 * Flip animations:
 * flip-left, flip-right, flip-up, flip-down
 */
[data-aos^=flip][data-aos^=flip] {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transition-property: transform;
}

[data-aos=flip-left] {
  transform: perspective(2500px) rotateY(-100deg);
}
[data-aos=flip-left].aos-animate {
  transform: perspective(2500px) rotateY(0);
}

[data-aos=flip-right] {
  transform: perspective(2500px) rotateY(100deg);
}
[data-aos=flip-right].aos-animate {
  transform: perspective(2500px) rotateY(0);
}

[data-aos=flip-up] {
  transform: perspective(2500px) rotateX(-100deg);
}
[data-aos=flip-up].aos-animate {
  transform: perspective(2500px) rotateX(0);
}

[data-aos=flip-down] {
  transform: perspective(2500px) rotateX(100deg);
}
[data-aos=flip-down].aos-animate {
  transform: perspective(2500px) rotateX(0);
}

/*
 *  Owl Carousel - Core
 */
.owl-carousel {
  display: none;
  width: 100%;
  -webkit-tap-highlight-color: transparent;
  /* position relative and z-index fix webkit rendering fonts issue */
  position: relative;
  z-index: 1;
}
.owl-carousel .owl-stage {
  position: relative;
  touch-action: manipulation;
  -moz-backface-visibility: hidden;
  /* fix firefox animation glitch */
}
.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
  /* fix for flashing background */
  -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}
.owl-carousel .owl-item {
  position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}
.owl-carousel .owl-item img {
  display: block;
  width: 100%;
}
.owl-carousel .owl-nav.disabled,
.owl-carousel .owl-dots.disabled {
  display: none;
}
.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next,
.owl-carousel button.owl-dot {
  background: none;
  color: inherit;
  border: none;
  padding: 0 !important;
  font: inherit;
}
.owl-carousel.owl-loaded {
  display: block;
}
.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}
.owl-carousel.owl-hidden {
  opacity: 0;
}
.owl-carousel.owl-refresh .owl-item {
  visibility: hidden;
}
.owl-carousel.owl-drag .owl-item {
  touch-action: pan-y;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.owl-carousel.owl-grab {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}
.owl-carousel.owl-rtl {
  direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
  float: right;
}

/* No Js */
.no-js .owl-carousel {
  display: block;
}

/*
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
  -webkit-animation-duration: 3500ms;
          animation-duration: 3500ms;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
.owl-carousel .owl-animated-in {
  z-index: 0;
}
.owl-carousel .owl-animated-out {
  z-index: 1;
}
.owl-carousel .fadeOut {
  -webkit-animation-name: fadeOut;
          animation-name: fadeOut;
}
.owl-carousel .fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*
 * 	Owl Carousel - Auto Height Plugin
 */
.owl-height {
  transition: height 500ms ease-in-out;
}

/*
 * 	Owl Carousel - Lazy Load Plugin
 */
.owl-carousel .owl-item {
  /**
  	This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong
  	calculation of the height of the owl-item that breaks page layouts
   */
}
.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  transition: opacity 400ms ease;
}
.owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) {
  max-height: 0;
}
.owl-carousel .owl-item img.owl-lazy {
  transform-style: preserve-3d;
}

/*
 * 	Owl Carousel - Video Plugin
 */
.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000;
}
.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url("owl.video.play.png") no-repeat;
  cursor: pointer;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  transition: transform 100ms ease;
}
.owl-carousel .owl-video-play-icon:hover {
  transform: scale(1.3, 1.3);
}
.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
  display: none;
}
.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 400ms ease;
}
.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%;
}

/*! jQuery UI - v1.12.1 - 2020-10-22
* http://jqueryui.com
* Includes: core.css, datepicker.css, theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?scope=&folderName=base&cornerRadiusShadow=8px&offsetLeftShadow=0px&offsetTopShadow=0px&thicknessShadow=5px&opacityShadow=30&bgImgOpacityShadow=0&bgTextureShadow=flat&bgColorShadow=666666&opacityOverlay=30&bgImgOpacityOverlay=0&bgTextureOverlay=flat&bgColorOverlay=aaaaaa&iconColorError=cc0000&fcError=5f3f3f&borderColorError=f1a899&bgTextureError=flat&bgColorError=fddfdf&iconColorHighlight=777620&fcHighlight=777620&borderColorHighlight=dad55e&bgTextureHighlight=flat&bgColorHighlight=fffa90&iconColorActive=ffffff&fcActive=ffffff&borderColorActive=003eff&bgTextureActive=flat&bgColorActive=007fff&iconColorHover=555555&fcHover=2b2b2b&borderColorHover=cccccc&bgTextureHover=flat&bgColorHover=ededed&iconColorDefault=777777&fcDefault=454545&borderColorDefault=c5c5c5&bgTextureDefault=flat&bgColorDefault=f6f6f6&iconColorContent=444444&fcContent=333333&borderColorContent=dddddd&bgTextureContent=flat&bgColorContent=ffffff&iconColorHeader=444444&fcHeader=333333&borderColorHeader=dddddd&bgTextureHeader=flat&bgColorHeader=e9e9e9&cornerRadius=3px&fwDefault=normal&fsDefault=1em&ffDefault=Arial%2CHelvetica%2Csans-serif
* Copyright jQuery Foundation and other contributors; Licensed MIT */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
  display: none;
}

.ui-helper-hidden-accessible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.ui-helper-reset {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  line-height: 1.3;
  text-decoration: none;
  font-size: 100%;
  list-style: none;
}

.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
  content: "";
  display: table;
  border-collapse: collapse;
}

.ui-helper-clearfix:after {
  clear: both;
}

.ui-helper-zfix {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  opacity: 0;
  filter: Alpha(Opacity=0);
  /* support: IE8 */
}

.ui-front {
  z-index: 100;
}

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
  cursor: default !important;
  pointer-events: none;
}

/* Icons
----------------------------------*/
.ui-icon {
  display: inline-block;
  vertical-align: middle;
  margin-top: -0.25em;
  position: relative;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
}

.ui-widget-icon-block {
  left: 50%;
  margin-left: -8px;
  display: block;
}

/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.ui-datepicker {
  width: 17em;
  padding: 0.2em 0.2em 0;
  display: none;
}

.ui-datepicker .ui-datepicker-header {
  position: relative;
  padding: 0.2em 0;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  position: absolute;
  top: 2px;
  width: 1.8em;
  height: 1.8em;
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
  top: 1px;
}

.ui-datepicker .ui-datepicker-prev {
  left: 2px;
}

.ui-datepicker .ui-datepicker-next {
  right: 2px;
}

.ui-datepicker .ui-datepicker-prev-hover {
  left: 1px;
}

.ui-datepicker .ui-datepicker-next-hover {
  right: 1px;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  display: block;
  position: absolute;
  left: 50%;
  margin-left: -8px;
  top: 50%;
  margin-top: -8px;
}

.ui-datepicker .ui-datepicker-title {
  margin: 0 2.3em;
  line-height: 1.8em;
  text-align: center;
}

.ui-datepicker .ui-datepicker-title select {
  font-size: 1em;
  margin: 1px 0;
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: 45%;
}

.ui-datepicker table {
  width: 100%;
  font-size: 0.9em;
  border-collapse: collapse;
  margin: 0 0 0.4em;
}

.ui-datepicker th {
  padding: 0.7em 0.3em;
  text-align: center;
  font-weight: bold;
  border: 0;
}

.ui-datepicker td {
  border: 0;
  padding: 1px;
}

.ui-datepicker td span,
.ui-datepicker td a {
  display: block;
  padding: 0.2em;
  text-align: right;
  text-decoration: none;
}

.ui-datepicker .ui-datepicker-buttonpane {
  background-image: none;
  margin: 0.7em 0 0 0;
  padding: 0 0.2em;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}

.ui-datepicker .ui-datepicker-buttonpane button {
  float: right;
  margin: 0.5em 0.2em 0.4em;
  cursor: pointer;
  padding: 0.2em 0.6em 0.3em 0.6em;
  width: auto;
  overflow: visible;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
  float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
  width: auto;
}

.ui-datepicker-multi .ui-datepicker-group {
  float: left;
}

.ui-datepicker-multi .ui-datepicker-group table {
  width: 95%;
  margin: 0 auto 0.4em;
}

.ui-datepicker-multi-2 .ui-datepicker-group {
  width: 50%;
}

.ui-datepicker-multi-3 .ui-datepicker-group {
  width: 33.3%;
}

.ui-datepicker-multi-4 .ui-datepicker-group {
  width: 25%;
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
  border-left-width: 0;
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
  clear: left;
}

.ui-datepicker-row-break {
  clear: both;
  width: 100%;
  font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
  direction: rtl;
}

.ui-datepicker-rtl .ui-datepicker-prev {
  right: 2px;
  left: auto;
}

.ui-datepicker-rtl .ui-datepicker-next {
  left: 2px;
  right: auto;
}

.ui-datepicker-rtl .ui-datepicker-prev:hover {
  right: 1px;
  left: auto;
}

.ui-datepicker-rtl .ui-datepicker-next:hover {
  left: 1px;
  right: auto;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane {
  clear: right;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button {
  float: left;
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
  float: right;
}

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
  border-right-width: 0;
  border-left-width: 1px;
}

/* Icons */
.ui-datepicker .ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
  left: 0.5em;
  top: 0.3em;
}

/* Component containers
----------------------------------*/
.ui-widget {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.ui-widget .ui-widget {
  font-size: 1em;
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
}

.ui-widget.ui-widget-content {
  border: 1px solid #c5c5c5;
}

.ui-widget-content {
  border: 1px solid #dddddd;
  background: #ffffff;
  color: #333333;
}

.ui-widget-content a {
  color: #333333;
}

.ui-widget-header {
  border: 1px solid #dddddd;
  background: #e9e9e9;
  color: #333333;
  font-weight: bold;
}

.ui-widget-header a {
  color: #333333;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  border: 1px solid #c5c5c5;
  background: #f6f6f6;
  font-weight: normal;
  color: #454545;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
  color: #454545;
  text-decoration: none;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
  border: 1px solid #cccccc;
  background: #ededed;
  font-weight: normal;
  color: #2b2b2b;
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,
a.ui-button:hover,
a.ui-button:focus {
  color: #2b2b2b;
  text-decoration: none;
}

.ui-visual-focus {
  box-shadow: 0 0 3px 1px #5e9ed6;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  border: 1px solid #003eff;
  background: #007fff;
  font-weight: normal;
  color: #ffffff;
}

.ui-icon-background,
.ui-state-active .ui-icon-background {
  border: #003eff;
  background-color: #ffffff;
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
  color: #ffffff;
  text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border: 1px solid #dad55e;
  background: #fffa90;
  color: #777620;
}

.ui-state-checked {
  border: 1px solid #dad55e;
  background: #fffa90;
}

.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
  color: #777620;
}

.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
  border: 1px solid #f1a899;
  background: #fddfdf;
  color: #5f3f3f;
}

.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
  color: #5f3f3f;
}

.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
  color: #5f3f3f;
}

.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
  font-weight: bold;
}

.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
  opacity: 0.7;
  filter: Alpha(Opacity=70);
  /* support: IE8 */
  font-weight: normal;
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
  opacity: 0.35;
  filter: Alpha(Opacity=35);
  /* support: IE8 */
  background-image: none;
}

.ui-state-disabled .ui-icon {
  filter: Alpha(Opacity=35);
  /* support: IE8 - See #6059 */
}

/* Icons
----------------------------------*/
/* states and static/medias/jquery-ui */
.ui-icon {
  width: 16px;
  height: 16px;
}

.ui-icon,
.ui-widget-content .ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_444444_256x240.png");
}

.ui-widget-header .ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_444444_256x240.png");
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_555555_256x240.png");
}

.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_ffffff_256x240.png");
}

.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_777620_256x240.png");
}

.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_cc0000_256x240.png");
}

.ui-button .ui-icon {
  background-image: url("static/medias/jquery-ui/ui-icons_777777_256x240.png");
}

/* positioning */
.ui-icon-blank {
  background-position: 16px 16px;
}

.ui-icon-caret-1-n {
  background-position: 0 0;
}

.ui-icon-caret-1-ne {
  background-position: -16px 0;
}

.ui-icon-caret-1-e {
  background-position: -32px 0;
}

.ui-icon-caret-1-se {
  background-position: -48px 0;
}

.ui-icon-caret-1-s {
  background-position: -65px 0;
}

.ui-icon-caret-1-sw {
  background-position: -80px 0;
}

.ui-icon-caret-1-w {
  background-position: -96px 0;
}

.ui-icon-caret-1-nw {
  background-position: -112px 0;
}

.ui-icon-caret-2-n-s {
  background-position: -128px 0;
}

.ui-icon-caret-2-e-w {
  background-position: -144px 0;
}

.ui-icon-triangle-1-n {
  background-position: 0 -16px;
}

.ui-icon-triangle-1-ne {
  background-position: -16px -16px;
}

.ui-icon-triangle-1-e {
  background-position: -32px -16px;
}

.ui-icon-triangle-1-se {
  background-position: -48px -16px;
}

.ui-icon-triangle-1-s {
  background-position: -65px -16px;
}

.ui-icon-triangle-1-sw {
  background-position: -80px -16px;
}

.ui-icon-triangle-1-w {
  background-position: -96px -16px;
}

.ui-icon-triangle-1-nw {
  background-position: -112px -16px;
}

.ui-icon-triangle-2-n-s {
  background-position: -128px -16px;
}

.ui-icon-triangle-2-e-w {
  background-position: -144px -16px;
}

.ui-icon-arrow-1-n {
  background-position: 0 -32px;
}

.ui-icon-arrow-1-ne {
  background-position: -16px -32px;
}

.ui-icon-arrow-1-e {
  background-position: -32px -32px;
}

.ui-icon-arrow-1-se {
  background-position: -48px -32px;
}

.ui-icon-arrow-1-s {
  background-position: -65px -32px;
}

.ui-icon-arrow-1-sw {
  background-position: -80px -32px;
}

.ui-icon-arrow-1-w {
  background-position: -96px -32px;
}

.ui-icon-arrow-1-nw {
  background-position: -112px -32px;
}

.ui-icon-arrow-2-n-s {
  background-position: -128px -32px;
}

.ui-icon-arrow-2-ne-sw {
  background-position: -144px -32px;
}

.ui-icon-arrow-2-e-w {
  background-position: -160px -32px;
}

.ui-icon-arrow-2-se-nw {
  background-position: -176px -32px;
}

.ui-icon-arrowstop-1-n {
  background-position: -192px -32px;
}

.ui-icon-arrowstop-1-e {
  background-position: -208px -32px;
}

.ui-icon-arrowstop-1-s {
  background-position: -224px -32px;
}

.ui-icon-arrowstop-1-w {
  background-position: -240px -32px;
}

.ui-icon-arrowthick-1-n {
  background-position: 1px -48px;
}

.ui-icon-arrowthick-1-ne {
  background-position: -16px -48px;
}

.ui-icon-arrowthick-1-e {
  background-position: -32px -48px;
}

.ui-icon-arrowthick-1-se {
  background-position: -48px -48px;
}

.ui-icon-arrowthick-1-s {
  background-position: -64px -48px;
}

.ui-icon-arrowthick-1-sw {
  background-position: -80px -48px;
}

.ui-icon-arrowthick-1-w {
  background-position: -96px -48px;
}

.ui-icon-arrowthick-1-nw {
  background-position: -112px -48px;
}

.ui-icon-arrowthick-2-n-s {
  background-position: -128px -48px;
}

.ui-icon-arrowthick-2-ne-sw {
  background-position: -144px -48px;
}

.ui-icon-arrowthick-2-e-w {
  background-position: -160px -48px;
}

.ui-icon-arrowthick-2-se-nw {
  background-position: -176px -48px;
}

.ui-icon-arrowthickstop-1-n {
  background-position: -192px -48px;
}

.ui-icon-arrowthickstop-1-e {
  background-position: -208px -48px;
}

.ui-icon-arrowthickstop-1-s {
  background-position: -224px -48px;
}

.ui-icon-arrowthickstop-1-w {
  background-position: -240px -48px;
}

.ui-icon-arrowreturnthick-1-w {
  background-position: 0 -64px;
}

.ui-icon-arrowreturnthick-1-n {
  background-position: -16px -64px;
}

.ui-icon-arrowreturnthick-1-e {
  background-position: -32px -64px;
}

.ui-icon-arrowreturnthick-1-s {
  background-position: -48px -64px;
}

.ui-icon-arrowreturn-1-w {
  background-position: -64px -64px;
}

.ui-icon-arrowreturn-1-n {
  background-position: -80px -64px;
}

.ui-icon-arrowreturn-1-e {
  background-position: -96px -64px;
}

.ui-icon-arrowreturn-1-s {
  background-position: -112px -64px;
}

.ui-icon-arrowrefresh-1-w {
  background-position: -128px -64px;
}

.ui-icon-arrowrefresh-1-n {
  background-position: -144px -64px;
}

.ui-icon-arrowrefresh-1-e {
  background-position: -160px -64px;
}

.ui-icon-arrowrefresh-1-s {
  background-position: -176px -64px;
}

.ui-icon-arrow-4 {
  background-position: 0 -80px;
}

.ui-icon-arrow-4-diag {
  background-position: -16px -80px;
}

.ui-icon-extlink {
  background-position: -32px -80px;
}

.ui-icon-newwin {
  background-position: -48px -80px;
}

.ui-icon-refresh {
  background-position: -64px -80px;
}

.ui-icon-shuffle {
  background-position: -80px -80px;
}

.ui-icon-transfer-e-w {
  background-position: -96px -80px;
}

.ui-icon-transferthick-e-w {
  background-position: -112px -80px;
}

.ui-icon-folder-collapsed {
  background-position: 0 -96px;
}

.ui-icon-folder-open {
  background-position: -16px -96px;
}

.ui-icon-document {
  background-position: -32px -96px;
}

.ui-icon-document-b {
  background-position: -48px -96px;
}

.ui-icon-note {
  background-position: -64px -96px;
}

.ui-icon-mail-closed {
  background-position: -80px -96px;
}

.ui-icon-mail-open {
  background-position: -96px -96px;
}

.ui-icon-suitcase {
  background-position: -112px -96px;
}

.ui-icon-comment {
  background-position: -128px -96px;
}

.ui-icon-person {
  background-position: -144px -96px;
}

.ui-icon-print {
  background-position: -160px -96px;
}

.ui-icon-trash {
  background-position: -176px -96px;
}

.ui-icon-locked {
  background-position: -192px -96px;
}

.ui-icon-unlocked {
  background-position: -208px -96px;
}

.ui-icon-bookmark {
  background-position: -224px -96px;
}

.ui-icon-tag {
  background-position: -240px -96px;
}

.ui-icon-home {
  background-position: 0 -112px;
}

.ui-icon-flag {
  background-position: -16px -112px;
}

.ui-icon-calendar {
  background-position: -32px -112px;
}

.ui-icon-cart {
  background-position: -48px -112px;
}

.ui-icon-pencil {
  background-position: -64px -112px;
}

.ui-icon-clock {
  background-position: -80px -112px;
}

.ui-icon-disk {
  background-position: -96px -112px;
}

.ui-icon-calculator {
  background-position: -112px -112px;
}

.ui-icon-zoomin {
  background-position: -128px -112px;
}

.ui-icon-zoomout {
  background-position: -144px -112px;
}

.ui-icon-search {
  background-position: -160px -112px;
}

.ui-icon-wrench {
  background-position: -176px -112px;
}

.ui-icon-gear {
  background-position: -192px -112px;
}

.ui-icon-heart {
  background-position: -208px -112px;
}

.ui-icon-star {
  background-position: -224px -112px;
}

.ui-icon-link {
  background-position: -240px -112px;
}

.ui-icon-cancel {
  background-position: 0 -128px;
}

.ui-icon-plus {
  background-position: -16px -128px;
}

.ui-icon-plusthick {
  background-position: -32px -128px;
}

.ui-icon-minus {
  background-position: -48px -128px;
}

.ui-icon-minusthick {
  background-position: -64px -128px;
}

.ui-icon-close {
  background-position: -80px -128px;
}

.ui-icon-closethick {
  background-position: -96px -128px;
}

.ui-icon-key {
  background-position: -112px -128px;
}

.ui-icon-lightbulb {
  background-position: -128px -128px;
}

.ui-icon-scissors {
  background-position: -144px -128px;
}

.ui-icon-clipboard {
  background-position: -160px -128px;
}

.ui-icon-copy {
  background-position: -176px -128px;
}

.ui-icon-contact {
  background-position: -192px -128px;
}

.ui-icon-image {
  background-position: -208px -128px;
}

.ui-icon-video {
  background-position: -224px -128px;
}

.ui-icon-script {
  background-position: -240px -128px;
}

.ui-icon-alert {
  background-position: 0 -144px;
}

.ui-icon-info {
  background-position: -16px -144px;
}

.ui-icon-notice {
  background-position: -32px -144px;
}

.ui-icon-help {
  background-position: -48px -144px;
}

.ui-icon-check {
  background-position: -64px -144px;
}

.ui-icon-bullet {
  background-position: -80px -144px;
}

.ui-icon-radio-on {
  background-position: -96px -144px;
}

.ui-icon-radio-off {
  background-position: -112px -144px;
}

.ui-icon-pin-w {
  background-position: -128px -144px;
}

.ui-icon-pin-s {
  background-position: -144px -144px;
}

.ui-icon-play {
  background-position: 0 -160px;
}

.ui-icon-pause {
  background-position: -16px -160px;
}

.ui-icon-seek-next {
  background-position: -32px -160px;
}

.ui-icon-seek-prev {
  background-position: -48px -160px;
}

.ui-icon-seek-end {
  background-position: -64px -160px;
}

.ui-icon-seek-start {
  background-position: -80px -160px;
}

/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first {
  background-position: -80px -160px;
}

.ui-icon-stop {
  background-position: -96px -160px;
}

.ui-icon-eject {
  background-position: -112px -160px;
}

.ui-icon-volume-off {
  background-position: -128px -160px;
}

.ui-icon-volume-on {
  background-position: -144px -160px;
}

.ui-icon-power {
  background-position: 0 -176px;
}

.ui-icon-signal-diag {
  background-position: -16px -176px;
}

.ui-icon-signal {
  background-position: -32px -176px;
}

.ui-icon-battery-0 {
  background-position: -48px -176px;
}

.ui-icon-battery-1 {
  background-position: -64px -176px;
}

.ui-icon-battery-2 {
  background-position: -80px -176px;
}

.ui-icon-battery-3 {
  background-position: -96px -176px;
}

.ui-icon-circle-plus {
  background-position: 0 -192px;
}

.ui-icon-circle-minus {
  background-position: -16px -192px;
}

.ui-icon-circle-close {
  background-position: -32px -192px;
}

.ui-icon-circle-triangle-e {
  background-position: -48px -192px;
}

.ui-icon-circle-triangle-s {
  background-position: -64px -192px;
}

.ui-icon-circle-triangle-w {
  background-position: -80px -192px;
}

.ui-icon-circle-triangle-n {
  background-position: -96px -192px;
}

.ui-icon-circle-arrow-e {
  background-position: -112px -192px;
}

.ui-icon-circle-arrow-s {
  background-position: -128px -192px;
}

.ui-icon-circle-arrow-w {
  background-position: -144px -192px;
}

.ui-icon-circle-arrow-n {
  background-position: -160px -192px;
}

.ui-icon-circle-zoomin {
  background-position: -176px -192px;
}

.ui-icon-circle-zoomout {
  background-position: -192px -192px;
}

.ui-icon-circle-check {
  background-position: -208px -192px;
}

.ui-icon-circlesmall-plus {
  background-position: 0 -208px;
}

.ui-icon-circlesmall-minus {
  background-position: -16px -208px;
}

.ui-icon-circlesmall-close {
  background-position: -32px -208px;
}

.ui-icon-squaresmall-plus {
  background-position: -48px -208px;
}

.ui-icon-squaresmall-minus {
  background-position: -64px -208px;
}

.ui-icon-squaresmall-close {
  background-position: -80px -208px;
}

.ui-icon-grip-dotted-vertical {
  background-position: 0 -224px;
}

.ui-icon-grip-dotted-horizontal {
  background-position: -16px -224px;
}

.ui-icon-grip-solid-vertical {
  background-position: -32px -224px;
}

.ui-icon-grip-solid-horizontal {
  background-position: -48px -224px;
}

.ui-icon-gripsmall-diagonal-se {
  background-position: -64px -224px;
}

.ui-icon-grip-diagonal-se {
  background-position: -80px -224px;
}

/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
  border-top-left-radius: 3px;
}

.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
  border-top-right-radius: 3px;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
  border-bottom-left-radius: 3px;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
  border-bottom-right-radius: 3px;
}

/* Overlays */
.ui-widget-overlay {
  background: #aaaaaa;
  opacity: 0.3;
  filter: Alpha(Opacity=30);
  /* support: IE8 */
}

.ui-widget-shadow {
  box-shadow: 0px 0px 5px #666666;
}

/**
 * Calculate the luminance for a color.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
/**
 * Calculate the contrast ratio between two colors.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
/**
 * Determine whether to use dark or light text on top of given color.
 * Returns black for dark text and white for light text.
 */
/*Should not be used prefer css vars to get spacer and gutter*/
:root {
  --theme-default: default;
  --spacer-default: 32px;
  --gutter-default: 32px;
  --col-default: 12;
  --row-default: 12;
  --text-font-default: var(--font-primary);
  --text-color-default: #313131;
  --text-color-dark-default: rgb(var(--color-primary-contrast-500));
  --headings-font-default: var(--font-primary);
  --headings-color-default: #313131;
  --headings-color-dark-default: rgb(var(--color-secondary-contrast-500));
  --bg-dark-default: #313131;
  --bg-light-default: #ffffff;
  --max-xs: 1200px;
  --min-xs: 0px;
  --spacer-xs: 28px;
  --gutter-xs: 28px;
  --mobile-xs: true;
  --orientation-xs-l: landscape;
  --breakpoint-xs-l: xs;
  --spacer-xs-l: 28px;
  --gutter-xs-l: 28px;
  --mobile-xs-l: true;
  --max-sm: 1200px;
  --min-sm: 768px;
  --spacer-sm: 28px;
  --gutter-sm: 28px;
  --mobile-sm: true;
  --orientation-sm-l: landscape;
  --breakpoint-sm-l: sm;
  --spacer-sm-l: 24px;
  --gutter-sm-l: 24px;
  --mobile-sm-l: true;
  --max-md: 10000px;
  --min-md: 1201px;
  --spacer-md: 28px;
  --gutter-md: 28px;
  --mobile-md: false;
  --max-lg: 10000px;
  --min-lg: 1441px;
  --spacer-lg: 32px;
  --gutter-lg: 32px;
  --mobile-lg: false;
  --max-xl: 10000px;
  --min-xl: 1921px;
  --spacer-xl: 36px;
  --gutter-xl: 36px;
  --mobile-xl: false;
  --font-primary: 'sofia-pro', sans-serif;
  --font-secondary: 'Roboto', Arial, sans-serif;
  --color-primary-900: 0, 0, 0;
  --color-primary-contrast-900: 255, 255, 255;
  --color-primary-800: 0, 0, 0;
  --color-primary-contrast-800: 255, 255, 255;
  --color-primary-700: 0, 0, 0;
  --color-primary-contrast-700: 255, 255, 255;
  --color-primary-600: 2, 40, 13;
  --color-primary-contrast-600: 255, 255, 255;
  --color-primary-500: 3, 79, 26;
  --color-primary-contrast-500: 255, 255, 255;
  --color-primary-400: 4, 118, 39;
  --color-primary-contrast-400: 255, 255, 255;
  --color-primary-300: 6, 158, 52;
  --color-primary-contrast-300: 49, 49, 49;
  --color-primary-200: 7, 197, 65;
  --color-primary-contrast-200: 49, 49, 49;
  --color-primary-100: 9, 236, 78;
  --color-primary-contrast-100: 49, 49, 49;
  --color-secondary-900: 133, 102, 2;
  --color-secondary-contrast-900: 255, 255, 255;
  --color-secondary-800: 173, 133, 2;
  --color-secondary-contrast-800: 49, 49, 49;
  --color-secondary-700: 213, 163, 3;
  --color-secondary-contrast-700: 49, 49, 49;
  --color-secondary-600: 251, 193, 6;
  --color-secondary-contrast-600: 49, 49, 49;
  --color-secondary-500: 252, 203, 46;
  --color-secondary-contrast-500: 49, 49, 49;
  --color-secondary-400: 253, 213, 86;
  --color-secondary-contrast-400: 49, 49, 49;
  --color-secondary-300: 253, 223, 126;
  --color-secondary-contrast-300: 49, 49, 49;
  --color-secondary-200: 254, 233, 167;
  --color-secondary-contrast-200: 49, 49, 49;
  --color-secondary-100: 254, 243, 207;
  --color-secondary-contrast-100: 49, 49, 49;
}

@media (min-width: 0px) and (max-width: 1200px) {
  :root {
    --max-current: 1200px;
    --min-current: 0px;
    --spacer-current: 28px;
    --gutter-current: 28px;
    --mobile-current: true;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  :root {
    --orientation-current: landscape;
    --breakpoint-current: xs;
    --spacer-current: 28px;
    --gutter-current: 28px;
    --mobile-current: true;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  :root {
    --max-current: 1200px;
    --min-current: 768px;
    --spacer-current: 28px;
    --gutter-current: 28px;
    --mobile-current: true;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  :root {
    --orientation-current: landscape;
    --breakpoint-current: sm;
    --spacer-current: 24px;
    --gutter-current: 24px;
    --mobile-current: true;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  :root {
    --max-current: 10000px;
    --min-current: 1201px;
    --spacer-current: 28px;
    --gutter-current: 28px;
    --mobile-current: false;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  :root {
    --max-current: 10000px;
    --min-current: 1441px;
    --spacer-current: 32px;
    --gutter-current: 32px;
    --mobile-current: false;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  :root {
    --max-current: 10000px;
    --min-current: 1921px;
    --spacer-current: 36px;
    --gutter-current: 36px;
    --mobile-current: false;
  }
}
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,
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, menu, nav, section {
  display: block;
}

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;
}

button {
  border: none;
  margin: 0;
  padding: 0;
  width: auto;
  overflow: visible;
  background: transparent;
  outline: none;
  /* inherit font & color from ancestor */
  color: inherit;
  font: inherit;
  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
  line-height: normal;
  /* Corrects font smoothing for webkit */
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
  /* Corrects inability to style clickable `input` types in iOS */
  -webkit-appearance: none;
}

*, *:after, *:before {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html {
  overflow-x: hidden;
  min-height: 100%;
  font-size: 100%;
  margin: 0;
}
@media (min-width: 0px) and (max-width: 1200px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  html {
    font-size: 100%;
    margin: 0;
  }
}

body {
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--text-font-default);
  line-height: 1.5;
  font-weight: 400;
  font-size: 16px;
  min-width: 280px;
  overflow-x: hidden;
  min-height: 100vh;
  color: #313131;
  color: var(--text-color-default);
  background-color: #ffffff;
  background-color: var(--bg-light-default);
  -webkit-tap-highlight-color: transparent;
  font-size: 16px;
  padding-top: calc(32px * 2);
  padding-top: calc(var(--spacer-default) * 2);
}
body.dark-theme {
  background-color: #313131;
  background-color: var(--bg-dark-default);
  color: rgb(255, 255, 255);
  color: var(--text-color-dark-default);
}
@media (min-width: 0px) and (max-width: 1200px) {
  body {
    font-size: 14.4px;
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 12.8px;
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body {
    font-size: 14.4px;
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body {
    font-size: 13.6px;
    padding-top: calc(24px * 2);
    padding-top: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body {
    font-size: 14.4px;
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body {
    font-size: 16px;
    padding-top: calc(32px * 2);
    padding-top: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body {
    font-size: 17.6px;
    padding-top: calc(36px * 2);
    padding-top: calc(var(--spacer-xl) * 2);
    max-width: 2560px;
    position: relative;
    margin: 0 auto;
  }
}
body.beforeunload {
  background-color: #313131;
  background-color: var(--bg-dark-default);
}
body.beforeunload > *:not(#main-header) {
  opacity: 0;
  border-color: transparent;
  background-color: transparent;
  transition: all 0.66s ease;
}
body.beforeunload > *:not(#main-header) * {
  opacity: 0;
  transition: all 0.66s ease;
}
body.beforeunload:after {
  content: "";
  background: url("/site-content/themes/theme-zambla/static/medias/donut.svg") center center no-repeat;
  background-size: contain;
  position: fixed;
  top: calc(50% - calc(36px * 1));
  top: calc(50% - calc(var(--spacer-xl) * 1));
  left: calc(50% - calc(36px * 1));
  left: calc(50% - calc(var(--spacer-xl) * 1));
  -webkit-animation: heart 0.666s infinite alternate;
          animation: heart 0.666s infinite alternate;
  width: calc(32px * 2);
  width: calc(var(--spacer-default) * 2);
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  body.beforeunload:after {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.beforeunload:after {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body.beforeunload:after {
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.beforeunload:after {
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body.beforeunload:after {
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body.beforeunload:after {
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body.beforeunload:after {
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
  }
}

body.dark-theme .dark {
  display: block;
}
body.dark-theme .light {
  display: none;
}

body.light-theme .dark {
  display: none;
}
body.light-theme .light {
  display: block;
}

@-webkit-keyframes heart {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.5);
  }
}

@keyframes heart {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.5);
  }
}
a {
  color: rgba(3, 79, 26, 1);
  color: rgba(var(--color-primary-500), 1);
  text-decoration: underline;
  transition: all 0.666s ease;
}
a:hover {
  color: rgba(3, 79, 26, 1);
  color: rgba(var(--color-primary-500), 1);
  transition: all 0.666s ease;
}

p {
  margin-bottom: calc(32px * 0.75);
  margin-bottom: calc(var(--spacer-default) * 0.75);
}
@media (min-width: 0px) and (max-width: 1200px) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-xs) * 0.75);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-xs-l) * 0.75);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-sm) * 0.75);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  p {
    margin-bottom: calc(24px * 0.75);
    margin-bottom: calc(var(--spacer-sm-l) * 0.75);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  p {
    margin-bottom: calc(28px * 0.75);
    margin-bottom: calc(var(--spacer-md) * 0.75);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  p {
    margin-bottom: calc(32px * 0.75);
    margin-bottom: calc(var(--spacer-lg) * 0.75);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  p {
    margin-bottom: calc(36px * 0.75);
    margin-bottom: calc(var(--spacer-xl) * 0.75);
  }
}

/*HEADINGS FONTS*/
h1, .h1, [default~=h1],
h2, .h2, [default~=h2],
h3, .h3, [default~=h3],
h4, .h4, [default~=h4],
h5, .h5, [default~=h5] {
  margin-bottom: calc(32px * 0.5);
  margin-bottom: calc(var(--spacer-default) * 0.5);
  color: #313131;
  color: var(--headings-color-default);
}
body.dark-theme h1, body.dark-theme .h1, body.dark-theme [default~=h1],
body.dark-theme h2, body.dark-theme .h2, body.dark-theme [default~=h2],
body.dark-theme h3, body.dark-theme .h3, body.dark-theme [default~=h3],
body.dark-theme h4, body.dark-theme .h4, body.dark-theme [default~=h4],
body.dark-theme h5, body.dark-theme .h5, body.dark-theme [default~=h5] {
  color: rgb(49, 49, 49);
  color: var(--headings-color-dark-default);
}

h1, .h1, [default~=h1] {
  font-size: 3rem;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--headings-font-default);
  line-height: 1.4;
  font-weight: 600;
}

h2, .h2, [default~=h2] {
  letter-spacing: 0.005em;
  font-size: 2.5rem;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--headings-font-default);
  line-height: 1.4;
  font-weight: 600;
}

h3, .h3, [default~=h3] {
  font-size: 2rem;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--headings-font-default);
  line-height: 1.4;
  font-weight: 600;
}

h4, .h4, [default~=h4] {
  font-size: 1.6rem;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--headings-font-default);
  line-height: 1.4;
  font-weight: 400;
}

h5, .h5, [default~=h5] {
  font-size: 1.4rem;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--headings-font-default);
  line-height: 1.4;
  font-weight: 400;
}

@media (min-width: 0px) and (max-width: 1200px) {
  h1, .h1, [xs~=h1],
h2, .h2, [xs~=h2],
h3, .h3, [xs~=h3],
h4, .h4, [xs~=h4],
h5, .h5, [xs~=h5] {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-xs) * 0.5);
  }

  h1, .h1, [xs~=h1] {
    font-size: 2.25rem;
  }

  h2, .h2, [xs~=h2] {
    letter-spacing: 0.005em;
    font-size: 1.875rem;
  }

  h3, .h3, [xs~=h3] {
    font-size: 1.5rem;
  }

  h4, .h4, [xs~=h4] {
    font-size: 1.2rem;
  }

  h5, .h5, [xs~=h5] {
    font-size: 1.05rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  h1, .h1, [xs-l~=h1],
h2, .h2, [xs-l~=h2],
h3, .h3, [xs-l~=h3],
h4, .h4, [xs-l~=h4],
h5, .h5, [xs-l~=h5] {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-xs-l) * 0.5);
  }

  h1, .h1, [xs-l~=h1] {
    font-size: 2.1rem;
  }

  h2, .h2, [xs-l~=h2] {
    letter-spacing: 0.005em;
    font-size: 1.75rem;
  }

  h3, .h3, [xs-l~=h3] {
    font-size: 1.4rem;
  }

  h4, .h4, [xs-l~=h4] {
    font-size: 1.12rem;
  }

  h5, .h5, [xs-l~=h5] {
    font-size: 0.98rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  h1, .h1, [sm~=h1],
h2, .h2, [sm~=h2],
h3, .h3, [sm~=h3],
h4, .h4, [sm~=h4],
h5, .h5, [sm~=h5] {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-sm) * 0.5);
  }

  h1, .h1, [sm~=h1] {
    font-size: 2.4rem;
  }

  h2, .h2, [sm~=h2] {
    letter-spacing: 0.005em;
    font-size: 2rem;
  }

  h3, .h3, [sm~=h3] {
    font-size: 1.6rem;
  }

  h4, .h4, [sm~=h4] {
    font-size: 1.28rem;
  }

  h5, .h5, [sm~=h5] {
    font-size: 1.12rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  h1, .h1, [sm-l~=h1],
h2, .h2, [sm-l~=h2],
h3, .h3, [sm-l~=h3],
h4, .h4, [sm-l~=h4],
h5, .h5, [sm-l~=h5] {
    margin-bottom: calc(24px * 0.5);
    margin-bottom: calc(var(--spacer-sm-l) * 0.5);
  }

  h1, .h1, [sm-l~=h1] {
    font-size: 2.25rem;
  }

  h2, .h2, [sm-l~=h2] {
    letter-spacing: 0.005em;
    font-size: 1.875rem;
  }

  h3, .h3, [sm-l~=h3] {
    font-size: 1.5rem;
  }

  h4, .h4, [sm-l~=h4] {
    font-size: 1.2rem;
  }

  h5, .h5, [sm-l~=h5] {
    font-size: 1.05rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  h1, .h1, [md~=h1],
h2, .h2, [md~=h2],
h3, .h3, [md~=h3],
h4, .h4, [md~=h4],
h5, .h5, [md~=h5] {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-md) * 0.5);
  }

  h1, .h1, [md~=h1] {
    font-size: 2.55rem;
  }

  h2, .h2, [md~=h2] {
    letter-spacing: 0.005em;
    font-size: 2.125rem;
  }

  h3, .h3, [md~=h3] {
    font-size: 1.7rem;
  }

  h4, .h4, [md~=h4] {
    font-size: 1.36rem;
  }

  h5, .h5, [md~=h5] {
    font-size: 1.19rem;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  h1, .h1, [lg~=h1],
h2, .h2, [lg~=h2],
h3, .h3, [lg~=h3],
h4, .h4, [lg~=h4],
h5, .h5, [lg~=h5] {
    margin-bottom: calc(32px * 0.5);
    margin-bottom: calc(var(--spacer-lg) * 0.5);
  }

  h1, .h1, [lg~=h1] {
    font-size: 2.7rem;
  }

  h2, .h2, [lg~=h2] {
    letter-spacing: 0.005em;
    font-size: 2.25rem;
  }

  h3, .h3, [lg~=h3] {
    font-size: 1.8rem;
  }

  h4, .h4, [lg~=h4] {
    font-size: 1.44rem;
  }

  h5, .h5, [lg~=h5] {
    font-size: 1.26rem;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  h1, .h1, [xl~=h1],
h2, .h2, [xl~=h2],
h3, .h3, [xl~=h3],
h4, .h4, [xl~=h4],
h5, .h5, [xl~=h5] {
    margin-bottom: calc(36px * 0.5);
    margin-bottom: calc(var(--spacer-xl) * 0.5);
  }

  h1, .h1, [xl~=h1] {
    font-size: 3rem;
  }

  h2, .h2, [xl~=h2] {
    letter-spacing: 0.005em;
    font-size: 2.5rem;
  }

  h3, .h3, [xl~=h3] {
    font-size: 2rem;
  }

  h4, .h4, [xl~=h4] {
    font-size: 1.6rem;
  }

  h5, .h5, [xl~=h5] {
    font-size: 1.4rem;
  }
}
/* Mixins */
.preload * {
  transition: none !important;
}

hr {
  display: block;
  border: 0px none;
  outline: none;
  height: 1px;
  width: 100%;
  background: rgba(var(--color-lgray-500), 1);
  margin: calc(32px * 0.5);
  margin: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  hr {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  hr {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  hr {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  hr {
    margin: calc(24px * 0.5);
    margin: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  hr {
    margin: calc(28px * 0.5);
    margin: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  hr {
    margin: calc(32px * 0.5);
    margin: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  hr {
    margin: calc(36px * 0.5);
    margin: calc(var(--spacer-xl) * 0.5);
  }
}

.btn, button, input[type=submit], input[type=button] {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  outline: none;
  background: rgba(252, 203, 46, 1);
  background: rgba(var(--color-secondary-500), 1);
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
  border: 2px solid transparent;
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--text-font-default);
  font-size: 1em;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  border-radius: calc(32px * 0.25);
  border-radius: calc(var(--spacer-default) * 0.25);
  padding: calc(32px * 0.333) calc(32px * 0.666);
  padding: calc(var(--spacer-default) * 0.333) calc(var(--spacer-default) * 0.666);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs) * 0.25);
    padding: calc(28px * 0.333) calc(28px * 0.666);
    padding: calc(var(--spacer-xs) * 0.333) calc(var(--spacer-xs) * 0.666);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs-l) * 0.25);
    padding: calc(28px * 0.333) calc(28px * 0.666);
    padding: calc(var(--spacer-xs-l) * 0.333) calc(var(--spacer-xs-l) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-sm) * 0.25);
    padding: calc(28px * 0.333) calc(28px * 0.666);
    padding: calc(var(--spacer-sm) * 0.333) calc(var(--spacer-sm) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    border-radius: calc(24px * 0.25);
    border-radius: calc(var(--spacer-sm-l) * 0.25);
    padding: calc(24px * 0.333) calc(24px * 0.666);
    padding: calc(var(--spacer-sm-l) * 0.333) calc(var(--spacer-sm-l) * 0.666);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-md) * 0.25);
    padding: calc(28px * 0.333) calc(28px * 0.666);
    padding: calc(var(--spacer-md) * 0.333) calc(var(--spacer-md) * 0.666);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    border-radius: calc(32px * 0.25);
    border-radius: calc(var(--spacer-lg) * 0.25);
    padding: calc(32px * 0.333) calc(32px * 0.666);
    padding: calc(var(--spacer-lg) * 0.333) calc(var(--spacer-lg) * 0.666);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .btn, button, input[type=submit], input[type=button] {
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    border-radius: calc(36px * 0.25);
    border-radius: calc(var(--spacer-xl) * 0.25);
    padding: calc(36px * 0.333) calc(36px * 0.666);
    padding: calc(var(--spacer-xl) * 0.333) calc(var(--spacer-xl) * 0.666);
  }
}
.btn > *:before, .btn:after, button > *:before, button:after, input[type=submit] > *:before, input[type=submit]:after, input[type=button] > *:before, input[type=button]:after {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}
.btn:hover, button:hover, input[type=submit]:hover, input[type=button]:hover {
  background-color: #ffffff;
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
  border-color: 2px solid rgba(252, 203, 46, 1);
  border-color: 2px solid rgba(var(--color-secondary-500), 1);
}
.btn:disabled, button:disabled, input[type=submit]:disabled, input[type=button]:disabled {
  pointer-events: none;
}
.btn:disabled:after, button:disabled:after, input[type=submit]:disabled:after, input[type=button]:disabled:after {
  background: rgba(var(--color-lgray-500), 1);
}

.btn.btn-border-reverse {
  border: 3px solid #ffffff !important;
  color: #ffffff !important;
  background: transaprent !important;
}
.btn.btn-border-reverse:hover {
  border: 3px solid rgba(2, 40, 13, 1) !important;
  border: 3px solid rgba(var(--color-primary-600), 1) !important;
  background-color: rgba(2, 40, 13, 1);
  background-color: rgba(var(--color-primary-600), 1);
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}

.btn.btn-reverse {
  color: rgba(3, 79, 26, 1) !important;
  color: rgba(var(--color-primary-500), 1) !important;
  background: #ffffff !important;
}
.btn.btn-reverse:hover {
  color: rgb(255, 255, 255) !important;
  color: rgb(var(--color-primary-contrast-600)) !important;
  background: rgba(2, 40, 13, 1) !important;
  background: rgba(var(--color-primary-600), 1) !important;
}

[class*=container] {
  margin: 0 auto;
  max-width: 1440px;
}

.container, :root [default=container] {
  width: 87.5%;
}

.container-xs, :root [default*=container-xs] {
  width: 60%;
}

.container-xl, :root [default*=container-xl] {
  width: 80%;
}

@media (min-width: 0px) and (max-width: 1200px) {
  .container, :root [xs=container] {
    width: 87.5%;
  }

  .container-xs, :root [xs*=container-xs] {
    width: 85%;
  }

  .container-xl, :root [xs*=container-xl] {
    width: 90%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .container, :root [xs-l=container] {
    width: 87.5%;
  }

  .container-xs, :root [xs-l*=container-xs] {
    width: 85%;
  }

  .container-xl, :root [xs-l*=container-xl] {
    width: 90%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .container, :root [sm=container] {
    width: 85%;
  }

  .container-xs, :root [sm*=container-xs] {
    width: 85%;
  }

  .container-xl, :root [sm*=container-xl] {
    width: 90%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .container, :root [sm-l=container] {
    width: 85%;
  }

  .container-xs, :root [sm-l*=container-xs] {
    width: 85%;
  }

  .container-xl, :root [sm-l*=container-xl] {
    width: 90%;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .container, :root [md=container] {
    width: 90%;
  }

  .container-xs, :root [md*=container-xs] {
    width: 66%;
  }

  .container-xl, :root [md*=container-xl] {
    width: 90%;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .container, :root [lg=container] {
    width: 80%;
  }

  .container-xs, :root [lg*=container-xs] {
    width: 55%;
  }

  .container-xl, :root [lg*=container-xl] {
    width: 87.5%;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .container, :root [xl=container] {
    width: 70%;
  }

  .container-xs, :root [xl*=container-xs] {
    width: 50%;
  }

  .container-xl, :root [xl*=container-xl] {
    width: 85%;
  }
}
.container-left {
  margin-left: 0;
  margin-right: auto;
}

.container-right {
  margin-left: auto;
  margin-right: 0;
}

.container-left,
.container-right {
  width: calc(100% - 6.25%);
  max-width: calc(1440px + ((100vw - 1440px) / 2));
}
@media (min-width: 0px) and (max-width: 1200px) {
  .container-left,
.container-right {
    width: calc(100% - 6.25%);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .container-left,
.container-right {
    width: calc(100% - 6.25%);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .container-left,
.container-right {
    width: calc(100% - 7.5%);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .container-left,
.container-right {
    width: calc(100% - 7.5%);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .container-left,
.container-right {
    width: calc(100% - 5%);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .container-left,
.container-right {
    width: calc(100% - 10%);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .container-left,
.container-right {
    width: calc(100% - 15%);
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  .container-left,
.container-right {
    width: calc(100% - 12.5%);
    margin-left: auto;
    margin-right: auto;
  }
}
input[type=text], input[type=email], input[type=password] {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  background: transparent;
  width: 100%;
  outline: none;
  border: 2px solid rgba(3, 79, 26, 1);
  border: 2px solid rgba(var(--color-primary-500), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  border-radius: calc(32px * 0.25);
  border-radius: calc(var(--spacer-default) * 0.25);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: calc(32px * 0.25) calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.25) calc(var(--spacer-default) * 0.5);
  height: calc(32px * 1.5);
  height: calc(var(--spacer-default) * 1.5);
}
input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}
input[type=text]:-ms-input-placeholder, input[type=email]:-ms-input-placeholder, input[type=password]:-ms-input-placeholder {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}
input[type=text]::placeholder, input[type=email]::placeholder, input[type=password]::placeholder {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.25) calc(var(--spacer-xs) * 0.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs) * 1.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs-l) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.25) calc(var(--spacer-xs-l) * 0.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs-l) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-sm) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.25) calc(var(--spacer-sm) * 0.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-sm) * 1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(24px * 0.25);
    border-radius: calc(var(--spacer-sm-l) * 0.25);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: calc(24px * 0.25) calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.25) calc(var(--spacer-sm-l) * 0.5);
    height: calc(24px * 1.5);
    height: calc(var(--spacer-sm-l) * 1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-md) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.25) calc(var(--spacer-md) * 0.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-md) * 1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(32px * 0.25);
    border-radius: calc(var(--spacer-lg) * 0.25);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: calc(32px * 0.25) calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.25) calc(var(--spacer-lg) * 0.5);
    height: calc(32px * 1.5);
    height: calc(var(--spacer-lg) * 1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  input[type=text], input[type=email], input[type=password] {
    border-radius: calc(36px * 0.25);
    border-radius: calc(var(--spacer-xl) * 0.25);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: calc(36px * 0.25) calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.25) calc(var(--spacer-xl) * 0.5);
    height: calc(36px * 1.5);
    height: calc(var(--spacer-xl) * 1.5);
  }
}
input[type=text].required, input[type=email].required, input[type=password].required {
  border: 2px solid rgba(var(--color-accent-500), 1);
}
input[type=text].required::-moz-placeholder, input[type=email].required::-moz-placeholder, input[type=password].required::-moz-placeholder {
  color: rgba(var(--color-accent-500), 1);
}
input[type=text].required:-ms-input-placeholder, input[type=email].required:-ms-input-placeholder, input[type=password].required:-ms-input-placeholder {
  color: rgba(var(--color-accent-500), 1);
}
input[type=text].required::placeholder, input[type=email].required::placeholder, input[type=password].required::placeholder {
  color: rgba(var(--color-accent-500), 1);
}
input[type=text]:not(:-moz-placeholder-shown), input[type=email]:not(:-moz-placeholder-shown), input[type=password]:not(:-moz-placeholder-shown) {
  border: 2px solid rgba(7, 197, 65, 1);
  border: 2px solid rgba(var(--color-primary-200), 1);
}
input[type=text]:not(:-ms-input-placeholder), input[type=email]:not(:-ms-input-placeholder), input[type=password]:not(:-ms-input-placeholder) {
  border: 2px solid rgba(7, 197, 65, 1);
  border: 2px solid rgba(var(--color-primary-200), 1);
}
input[type=text]:not(:placeholder-shown), input[type=email]:not(:placeholder-shown), input[type=password]:not(:placeholder-shown) {
  border: 2px solid rgba(7, 197, 65, 1);
  border: 2px solid rgba(var(--color-primary-200), 1);
}

select {
  width: 100%;
  max-width: 100%;
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
  width: 100%;
  outline: none;
  border: 2px solid rgba(3, 79, 26, 1);
  border: 2px solid rgba(var(--color-primary-500), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg fill='%23034F1A' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
  background-repeat: no-repeat;
  height: calc(32px * 1.5);
  height: calc(var(--spacer-default) * 1.5);
  border-radius: calc(32px * 0.25);
  border-radius: calc(var(--spacer-default) * 0.25);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: calc(32px * 0.25) calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.25) calc(var(--spacer-default) * 0.5);
  background-position-y: calc(32px * 0.25);
  background-position-y: calc(var(--spacer-default) * 0.25);
  background-position-x: calc(100% - calc(32px * 0.25));
  background-position-x: calc(100% - calc(var(--spacer-default) * 0.25));
}
@media (min-width: 0px) and (max-width: 1200px) {
  select {
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs) * 1.5);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.25) calc(var(--spacer-xs) * 0.5);
    background-position-y: calc(28px * 0.25);
    background-position-y: calc(var(--spacer-xs) * 0.25);
    background-position-x: calc(100% - calc(28px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-xs) * 0.25));
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  select {
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs-l) * 1.5);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs-l) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.25) calc(var(--spacer-xs-l) * 0.5);
    background-position-y: calc(28px * 0.25);
    background-position-y: calc(var(--spacer-xs-l) * 0.25);
    background-position-x: calc(100% - calc(28px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-xs-l) * 0.25));
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  select {
    height: calc(28px * 1.5);
    height: calc(var(--spacer-sm) * 1.5);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-sm) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.25) calc(var(--spacer-sm) * 0.5);
    background-position-y: calc(28px * 0.25);
    background-position-y: calc(var(--spacer-sm) * 0.25);
    background-position-x: calc(100% - calc(28px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-sm) * 0.25));
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  select {
    height: calc(24px * 1.5);
    height: calc(var(--spacer-sm-l) * 1.5);
    border-radius: calc(24px * 0.25);
    border-radius: calc(var(--spacer-sm-l) * 0.25);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: calc(24px * 0.25) calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.25) calc(var(--spacer-sm-l) * 0.5);
    background-position-y: calc(24px * 0.25);
    background-position-y: calc(var(--spacer-sm-l) * 0.25);
    background-position-x: calc(100% - calc(24px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-sm-l) * 0.25));
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  select {
    height: calc(28px * 1.5);
    height: calc(var(--spacer-md) * 1.5);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-md) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: calc(28px * 0.25) calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.25) calc(var(--spacer-md) * 0.5);
    background-position-y: calc(28px * 0.25);
    background-position-y: calc(var(--spacer-md) * 0.25);
    background-position-x: calc(100% - calc(28px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-md) * 0.25));
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  select {
    height: calc(32px * 1.5);
    height: calc(var(--spacer-lg) * 1.5);
    border-radius: calc(32px * 0.25);
    border-radius: calc(var(--spacer-lg) * 0.25);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: calc(32px * 0.25) calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.25) calc(var(--spacer-lg) * 0.5);
    background-position-y: calc(32px * 0.25);
    background-position-y: calc(var(--spacer-lg) * 0.25);
    background-position-x: calc(100% - calc(32px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-lg) * 0.25));
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  select {
    height: calc(36px * 1.5);
    height: calc(var(--spacer-xl) * 1.5);
    border-radius: calc(36px * 0.25);
    border-radius: calc(var(--spacer-xl) * 0.25);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: calc(36px * 0.25) calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.25) calc(var(--spacer-xl) * 0.5);
    background-position-y: calc(36px * 0.25);
    background-position-y: calc(var(--spacer-xl) * 0.25);
    background-position-x: calc(100% - calc(36px * 0.25));
    background-position-x: calc(100% - calc(var(--spacer-xl) * 0.25));
  }
}

textarea {
  width: 100%;
  max-width: 100%;
  color: rgba(var(--color-secondary-default), 1);
  width: 100%;
  outline: none;
  border: 2px solid rgba(3, 79, 26, 1);
  border: 2px solid rgba(var(--color-primary-500), 1);
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
  border-radius: calc(32px * 0.25);
  border-radius: calc(var(--spacer-default) * 0.25);
  margin: calc(32px * 0.25) 0;
  margin: calc(var(--spacer-default) * 0.25) 0;
  padding: calc(32px * 0.5);
  padding: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  textarea {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs) * 0.25) 0;
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  textarea {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs-l) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-xs-l) * 0.25) 0;
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  textarea {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-sm) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-sm) * 0.25) 0;
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  textarea {
    border-radius: calc(24px * 0.25);
    border-radius: calc(var(--spacer-sm-l) * 0.25);
    margin: calc(24px * 0.25) 0;
    margin: calc(var(--spacer-sm-l) * 0.25) 0;
    padding: calc(24px * 0.5);
    padding: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  textarea {
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-md) * 0.25);
    margin: calc(28px * 0.25) 0;
    margin: calc(var(--spacer-md) * 0.25) 0;
    padding: calc(28px * 0.5);
    padding: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  textarea {
    border-radius: calc(32px * 0.25);
    border-radius: calc(var(--spacer-lg) * 0.25);
    margin: calc(32px * 0.25) 0;
    margin: calc(var(--spacer-lg) * 0.25) 0;
    padding: calc(32px * 0.5);
    padding: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  textarea {
    border-radius: calc(36px * 0.25);
    border-radius: calc(var(--spacer-xl) * 0.25);
    margin: calc(36px * 0.25) 0;
    margin: calc(var(--spacer-xl) * 0.25) 0;
    padding: calc(36px * 0.5);
    padding: calc(var(--spacer-xl) * 0.5);
  }
}
textarea::-moz-placeholder {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}
textarea:-ms-input-placeholder {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}
textarea::placeholder {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}

.form-group {
  margin-bottom: calc(32px * 0.5);
  margin-bottom: calc(var(--spacer-default) * 0.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .form-group {
    margin-bottom: calc(24px * 0.5);
    margin-bottom: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .form-group {
    margin-bottom: calc(28px * 0.5);
    margin-bottom: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .form-group {
    margin-bottom: calc(32px * 0.5);
    margin-bottom: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .form-group {
    margin-bottom: calc(36px * 0.5);
    margin-bottom: calc(var(--spacer-xl) * 0.5);
  }
}

#error-notice {
  position: absolute;
  display: block;
}
#error-notice.hidden {
  display: none;
}

.bg-primary-100, .bg-hover-primary-100:hover {
  background-color: rgba(9, 236, 78, 1);
  background-color: rgba(var(--color-primary-100), 1);
}
.bg-primary-100:not([class*=color-]), .bg-hover-primary-100:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-100));
}
.bg-primary-100:not([class*=color-]) *, .bg-hover-primary-100:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-100));
}

.color-primary-100,
.color-hover-primary-100:hover,
.color-primary-100[class*=icon],
.color-primary-100[class*=icon]:before,
.headings-primary-100 h1, .headings-primary-100[class^=h1],
.headings-primary-100 h2, .headings-primary-100[class^=h2],
.headings-primary-100 h3, .headings-primary-100[class^=h3],
.headings-primary-100 h4, .headings-primary-100[class^=h4],
.headings-primary-100 h5, .headings-primary-100[class^=h5],
.links-primary-100 a,
.links-primary-100 a:visited,
.links-hover-primary-100 a:hover {
  color: rgba(9, 236, 78, 1);
  color: rgba(var(--color-primary-100), 1);
}

.border-primary-100,
.border-hover-primary-100:hover {
  border-color: rgba(9, 236, 78, 1);
  border-color: rgba(var(--color-primary-100), 1);
}

.bg-primary-contrast-100, .bg-hover-primary-contrast-100:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-primary-contrast-100));
}
.bg-primary-contrast-100:not([class*=color-]), .bg-hover-primary-contrast-100:hover:not([class*=color-]) {
  color: rgba(9, 236, 78, 1);
  color: rgba(var(--color-primary-100), 1);
}
.bg-primary-contrast-100:not([class*=color-]) *, .bg-hover-primary-contrast-100:hover:not([class*=color-]) * {
  color: rgba(9, 236, 78, 1);
  color: rgba(var(--color-primary-100), 1);
}

.color-primary-contrast-100,
.color-hover-primary-contrast-100:hover,
.color-primary-contrast-100[class*=icon],
.color-primary-contrast-100[class*=icon]:before,
.headings-primary-contrast-100 h1, .headings-primary-contrast-100[class^=h1],
.headings-primary-contrast-100 h2, .headings-primary-contrast-100[class^=h2],
.headings-primary-contrast-100 h3, .headings-primary-contrast-100[class^=h3],
.headings-primary-contrast-100 h4, .headings-primary-contrast-100[class^=h4],
.headings-primary-contrast-100 h5, .headings-primary-contrast-100[class^=h5],
.links-primary-contrast-100 a,
.links-primary-contrast-100 a:visited,
.links-hover-primary-contrast-100 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-100));
}

.border-primary-contrast-100,
.border-hover-primary-contrast-100:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-primary-contrast-100));
}

.bg-primary-200, .bg-hover-primary-200:hover {
  background-color: rgba(7, 197, 65, 1);
  background-color: rgba(var(--color-primary-200), 1);
}
.bg-primary-200:not([class*=color-]), .bg-hover-primary-200:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-200));
}
.bg-primary-200:not([class*=color-]) *, .bg-hover-primary-200:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-200));
}

.color-primary-200,
.color-hover-primary-200:hover,
.color-primary-200[class*=icon],
.color-primary-200[class*=icon]:before,
.headings-primary-200 h1, .headings-primary-200[class^=h1],
.headings-primary-200 h2, .headings-primary-200[class^=h2],
.headings-primary-200 h3, .headings-primary-200[class^=h3],
.headings-primary-200 h4, .headings-primary-200[class^=h4],
.headings-primary-200 h5, .headings-primary-200[class^=h5],
.links-primary-200 a,
.links-primary-200 a:visited,
.links-hover-primary-200 a:hover {
  color: rgba(7, 197, 65, 1);
  color: rgba(var(--color-primary-200), 1);
}

.border-primary-200,
.border-hover-primary-200:hover {
  border-color: rgba(7, 197, 65, 1);
  border-color: rgba(var(--color-primary-200), 1);
}

.bg-primary-contrast-200, .bg-hover-primary-contrast-200:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-primary-contrast-200));
}
.bg-primary-contrast-200:not([class*=color-]), .bg-hover-primary-contrast-200:hover:not([class*=color-]) {
  color: rgba(7, 197, 65, 1);
  color: rgba(var(--color-primary-200), 1);
}
.bg-primary-contrast-200:not([class*=color-]) *, .bg-hover-primary-contrast-200:hover:not([class*=color-]) * {
  color: rgba(7, 197, 65, 1);
  color: rgba(var(--color-primary-200), 1);
}

.color-primary-contrast-200,
.color-hover-primary-contrast-200:hover,
.color-primary-contrast-200[class*=icon],
.color-primary-contrast-200[class*=icon]:before,
.headings-primary-contrast-200 h1, .headings-primary-contrast-200[class^=h1],
.headings-primary-contrast-200 h2, .headings-primary-contrast-200[class^=h2],
.headings-primary-contrast-200 h3, .headings-primary-contrast-200[class^=h3],
.headings-primary-contrast-200 h4, .headings-primary-contrast-200[class^=h4],
.headings-primary-contrast-200 h5, .headings-primary-contrast-200[class^=h5],
.links-primary-contrast-200 a,
.links-primary-contrast-200 a:visited,
.links-hover-primary-contrast-200 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-200));
}

.border-primary-contrast-200,
.border-hover-primary-contrast-200:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-primary-contrast-200));
}

.bg-primary-300, .bg-hover-primary-300:hover {
  background-color: rgba(6, 158, 52, 1);
  background-color: rgba(var(--color-primary-300), 1);
}
.bg-primary-300:not([class*=color-]), .bg-hover-primary-300:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-300));
}
.bg-primary-300:not([class*=color-]) *, .bg-hover-primary-300:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-300));
}

.color-primary-300,
.color-hover-primary-300:hover,
.color-primary-300[class*=icon],
.color-primary-300[class*=icon]:before,
.headings-primary-300 h1, .headings-primary-300[class^=h1],
.headings-primary-300 h2, .headings-primary-300[class^=h2],
.headings-primary-300 h3, .headings-primary-300[class^=h3],
.headings-primary-300 h4, .headings-primary-300[class^=h4],
.headings-primary-300 h5, .headings-primary-300[class^=h5],
.links-primary-300 a,
.links-primary-300 a:visited,
.links-hover-primary-300 a:hover {
  color: rgba(6, 158, 52, 1);
  color: rgba(var(--color-primary-300), 1);
}

.border-primary-300,
.border-hover-primary-300:hover {
  border-color: rgba(6, 158, 52, 1);
  border-color: rgba(var(--color-primary-300), 1);
}

.bg-primary-contrast-300, .bg-hover-primary-contrast-300:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-primary-contrast-300));
}
.bg-primary-contrast-300:not([class*=color-]), .bg-hover-primary-contrast-300:hover:not([class*=color-]) {
  color: rgba(6, 158, 52, 1);
  color: rgba(var(--color-primary-300), 1);
}
.bg-primary-contrast-300:not([class*=color-]) *, .bg-hover-primary-contrast-300:hover:not([class*=color-]) * {
  color: rgba(6, 158, 52, 1);
  color: rgba(var(--color-primary-300), 1);
}

.color-primary-contrast-300,
.color-hover-primary-contrast-300:hover,
.color-primary-contrast-300[class*=icon],
.color-primary-contrast-300[class*=icon]:before,
.headings-primary-contrast-300 h1, .headings-primary-contrast-300[class^=h1],
.headings-primary-contrast-300 h2, .headings-primary-contrast-300[class^=h2],
.headings-primary-contrast-300 h3, .headings-primary-contrast-300[class^=h3],
.headings-primary-contrast-300 h4, .headings-primary-contrast-300[class^=h4],
.headings-primary-contrast-300 h5, .headings-primary-contrast-300[class^=h5],
.links-primary-contrast-300 a,
.links-primary-contrast-300 a:visited,
.links-hover-primary-contrast-300 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-primary-contrast-300));
}

.border-primary-contrast-300,
.border-hover-primary-contrast-300:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-primary-contrast-300));
}

.bg-primary-400, .bg-hover-primary-400:hover {
  background-color: rgba(4, 118, 39, 1);
  background-color: rgba(var(--color-primary-400), 1);
}
.bg-primary-400:not([class*=color-]), .bg-hover-primary-400:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-400));
}
.bg-primary-400:not([class*=color-]) *, .bg-hover-primary-400:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-400));
}

.color-primary-400,
.color-hover-primary-400:hover,
.color-primary-400[class*=icon],
.color-primary-400[class*=icon]:before,
.headings-primary-400 h1, .headings-primary-400[class^=h1],
.headings-primary-400 h2, .headings-primary-400[class^=h2],
.headings-primary-400 h3, .headings-primary-400[class^=h3],
.headings-primary-400 h4, .headings-primary-400[class^=h4],
.headings-primary-400 h5, .headings-primary-400[class^=h5],
.links-primary-400 a,
.links-primary-400 a:visited,
.links-hover-primary-400 a:hover {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}

.border-primary-400,
.border-hover-primary-400:hover {
  border-color: rgba(4, 118, 39, 1);
  border-color: rgba(var(--color-primary-400), 1);
}

.bg-primary-contrast-400, .bg-hover-primary-contrast-400:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-400));
}
.bg-primary-contrast-400:not([class*=color-]), .bg-hover-primary-contrast-400:hover:not([class*=color-]) {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}
.bg-primary-contrast-400:not([class*=color-]) *, .bg-hover-primary-contrast-400:hover:not([class*=color-]) * {
  color: rgba(4, 118, 39, 1);
  color: rgba(var(--color-primary-400), 1);
}

.color-primary-contrast-400,
.color-hover-primary-contrast-400:hover,
.color-primary-contrast-400[class*=icon],
.color-primary-contrast-400[class*=icon]:before,
.headings-primary-contrast-400 h1, .headings-primary-contrast-400[class^=h1],
.headings-primary-contrast-400 h2, .headings-primary-contrast-400[class^=h2],
.headings-primary-contrast-400 h3, .headings-primary-contrast-400[class^=h3],
.headings-primary-contrast-400 h4, .headings-primary-contrast-400[class^=h4],
.headings-primary-contrast-400 h5, .headings-primary-contrast-400[class^=h5],
.links-primary-contrast-400 a,
.links-primary-contrast-400 a:visited,
.links-hover-primary-contrast-400 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-400));
}

.border-primary-contrast-400,
.border-hover-primary-contrast-400:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-primary-contrast-400));
}

.bg-primary-500, .bg-hover-primary-500:hover {
  background-color: rgba(3, 79, 26, 1);
  background-color: rgba(var(--color-primary-500), 1);
}
.bg-primary-500:not([class*=color-]), .bg-hover-primary-500:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}
.bg-primary-500:not([class*=color-]) *, .bg-hover-primary-500:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}

.color-primary-500,
.color-hover-primary-500:hover,
.color-primary-500[class*=icon],
.color-primary-500[class*=icon]:before,
.headings-primary-500 h1, .headings-primary-500[class^=h1],
.headings-primary-500 h2, .headings-primary-500[class^=h2],
.headings-primary-500 h3, .headings-primary-500[class^=h3],
.headings-primary-500 h4, .headings-primary-500[class^=h4],
.headings-primary-500 h5, .headings-primary-500[class^=h5],
.links-primary-500 a,
.links-primary-500 a:visited,
.links-hover-primary-500 a:hover {
  color: rgba(3, 79, 26, 1);
  color: rgba(var(--color-primary-500), 1);
}

.border-primary-500,
.border-hover-primary-500:hover {
  border-color: rgba(3, 79, 26, 1);
  border-color: rgba(var(--color-primary-500), 1);
}

.bg-primary-contrast-500, .bg-hover-primary-contrast-500:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-500));
}
.bg-primary-contrast-500:not([class*=color-]), .bg-hover-primary-contrast-500:hover:not([class*=color-]) {
  color: rgba(3, 79, 26, 1);
  color: rgba(var(--color-primary-500), 1);
}
.bg-primary-contrast-500:not([class*=color-]) *, .bg-hover-primary-contrast-500:hover:not([class*=color-]) * {
  color: rgba(3, 79, 26, 1);
  color: rgba(var(--color-primary-500), 1);
}

.color-primary-contrast-500,
.color-hover-primary-contrast-500:hover,
.color-primary-contrast-500[class*=icon],
.color-primary-contrast-500[class*=icon]:before,
.headings-primary-contrast-500 h1, .headings-primary-contrast-500[class^=h1],
.headings-primary-contrast-500 h2, .headings-primary-contrast-500[class^=h2],
.headings-primary-contrast-500 h3, .headings-primary-contrast-500[class^=h3],
.headings-primary-contrast-500 h4, .headings-primary-contrast-500[class^=h4],
.headings-primary-contrast-500 h5, .headings-primary-contrast-500[class^=h5],
.links-primary-contrast-500 a,
.links-primary-contrast-500 a:visited,
.links-hover-primary-contrast-500 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}

.border-primary-contrast-500,
.border-hover-primary-contrast-500:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-primary-contrast-500));
}

.bg-primary-600, .bg-hover-primary-600:hover {
  background-color: rgba(2, 40, 13, 1);
  background-color: rgba(var(--color-primary-600), 1);
}
.bg-primary-600:not([class*=color-]), .bg-hover-primary-600:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-600));
}
.bg-primary-600:not([class*=color-]) *, .bg-hover-primary-600:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-600));
}

.color-primary-600,
.color-hover-primary-600:hover,
.color-primary-600[class*=icon],
.color-primary-600[class*=icon]:before,
.headings-primary-600 h1, .headings-primary-600[class^=h1],
.headings-primary-600 h2, .headings-primary-600[class^=h2],
.headings-primary-600 h3, .headings-primary-600[class^=h3],
.headings-primary-600 h4, .headings-primary-600[class^=h4],
.headings-primary-600 h5, .headings-primary-600[class^=h5],
.links-primary-600 a,
.links-primary-600 a:visited,
.links-hover-primary-600 a:hover {
  color: rgba(2, 40, 13, 1);
  color: rgba(var(--color-primary-600), 1);
}

.border-primary-600,
.border-hover-primary-600:hover {
  border-color: rgba(2, 40, 13, 1);
  border-color: rgba(var(--color-primary-600), 1);
}

.bg-primary-contrast-600, .bg-hover-primary-contrast-600:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-600));
}
.bg-primary-contrast-600:not([class*=color-]), .bg-hover-primary-contrast-600:hover:not([class*=color-]) {
  color: rgba(2, 40, 13, 1);
  color: rgba(var(--color-primary-600), 1);
}
.bg-primary-contrast-600:not([class*=color-]) *, .bg-hover-primary-contrast-600:hover:not([class*=color-]) * {
  color: rgba(2, 40, 13, 1);
  color: rgba(var(--color-primary-600), 1);
}

.color-primary-contrast-600,
.color-hover-primary-contrast-600:hover,
.color-primary-contrast-600[class*=icon],
.color-primary-contrast-600[class*=icon]:before,
.headings-primary-contrast-600 h1, .headings-primary-contrast-600[class^=h1],
.headings-primary-contrast-600 h2, .headings-primary-contrast-600[class^=h2],
.headings-primary-contrast-600 h3, .headings-primary-contrast-600[class^=h3],
.headings-primary-contrast-600 h4, .headings-primary-contrast-600[class^=h4],
.headings-primary-contrast-600 h5, .headings-primary-contrast-600[class^=h5],
.links-primary-contrast-600 a,
.links-primary-contrast-600 a:visited,
.links-hover-primary-contrast-600 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-600));
}

.border-primary-contrast-600,
.border-hover-primary-contrast-600:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-primary-contrast-600));
}

.bg-primary-700, .bg-hover-primary-700:hover {
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-700), 1);
}
.bg-primary-700:not([class*=color-]), .bg-hover-primary-700:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-700));
}
.bg-primary-700:not([class*=color-]) *, .bg-hover-primary-700:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-700));
}

.color-primary-700,
.color-hover-primary-700:hover,
.color-primary-700[class*=icon],
.color-primary-700[class*=icon]:before,
.headings-primary-700 h1, .headings-primary-700[class^=h1],
.headings-primary-700 h2, .headings-primary-700[class^=h2],
.headings-primary-700 h3, .headings-primary-700[class^=h3],
.headings-primary-700 h4, .headings-primary-700[class^=h4],
.headings-primary-700 h5, .headings-primary-700[class^=h5],
.links-primary-700 a,
.links-primary-700 a:visited,
.links-hover-primary-700 a:hover {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-700), 1);
}

.border-primary-700,
.border-hover-primary-700:hover {
  border-color: rgba(0, 0, 0, 1);
  border-color: rgba(var(--color-primary-700), 1);
}

.bg-primary-contrast-700, .bg-hover-primary-contrast-700:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-700));
}
.bg-primary-contrast-700:not([class*=color-]), .bg-hover-primary-contrast-700:hover:not([class*=color-]) {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-700), 1);
}
.bg-primary-contrast-700:not([class*=color-]) *, .bg-hover-primary-contrast-700:hover:not([class*=color-]) * {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-700), 1);
}

.color-primary-contrast-700,
.color-hover-primary-contrast-700:hover,
.color-primary-contrast-700[class*=icon],
.color-primary-contrast-700[class*=icon]:before,
.headings-primary-contrast-700 h1, .headings-primary-contrast-700[class^=h1],
.headings-primary-contrast-700 h2, .headings-primary-contrast-700[class^=h2],
.headings-primary-contrast-700 h3, .headings-primary-contrast-700[class^=h3],
.headings-primary-contrast-700 h4, .headings-primary-contrast-700[class^=h4],
.headings-primary-contrast-700 h5, .headings-primary-contrast-700[class^=h5],
.links-primary-contrast-700 a,
.links-primary-contrast-700 a:visited,
.links-hover-primary-contrast-700 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-700));
}

.border-primary-contrast-700,
.border-hover-primary-contrast-700:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-primary-contrast-700));
}

.bg-primary-800, .bg-hover-primary-800:hover {
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-800), 1);
}
.bg-primary-800:not([class*=color-]), .bg-hover-primary-800:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-800));
}
.bg-primary-800:not([class*=color-]) *, .bg-hover-primary-800:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-800));
}

.color-primary-800,
.color-hover-primary-800:hover,
.color-primary-800[class*=icon],
.color-primary-800[class*=icon]:before,
.headings-primary-800 h1, .headings-primary-800[class^=h1],
.headings-primary-800 h2, .headings-primary-800[class^=h2],
.headings-primary-800 h3, .headings-primary-800[class^=h3],
.headings-primary-800 h4, .headings-primary-800[class^=h4],
.headings-primary-800 h5, .headings-primary-800[class^=h5],
.links-primary-800 a,
.links-primary-800 a:visited,
.links-hover-primary-800 a:hover {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-800), 1);
}

.border-primary-800,
.border-hover-primary-800:hover {
  border-color: rgba(0, 0, 0, 1);
  border-color: rgba(var(--color-primary-800), 1);
}

.bg-primary-contrast-800, .bg-hover-primary-contrast-800:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-800));
}
.bg-primary-contrast-800:not([class*=color-]), .bg-hover-primary-contrast-800:hover:not([class*=color-]) {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-800), 1);
}
.bg-primary-contrast-800:not([class*=color-]) *, .bg-hover-primary-contrast-800:hover:not([class*=color-]) * {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-800), 1);
}

.color-primary-contrast-800,
.color-hover-primary-contrast-800:hover,
.color-primary-contrast-800[class*=icon],
.color-primary-contrast-800[class*=icon]:before,
.headings-primary-contrast-800 h1, .headings-primary-contrast-800[class^=h1],
.headings-primary-contrast-800 h2, .headings-primary-contrast-800[class^=h2],
.headings-primary-contrast-800 h3, .headings-primary-contrast-800[class^=h3],
.headings-primary-contrast-800 h4, .headings-primary-contrast-800[class^=h4],
.headings-primary-contrast-800 h5, .headings-primary-contrast-800[class^=h5],
.links-primary-contrast-800 a,
.links-primary-contrast-800 a:visited,
.links-hover-primary-contrast-800 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-800));
}

.border-primary-contrast-800,
.border-hover-primary-contrast-800:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-primary-contrast-800));
}

.bg-primary-900, .bg-hover-primary-900:hover {
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-900), 1);
}
.bg-primary-900:not([class*=color-]), .bg-hover-primary-900:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}
.bg-primary-900:not([class*=color-]) *, .bg-hover-primary-900:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}

.color-primary-900,
.color-hover-primary-900:hover,
.color-primary-900[class*=icon],
.color-primary-900[class*=icon]:before,
.headings-primary-900 h1, .headings-primary-900[class^=h1],
.headings-primary-900 h2, .headings-primary-900[class^=h2],
.headings-primary-900 h3, .headings-primary-900[class^=h3],
.headings-primary-900 h4, .headings-primary-900[class^=h4],
.headings-primary-900 h5, .headings-primary-900[class^=h5],
.links-primary-900 a,
.links-primary-900 a:visited,
.links-hover-primary-900 a:hover {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-900), 1);
}

.border-primary-900,
.border-hover-primary-900:hover {
  border-color: rgba(0, 0, 0, 1);
  border-color: rgba(var(--color-primary-900), 1);
}

.bg-primary-contrast-900, .bg-hover-primary-contrast-900:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-900));
}
.bg-primary-contrast-900:not([class*=color-]), .bg-hover-primary-contrast-900:hover:not([class*=color-]) {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-900), 1);
}
.bg-primary-contrast-900:not([class*=color-]) *, .bg-hover-primary-contrast-900:hover:not([class*=color-]) * {
  color: rgba(0, 0, 0, 1);
  color: rgba(var(--color-primary-900), 1);
}

.color-primary-contrast-900,
.color-hover-primary-contrast-900:hover,
.color-primary-contrast-900[class*=icon],
.color-primary-contrast-900[class*=icon]:before,
.headings-primary-contrast-900 h1, .headings-primary-contrast-900[class^=h1],
.headings-primary-contrast-900 h2, .headings-primary-contrast-900[class^=h2],
.headings-primary-contrast-900 h3, .headings-primary-contrast-900[class^=h3],
.headings-primary-contrast-900 h4, .headings-primary-contrast-900[class^=h4],
.headings-primary-contrast-900 h5, .headings-primary-contrast-900[class^=h5],
.links-primary-contrast-900 a,
.links-primary-contrast-900 a:visited,
.links-hover-primary-contrast-900 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-900));
}

.border-primary-contrast-900,
.border-hover-primary-contrast-900:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-primary-contrast-900));
}

.bg-secondary-100, .bg-hover-secondary-100:hover {
  background-color: rgba(254, 243, 207, 1);
  background-color: rgba(var(--color-secondary-100), 1);
}
.bg-secondary-100:not([class*=color-]), .bg-hover-secondary-100:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-100));
}
.bg-secondary-100:not([class*=color-]) *, .bg-hover-secondary-100:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-100));
}

.color-secondary-100,
.color-hover-secondary-100:hover,
.color-secondary-100[class*=icon],
.color-secondary-100[class*=icon]:before,
.headings-secondary-100 h1, .headings-secondary-100[class^=h1],
.headings-secondary-100 h2, .headings-secondary-100[class^=h2],
.headings-secondary-100 h3, .headings-secondary-100[class^=h3],
.headings-secondary-100 h4, .headings-secondary-100[class^=h4],
.headings-secondary-100 h5, .headings-secondary-100[class^=h5],
.links-secondary-100 a,
.links-secondary-100 a:visited,
.links-hover-secondary-100 a:hover {
  color: rgba(254, 243, 207, 1);
  color: rgba(var(--color-secondary-100), 1);
}

.border-secondary-100,
.border-hover-secondary-100:hover {
  border-color: rgba(254, 243, 207, 1);
  border-color: rgba(var(--color-secondary-100), 1);
}

.bg-secondary-contrast-100, .bg-hover-secondary-contrast-100:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-100));
}
.bg-secondary-contrast-100:not([class*=color-]), .bg-hover-secondary-contrast-100:hover:not([class*=color-]) {
  color: rgba(254, 243, 207, 1);
  color: rgba(var(--color-secondary-100), 1);
}
.bg-secondary-contrast-100:not([class*=color-]) *, .bg-hover-secondary-contrast-100:hover:not([class*=color-]) * {
  color: rgba(254, 243, 207, 1);
  color: rgba(var(--color-secondary-100), 1);
}

.color-secondary-contrast-100,
.color-hover-secondary-contrast-100:hover,
.color-secondary-contrast-100[class*=icon],
.color-secondary-contrast-100[class*=icon]:before,
.headings-secondary-contrast-100 h1, .headings-secondary-contrast-100[class^=h1],
.headings-secondary-contrast-100 h2, .headings-secondary-contrast-100[class^=h2],
.headings-secondary-contrast-100 h3, .headings-secondary-contrast-100[class^=h3],
.headings-secondary-contrast-100 h4, .headings-secondary-contrast-100[class^=h4],
.headings-secondary-contrast-100 h5, .headings-secondary-contrast-100[class^=h5],
.links-secondary-contrast-100 a,
.links-secondary-contrast-100 a:visited,
.links-hover-secondary-contrast-100 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-100));
}

.border-secondary-contrast-100,
.border-hover-secondary-contrast-100:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-100));
}

.bg-secondary-200, .bg-hover-secondary-200:hover {
  background-color: rgba(254, 233, 167, 1);
  background-color: rgba(var(--color-secondary-200), 1);
}
.bg-secondary-200:not([class*=color-]), .bg-hover-secondary-200:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-200));
}
.bg-secondary-200:not([class*=color-]) *, .bg-hover-secondary-200:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-200));
}

.color-secondary-200,
.color-hover-secondary-200:hover,
.color-secondary-200[class*=icon],
.color-secondary-200[class*=icon]:before,
.headings-secondary-200 h1, .headings-secondary-200[class^=h1],
.headings-secondary-200 h2, .headings-secondary-200[class^=h2],
.headings-secondary-200 h3, .headings-secondary-200[class^=h3],
.headings-secondary-200 h4, .headings-secondary-200[class^=h4],
.headings-secondary-200 h5, .headings-secondary-200[class^=h5],
.links-secondary-200 a,
.links-secondary-200 a:visited,
.links-hover-secondary-200 a:hover {
  color: rgba(254, 233, 167, 1);
  color: rgba(var(--color-secondary-200), 1);
}

.border-secondary-200,
.border-hover-secondary-200:hover {
  border-color: rgba(254, 233, 167, 1);
  border-color: rgba(var(--color-secondary-200), 1);
}

.bg-secondary-contrast-200, .bg-hover-secondary-contrast-200:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-200));
}
.bg-secondary-contrast-200:not([class*=color-]), .bg-hover-secondary-contrast-200:hover:not([class*=color-]) {
  color: rgba(254, 233, 167, 1);
  color: rgba(var(--color-secondary-200), 1);
}
.bg-secondary-contrast-200:not([class*=color-]) *, .bg-hover-secondary-contrast-200:hover:not([class*=color-]) * {
  color: rgba(254, 233, 167, 1);
  color: rgba(var(--color-secondary-200), 1);
}

.color-secondary-contrast-200,
.color-hover-secondary-contrast-200:hover,
.color-secondary-contrast-200[class*=icon],
.color-secondary-contrast-200[class*=icon]:before,
.headings-secondary-contrast-200 h1, .headings-secondary-contrast-200[class^=h1],
.headings-secondary-contrast-200 h2, .headings-secondary-contrast-200[class^=h2],
.headings-secondary-contrast-200 h3, .headings-secondary-contrast-200[class^=h3],
.headings-secondary-contrast-200 h4, .headings-secondary-contrast-200[class^=h4],
.headings-secondary-contrast-200 h5, .headings-secondary-contrast-200[class^=h5],
.links-secondary-contrast-200 a,
.links-secondary-contrast-200 a:visited,
.links-hover-secondary-contrast-200 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-200));
}

.border-secondary-contrast-200,
.border-hover-secondary-contrast-200:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-200));
}

.bg-secondary-300, .bg-hover-secondary-300:hover {
  background-color: rgba(253, 223, 126, 1);
  background-color: rgba(var(--color-secondary-300), 1);
}
.bg-secondary-300:not([class*=color-]), .bg-hover-secondary-300:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-300));
}
.bg-secondary-300:not([class*=color-]) *, .bg-hover-secondary-300:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-300));
}

.color-secondary-300,
.color-hover-secondary-300:hover,
.color-secondary-300[class*=icon],
.color-secondary-300[class*=icon]:before,
.headings-secondary-300 h1, .headings-secondary-300[class^=h1],
.headings-secondary-300 h2, .headings-secondary-300[class^=h2],
.headings-secondary-300 h3, .headings-secondary-300[class^=h3],
.headings-secondary-300 h4, .headings-secondary-300[class^=h4],
.headings-secondary-300 h5, .headings-secondary-300[class^=h5],
.links-secondary-300 a,
.links-secondary-300 a:visited,
.links-hover-secondary-300 a:hover {
  color: rgba(253, 223, 126, 1);
  color: rgba(var(--color-secondary-300), 1);
}

.border-secondary-300,
.border-hover-secondary-300:hover {
  border-color: rgba(253, 223, 126, 1);
  border-color: rgba(var(--color-secondary-300), 1);
}

.bg-secondary-contrast-300, .bg-hover-secondary-contrast-300:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-300));
}
.bg-secondary-contrast-300:not([class*=color-]), .bg-hover-secondary-contrast-300:hover:not([class*=color-]) {
  color: rgba(253, 223, 126, 1);
  color: rgba(var(--color-secondary-300), 1);
}
.bg-secondary-contrast-300:not([class*=color-]) *, .bg-hover-secondary-contrast-300:hover:not([class*=color-]) * {
  color: rgba(253, 223, 126, 1);
  color: rgba(var(--color-secondary-300), 1);
}

.color-secondary-contrast-300,
.color-hover-secondary-contrast-300:hover,
.color-secondary-contrast-300[class*=icon],
.color-secondary-contrast-300[class*=icon]:before,
.headings-secondary-contrast-300 h1, .headings-secondary-contrast-300[class^=h1],
.headings-secondary-contrast-300 h2, .headings-secondary-contrast-300[class^=h2],
.headings-secondary-contrast-300 h3, .headings-secondary-contrast-300[class^=h3],
.headings-secondary-contrast-300 h4, .headings-secondary-contrast-300[class^=h4],
.headings-secondary-contrast-300 h5, .headings-secondary-contrast-300[class^=h5],
.links-secondary-contrast-300 a,
.links-secondary-contrast-300 a:visited,
.links-hover-secondary-contrast-300 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-300));
}

.border-secondary-contrast-300,
.border-hover-secondary-contrast-300:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-300));
}

.bg-secondary-400, .bg-hover-secondary-400:hover {
  background-color: rgba(253, 213, 86, 1);
  background-color: rgba(var(--color-secondary-400), 1);
}
.bg-secondary-400:not([class*=color-]), .bg-hover-secondary-400:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-400));
}
.bg-secondary-400:not([class*=color-]) *, .bg-hover-secondary-400:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-400));
}

.color-secondary-400,
.color-hover-secondary-400:hover,
.color-secondary-400[class*=icon],
.color-secondary-400[class*=icon]:before,
.headings-secondary-400 h1, .headings-secondary-400[class^=h1],
.headings-secondary-400 h2, .headings-secondary-400[class^=h2],
.headings-secondary-400 h3, .headings-secondary-400[class^=h3],
.headings-secondary-400 h4, .headings-secondary-400[class^=h4],
.headings-secondary-400 h5, .headings-secondary-400[class^=h5],
.links-secondary-400 a,
.links-secondary-400 a:visited,
.links-hover-secondary-400 a:hover {
  color: rgba(253, 213, 86, 1);
  color: rgba(var(--color-secondary-400), 1);
}

.border-secondary-400,
.border-hover-secondary-400:hover {
  border-color: rgba(253, 213, 86, 1);
  border-color: rgba(var(--color-secondary-400), 1);
}

.bg-secondary-contrast-400, .bg-hover-secondary-contrast-400:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-400));
}
.bg-secondary-contrast-400:not([class*=color-]), .bg-hover-secondary-contrast-400:hover:not([class*=color-]) {
  color: rgba(253, 213, 86, 1);
  color: rgba(var(--color-secondary-400), 1);
}
.bg-secondary-contrast-400:not([class*=color-]) *, .bg-hover-secondary-contrast-400:hover:not([class*=color-]) * {
  color: rgba(253, 213, 86, 1);
  color: rgba(var(--color-secondary-400), 1);
}

.color-secondary-contrast-400,
.color-hover-secondary-contrast-400:hover,
.color-secondary-contrast-400[class*=icon],
.color-secondary-contrast-400[class*=icon]:before,
.headings-secondary-contrast-400 h1, .headings-secondary-contrast-400[class^=h1],
.headings-secondary-contrast-400 h2, .headings-secondary-contrast-400[class^=h2],
.headings-secondary-contrast-400 h3, .headings-secondary-contrast-400[class^=h3],
.headings-secondary-contrast-400 h4, .headings-secondary-contrast-400[class^=h4],
.headings-secondary-contrast-400 h5, .headings-secondary-contrast-400[class^=h5],
.links-secondary-contrast-400 a,
.links-secondary-contrast-400 a:visited,
.links-hover-secondary-contrast-400 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-400));
}

.border-secondary-contrast-400,
.border-hover-secondary-contrast-400:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-400));
}

.bg-secondary-500, .bg-hover-secondary-500:hover {
  background-color: rgba(252, 203, 46, 1);
  background-color: rgba(var(--color-secondary-500), 1);
}
.bg-secondary-500:not([class*=color-]), .bg-hover-secondary-500:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
}
.bg-secondary-500:not([class*=color-]) *, .bg-hover-secondary-500:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
}

.color-secondary-500,
.color-hover-secondary-500:hover,
.color-secondary-500[class*=icon],
.color-secondary-500[class*=icon]:before,
.headings-secondary-500 h1, .headings-secondary-500[class^=h1],
.headings-secondary-500 h2, .headings-secondary-500[class^=h2],
.headings-secondary-500 h3, .headings-secondary-500[class^=h3],
.headings-secondary-500 h4, .headings-secondary-500[class^=h4],
.headings-secondary-500 h5, .headings-secondary-500[class^=h5],
.links-secondary-500 a,
.links-secondary-500 a:visited,
.links-hover-secondary-500 a:hover {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
}

.border-secondary-500,
.border-hover-secondary-500:hover {
  border-color: rgba(252, 203, 46, 1);
  border-color: rgba(var(--color-secondary-500), 1);
}

.bg-secondary-contrast-500, .bg-hover-secondary-contrast-500:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-500));
}
.bg-secondary-contrast-500:not([class*=color-]), .bg-hover-secondary-contrast-500:hover:not([class*=color-]) {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
}
.bg-secondary-contrast-500:not([class*=color-]) *, .bg-hover-secondary-contrast-500:hover:not([class*=color-]) * {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
}

.color-secondary-contrast-500,
.color-hover-secondary-contrast-500:hover,
.color-secondary-contrast-500[class*=icon],
.color-secondary-contrast-500[class*=icon]:before,
.headings-secondary-contrast-500 h1, .headings-secondary-contrast-500[class^=h1],
.headings-secondary-contrast-500 h2, .headings-secondary-contrast-500[class^=h2],
.headings-secondary-contrast-500 h3, .headings-secondary-contrast-500[class^=h3],
.headings-secondary-contrast-500 h4, .headings-secondary-contrast-500[class^=h4],
.headings-secondary-contrast-500 h5, .headings-secondary-contrast-500[class^=h5],
.links-secondary-contrast-500 a,
.links-secondary-contrast-500 a:visited,
.links-hover-secondary-contrast-500 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
}

.border-secondary-contrast-500,
.border-hover-secondary-contrast-500:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-500));
}

.bg-secondary-600, .bg-hover-secondary-600:hover {
  background-color: rgba(251, 193, 6, 1);
  background-color: rgba(var(--color-secondary-600), 1);
}
.bg-secondary-600:not([class*=color-]), .bg-hover-secondary-600:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-600));
}
.bg-secondary-600:not([class*=color-]) *, .bg-hover-secondary-600:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-600));
}

.color-secondary-600,
.color-hover-secondary-600:hover,
.color-secondary-600[class*=icon],
.color-secondary-600[class*=icon]:before,
.headings-secondary-600 h1, .headings-secondary-600[class^=h1],
.headings-secondary-600 h2, .headings-secondary-600[class^=h2],
.headings-secondary-600 h3, .headings-secondary-600[class^=h3],
.headings-secondary-600 h4, .headings-secondary-600[class^=h4],
.headings-secondary-600 h5, .headings-secondary-600[class^=h5],
.links-secondary-600 a,
.links-secondary-600 a:visited,
.links-hover-secondary-600 a:hover {
  color: rgba(251, 193, 6, 1);
  color: rgba(var(--color-secondary-600), 1);
}

.border-secondary-600,
.border-hover-secondary-600:hover {
  border-color: rgba(251, 193, 6, 1);
  border-color: rgba(var(--color-secondary-600), 1);
}

.bg-secondary-contrast-600, .bg-hover-secondary-contrast-600:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-600));
}
.bg-secondary-contrast-600:not([class*=color-]), .bg-hover-secondary-contrast-600:hover:not([class*=color-]) {
  color: rgba(251, 193, 6, 1);
  color: rgba(var(--color-secondary-600), 1);
}
.bg-secondary-contrast-600:not([class*=color-]) *, .bg-hover-secondary-contrast-600:hover:not([class*=color-]) * {
  color: rgba(251, 193, 6, 1);
  color: rgba(var(--color-secondary-600), 1);
}

.color-secondary-contrast-600,
.color-hover-secondary-contrast-600:hover,
.color-secondary-contrast-600[class*=icon],
.color-secondary-contrast-600[class*=icon]:before,
.headings-secondary-contrast-600 h1, .headings-secondary-contrast-600[class^=h1],
.headings-secondary-contrast-600 h2, .headings-secondary-contrast-600[class^=h2],
.headings-secondary-contrast-600 h3, .headings-secondary-contrast-600[class^=h3],
.headings-secondary-contrast-600 h4, .headings-secondary-contrast-600[class^=h4],
.headings-secondary-contrast-600 h5, .headings-secondary-contrast-600[class^=h5],
.links-secondary-contrast-600 a,
.links-secondary-contrast-600 a:visited,
.links-hover-secondary-contrast-600 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-600));
}

.border-secondary-contrast-600,
.border-hover-secondary-contrast-600:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-600));
}

.bg-secondary-700, .bg-hover-secondary-700:hover {
  background-color: rgba(213, 163, 3, 1);
  background-color: rgba(var(--color-secondary-700), 1);
}
.bg-secondary-700:not([class*=color-]), .bg-hover-secondary-700:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-700));
}
.bg-secondary-700:not([class*=color-]) *, .bg-hover-secondary-700:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-700));
}

.color-secondary-700,
.color-hover-secondary-700:hover,
.color-secondary-700[class*=icon],
.color-secondary-700[class*=icon]:before,
.headings-secondary-700 h1, .headings-secondary-700[class^=h1],
.headings-secondary-700 h2, .headings-secondary-700[class^=h2],
.headings-secondary-700 h3, .headings-secondary-700[class^=h3],
.headings-secondary-700 h4, .headings-secondary-700[class^=h4],
.headings-secondary-700 h5, .headings-secondary-700[class^=h5],
.links-secondary-700 a,
.links-secondary-700 a:visited,
.links-hover-secondary-700 a:hover {
  color: rgba(213, 163, 3, 1);
  color: rgba(var(--color-secondary-700), 1);
}

.border-secondary-700,
.border-hover-secondary-700:hover {
  border-color: rgba(213, 163, 3, 1);
  border-color: rgba(var(--color-secondary-700), 1);
}

.bg-secondary-contrast-700, .bg-hover-secondary-contrast-700:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-700));
}
.bg-secondary-contrast-700:not([class*=color-]), .bg-hover-secondary-contrast-700:hover:not([class*=color-]) {
  color: rgba(213, 163, 3, 1);
  color: rgba(var(--color-secondary-700), 1);
}
.bg-secondary-contrast-700:not([class*=color-]) *, .bg-hover-secondary-contrast-700:hover:not([class*=color-]) * {
  color: rgba(213, 163, 3, 1);
  color: rgba(var(--color-secondary-700), 1);
}

.color-secondary-contrast-700,
.color-hover-secondary-contrast-700:hover,
.color-secondary-contrast-700[class*=icon],
.color-secondary-contrast-700[class*=icon]:before,
.headings-secondary-contrast-700 h1, .headings-secondary-contrast-700[class^=h1],
.headings-secondary-contrast-700 h2, .headings-secondary-contrast-700[class^=h2],
.headings-secondary-contrast-700 h3, .headings-secondary-contrast-700[class^=h3],
.headings-secondary-contrast-700 h4, .headings-secondary-contrast-700[class^=h4],
.headings-secondary-contrast-700 h5, .headings-secondary-contrast-700[class^=h5],
.links-secondary-contrast-700 a,
.links-secondary-contrast-700 a:visited,
.links-hover-secondary-contrast-700 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-700));
}

.border-secondary-contrast-700,
.border-hover-secondary-contrast-700:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-700));
}

.bg-secondary-800, .bg-hover-secondary-800:hover {
  background-color: rgba(173, 133, 2, 1);
  background-color: rgba(var(--color-secondary-800), 1);
}
.bg-secondary-800:not([class*=color-]), .bg-hover-secondary-800:hover:not([class*=color-]) {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-800));
}
.bg-secondary-800:not([class*=color-]) *, .bg-hover-secondary-800:hover:not([class*=color-]) * {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-800));
}

.color-secondary-800,
.color-hover-secondary-800:hover,
.color-secondary-800[class*=icon],
.color-secondary-800[class*=icon]:before,
.headings-secondary-800 h1, .headings-secondary-800[class^=h1],
.headings-secondary-800 h2, .headings-secondary-800[class^=h2],
.headings-secondary-800 h3, .headings-secondary-800[class^=h3],
.headings-secondary-800 h4, .headings-secondary-800[class^=h4],
.headings-secondary-800 h5, .headings-secondary-800[class^=h5],
.links-secondary-800 a,
.links-secondary-800 a:visited,
.links-hover-secondary-800 a:hover {
  color: rgba(173, 133, 2, 1);
  color: rgba(var(--color-secondary-800), 1);
}

.border-secondary-800,
.border-hover-secondary-800:hover {
  border-color: rgba(173, 133, 2, 1);
  border-color: rgba(var(--color-secondary-800), 1);
}

.bg-secondary-contrast-800, .bg-hover-secondary-contrast-800:hover {
  background-color: rgb(49, 49, 49);
  background-color: rgb(var(--color-secondary-contrast-800));
}
.bg-secondary-contrast-800:not([class*=color-]), .bg-hover-secondary-contrast-800:hover:not([class*=color-]) {
  color: rgba(173, 133, 2, 1);
  color: rgba(var(--color-secondary-800), 1);
}
.bg-secondary-contrast-800:not([class*=color-]) *, .bg-hover-secondary-contrast-800:hover:not([class*=color-]) * {
  color: rgba(173, 133, 2, 1);
  color: rgba(var(--color-secondary-800), 1);
}

.color-secondary-contrast-800,
.color-hover-secondary-contrast-800:hover,
.color-secondary-contrast-800[class*=icon],
.color-secondary-contrast-800[class*=icon]:before,
.headings-secondary-contrast-800 h1, .headings-secondary-contrast-800[class^=h1],
.headings-secondary-contrast-800 h2, .headings-secondary-contrast-800[class^=h2],
.headings-secondary-contrast-800 h3, .headings-secondary-contrast-800[class^=h3],
.headings-secondary-contrast-800 h4, .headings-secondary-contrast-800[class^=h4],
.headings-secondary-contrast-800 h5, .headings-secondary-contrast-800[class^=h5],
.links-secondary-contrast-800 a,
.links-secondary-contrast-800 a:visited,
.links-hover-secondary-contrast-800 a:hover {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-800));
}

.border-secondary-contrast-800,
.border-hover-secondary-contrast-800:hover {
  border-color: rgb(49, 49, 49);
  border-color: rgb(var(--color-secondary-contrast-800));
}

.bg-secondary-900, .bg-hover-secondary-900:hover {
  background-color: rgba(133, 102, 2, 1);
  background-color: rgba(var(--color-secondary-900), 1);
}
.bg-secondary-900:not([class*=color-]), .bg-hover-secondary-900:hover:not([class*=color-]) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}
.bg-secondary-900:not([class*=color-]) *, .bg-hover-secondary-900:hover:not([class*=color-]) * {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}

.color-secondary-900,
.color-hover-secondary-900:hover,
.color-secondary-900[class*=icon],
.color-secondary-900[class*=icon]:before,
.headings-secondary-900 h1, .headings-secondary-900[class^=h1],
.headings-secondary-900 h2, .headings-secondary-900[class^=h2],
.headings-secondary-900 h3, .headings-secondary-900[class^=h3],
.headings-secondary-900 h4, .headings-secondary-900[class^=h4],
.headings-secondary-900 h5, .headings-secondary-900[class^=h5],
.links-secondary-900 a,
.links-secondary-900 a:visited,
.links-hover-secondary-900 a:hover {
  color: rgba(133, 102, 2, 1);
  color: rgba(var(--color-secondary-900), 1);
}

.border-secondary-900,
.border-hover-secondary-900:hover {
  border-color: rgba(133, 102, 2, 1);
  border-color: rgba(var(--color-secondary-900), 1);
}

.bg-secondary-contrast-900, .bg-hover-secondary-contrast-900:hover {
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-secondary-contrast-900));
}
.bg-secondary-contrast-900:not([class*=color-]), .bg-hover-secondary-contrast-900:hover:not([class*=color-]) {
  color: rgba(133, 102, 2, 1);
  color: rgba(var(--color-secondary-900), 1);
}
.bg-secondary-contrast-900:not([class*=color-]) *, .bg-hover-secondary-contrast-900:hover:not([class*=color-]) * {
  color: rgba(133, 102, 2, 1);
  color: rgba(var(--color-secondary-900), 1);
}

.color-secondary-contrast-900,
.color-hover-secondary-contrast-900:hover,
.color-secondary-contrast-900[class*=icon],
.color-secondary-contrast-900[class*=icon]:before,
.headings-secondary-contrast-900 h1, .headings-secondary-contrast-900[class^=h1],
.headings-secondary-contrast-900 h2, .headings-secondary-contrast-900[class^=h2],
.headings-secondary-contrast-900 h3, .headings-secondary-contrast-900[class^=h3],
.headings-secondary-contrast-900 h4, .headings-secondary-contrast-900[class^=h4],
.headings-secondary-contrast-900 h5, .headings-secondary-contrast-900[class^=h5],
.links-secondary-contrast-900 a,
.links-secondary-contrast-900 a:visited,
.links-hover-secondary-contrast-900 a:hover {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-secondary-contrast-900));
}

.border-secondary-contrast-900,
.border-hover-secondary-contrast-900:hover {
  border-color: rgb(255, 255, 255);
  border-color: rgb(var(--color-secondary-contrast-900));
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-justify {
  text-align: justify;
}

.font-primary {
  font-family: 'sofia-pro', sans-serif;
  font-family: var(--font-primary);
}

.font-secondary {
  font-family: 'Roboto', Arial, sans-serif;
  font-family: var(--font-secondary);
}

.extra-light {
  font-weight: 200;
}

.light {
  font-weight: 300;
}

.regular {
  font-weight: 400;
}

.medium {
  font-weight: 500;
}

.bold {
  font-weight: 600;
}

.extra-bold {
  font-weight: 800;
}

.black {
  font-weight: 900;
}

@media (min-width: 0px) and (max-width: 1200px) {
  [class~=m-1-1],
:root [xs~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-xs) * 1);
  }

  [class~=mt-1-1],
:root [xs~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs) * 1);
  }

  [class~=mb-1-1],
:root [xs~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=ml-1-1],
:root [xs~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs) * 1);
  }

  [class~=mr-1-1],
:root [xs~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs) * 1);
  }

  [class~=mx-1-1],
:root [xs~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs) * 1);
  }

  [class~=my-1-1],
:root [xs~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=p-1-1],
:root [xs~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
  }

  [class~=pt-1-1],
:root [xs~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs) * 1);
  }

  [class~=pb-1-1],
:root [xs~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=pl-1-1],
:root [xs~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs) * 1);
  }

  [class~=pr-1-1],
:root [xs~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs) * 1);
  }

  [class~=px-1-1],
:root [xs~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs) * 1);
  }

  [class~=py-1-1],
:root [xs~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs) * 1);
  }

  [class~=h-1-1],
:root [xs~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-xs) * 1);
  }

  [class~=w-1-1],
:root [xs~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-xs) * 1);
  }

  [class~=m-2-1],
:root [xs~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-xs) * 2);
  }

  [class~=mt-2-1],
:root [xs~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs) * 2);
  }

  [class~=mb-2-1],
:root [xs~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=ml-2-1],
:root [xs~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs) * 2);
  }

  [class~=mr-2-1],
:root [xs~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs) * 2);
  }

  [class~=mx-2-1],
:root [xs~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs) * 2);
  }

  [class~=my-2-1],
:root [xs~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=p-2-1],
:root [xs~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs) * 2);
  }

  [class~=pt-2-1],
:root [xs~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs) * 2);
  }

  [class~=pb-2-1],
:root [xs~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=pl-2-1],
:root [xs~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs) * 2);
  }

  [class~=pr-2-1],
:root [xs~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs) * 2);
  }

  [class~=px-2-1],
:root [xs~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs) * 2);
  }

  [class~=py-2-1],
:root [xs~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs) * 2);
  }

  [class~=h-2-1],
:root [xs~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }

  [class~=w-2-1],
:root [xs~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
  }

  [class~=m-3-1],
:root [xs~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-xs) * 3);
  }

  [class~=mt-3-1],
:root [xs~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs) * 3);
  }

  [class~=mb-3-1],
:root [xs~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=ml-3-1],
:root [xs~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs) * 3);
  }

  [class~=mr-3-1],
:root [xs~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs) * 3);
  }

  [class~=mx-3-1],
:root [xs~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs) * 3);
  }

  [class~=my-3-1],
:root [xs~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=p-3-1],
:root [xs~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-xs) * 3);
  }

  [class~=pt-3-1],
:root [xs~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs) * 3);
  }

  [class~=pb-3-1],
:root [xs~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=pl-3-1],
:root [xs~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs) * 3);
  }

  [class~=pr-3-1],
:root [xs~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs) * 3);
  }

  [class~=px-3-1],
:root [xs~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs) * 3);
  }

  [class~=py-3-1],
:root [xs~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs) * 3);
  }

  [class~=h-3-1],
:root [xs~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs) * 3);
  }

  [class~=w-3-1],
:root [xs~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-xs) * 3);
  }

  [class~=m-4-1],
:root [xs~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-xs) * 4);
  }

  [class~=mt-4-1],
:root [xs~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs) * 4);
  }

  [class~=mb-4-1],
:root [xs~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=ml-4-1],
:root [xs~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs) * 4);
  }

  [class~=mr-4-1],
:root [xs~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs) * 4);
  }

  [class~=mx-4-1],
:root [xs~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs) * 4);
  }

  [class~=my-4-1],
:root [xs~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=p-4-1],
:root [xs~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-xs) * 4);
  }

  [class~=pt-4-1],
:root [xs~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs) * 4);
  }

  [class~=pb-4-1],
:root [xs~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=pl-4-1],
:root [xs~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs) * 4);
  }

  [class~=pr-4-1],
:root [xs~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs) * 4);
  }

  [class~=px-4-1],
:root [xs~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs) * 4);
  }

  [class~=py-4-1],
:root [xs~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs) * 4);
  }

  [class~=h-4-1],
:root [xs~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-xs) * 4);
  }

  [class~=w-4-1],
:root [xs~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-xs) * 4);
  }

  [class~=m-5-1],
:root [xs~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-xs) * 5);
  }

  [class~=mt-5-1],
:root [xs~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs) * 5);
  }

  [class~=mb-5-1],
:root [xs~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=ml-5-1],
:root [xs~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs) * 5);
  }

  [class~=mr-5-1],
:root [xs~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs) * 5);
  }

  [class~=mx-5-1],
:root [xs~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs) * 5);
  }

  [class~=my-5-1],
:root [xs~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=p-5-1],
:root [xs~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-xs) * 5);
  }

  [class~=pt-5-1],
:root [xs~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
  }

  [class~=pb-5-1],
:root [xs~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=pl-5-1],
:root [xs~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs) * 5);
  }

  [class~=pr-5-1],
:root [xs~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs) * 5);
  }

  [class~=px-5-1],
:root [xs~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs) * 5);
  }

  [class~=py-5-1],
:root [xs~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs) * 5);
  }

  [class~=h-5-1],
:root [xs~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-xs) * 5);
  }

  [class~=w-5-1],
:root [xs~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-xs) * 5);
  }

  [class~=m-6-1],
:root [xs~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-xs) * 6);
  }

  [class~=mt-6-1],
:root [xs~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs) * 6);
  }

  [class~=mb-6-1],
:root [xs~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=ml-6-1],
:root [xs~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs) * 6);
  }

  [class~=mr-6-1],
:root [xs~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs) * 6);
  }

  [class~=mx-6-1],
:root [xs~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs) * 6);
  }

  [class~=my-6-1],
:root [xs~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=p-6-1],
:root [xs~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-xs) * 6);
  }

  [class~=pt-6-1],
:root [xs~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs) * 6);
  }

  [class~=pb-6-1],
:root [xs~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=pl-6-1],
:root [xs~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs) * 6);
  }

  [class~=pr-6-1],
:root [xs~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs) * 6);
  }

  [class~=px-6-1],
:root [xs~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs) * 6);
  }

  [class~=py-6-1],
:root [xs~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs) * 6);
  }

  [class~=h-6-1],
:root [xs~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-xs) * 6);
  }

  [class~=w-6-1],
:root [xs~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-xs) * 6);
  }

  [class~=m-7-1],
:root [xs~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-xs) * 7);
  }

  [class~=mt-7-1],
:root [xs~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs) * 7);
  }

  [class~=mb-7-1],
:root [xs~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=ml-7-1],
:root [xs~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs) * 7);
  }

  [class~=mr-7-1],
:root [xs~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs) * 7);
  }

  [class~=mx-7-1],
:root [xs~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs) * 7);
  }

  [class~=my-7-1],
:root [xs~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=p-7-1],
:root [xs~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-xs) * 7);
  }

  [class~=pt-7-1],
:root [xs~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs) * 7);
  }

  [class~=pb-7-1],
:root [xs~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=pl-7-1],
:root [xs~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs) * 7);
  }

  [class~=pr-7-1],
:root [xs~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs) * 7);
  }

  [class~=px-7-1],
:root [xs~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs) * 7);
  }

  [class~=py-7-1],
:root [xs~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs) * 7);
  }

  [class~=h-7-1],
:root [xs~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-xs) * 7);
  }

  [class~=w-7-1],
:root [xs~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-xs) * 7);
  }

  [class~=m-8-1],
:root [xs~=m-8-1] {
    margin: calc(28px * 8);
    margin: calc(var(--spacer-xs) * 8);
  }

  [class~=mt-8-1],
:root [xs~=mt-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-xs) * 8);
  }

  [class~=mb-8-1],
:root [xs~=mb-8-1] {
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-xs) * 8);
  }

  [class~=ml-8-1],
:root [xs~=ml-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-xs) * 8);
  }

  [class~=mr-8-1],
:root [xs~=mr-8-1] {
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-xs) * 8);
  }

  [class~=mx-8-1],
:root [xs~=mx-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-xs) * 8);
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-xs) * 8);
  }

  [class~=my-8-1],
:root [xs~=my-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-xs) * 8);
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-xs) * 8);
  }

  [class~=p-8-1],
:root [xs~=p-8-1] {
    padding: calc(28px * 8);
    padding: calc(var(--spacer-xs) * 8);
  }

  [class~=pt-8-1],
:root [xs~=pt-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-xs) * 8);
  }

  [class~=pb-8-1],
:root [xs~=pb-8-1] {
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-xs) * 8);
  }

  [class~=pl-8-1],
:root [xs~=pl-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-xs) * 8);
  }

  [class~=pr-8-1],
:root [xs~=pr-8-1] {
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-xs) * 8);
  }

  [class~=px-8-1],
:root [xs~=px-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-xs) * 8);
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-xs) * 8);
  }

  [class~=py-8-1],
:root [xs~=py-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-xs) * 8);
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-xs) * 8);
  }

  [class~=h-8-1],
:root [xs~=h-8-1] {
    height: calc(28px * 8);
    height: calc(var(--spacer-xs) * 8);
  }

  [class~=w-8-1],
:root [xs~=w-8-1] {
    width: calc(28px * 8);
    width: calc(var(--spacer-xs) * 8);
  }

  [class~=m-1-2],
:root [xs~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-xs) / 2);
  }

  [class~=mt-1-2],
:root [xs~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs) / 2);
  }

  [class~=mb-1-2],
:root [xs~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=ml-1-2],
:root [xs~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs) / 2);
  }

  [class~=mr-1-2],
:root [xs~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs) / 2);
  }

  [class~=mx-1-2],
:root [xs~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs) / 2);
  }

  [class~=my-1-2],
:root [xs~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=p-1-2],
:root [xs~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-xs) / 2);
  }

  [class~=pt-1-2],
:root [xs~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs) / 2);
  }

  [class~=pb-1-2],
:root [xs~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=pl-1-2],
:root [xs~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs) / 2);
  }

  [class~=pr-1-2],
:root [xs~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs) / 2);
  }

  [class~=px-1-2],
:root [xs~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs) / 2);
  }

  [class~=py-1-2],
:root [xs~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs) / 2);
  }

  [class~=h-1-2],
:root [xs~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-xs) / 2);
  }

  [class~=w-1-2],
:root [xs~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-xs) / 2);
  }

  [class~=m-1-3],
:root [xs~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-xs) / 3);
  }

  [class~=mt-1-3],
:root [xs~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs) / 3);
  }

  [class~=mb-1-3],
:root [xs~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=ml-1-3],
:root [xs~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs) / 3);
  }

  [class~=mr-1-3],
:root [xs~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs) / 3);
  }

  [class~=mx-1-3],
:root [xs~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs) / 3);
  }

  [class~=my-1-3],
:root [xs~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=p-1-3],
:root [xs~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-xs) / 3);
  }

  [class~=pt-1-3],
:root [xs~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs) / 3);
  }

  [class~=pb-1-3],
:root [xs~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=pl-1-3],
:root [xs~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs) / 3);
  }

  [class~=pr-1-3],
:root [xs~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs) / 3);
  }

  [class~=px-1-3],
:root [xs~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs) / 3);
  }

  [class~=py-1-3],
:root [xs~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs) / 3);
  }

  [class~=h-1-3],
:root [xs~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-xs) / 3);
  }

  [class~=w-1-3],
:root [xs~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-xs) / 3);
  }

  [class~=m-1-4],
:root [xs~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-xs) / 4);
  }

  [class~=mt-1-4],
:root [xs~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs) / 4);
  }

  [class~=mb-1-4],
:root [xs~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=ml-1-4],
:root [xs~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs) / 4);
  }

  [class~=mr-1-4],
:root [xs~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs) / 4);
  }

  [class~=mx-1-4],
:root [xs~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs) / 4);
  }

  [class~=my-1-4],
:root [xs~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=p-1-4],
:root [xs~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-xs) / 4);
  }

  [class~=pt-1-4],
:root [xs~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs) / 4);
  }

  [class~=pb-1-4],
:root [xs~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=pl-1-4],
:root [xs~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs) / 4);
  }

  [class~=pr-1-4],
:root [xs~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs) / 4);
  }

  [class~=px-1-4],
:root [xs~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs) / 4);
  }

  [class~=py-1-4],
:root [xs~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs) / 4);
  }

  [class~=h-1-4],
:root [xs~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-xs) / 4);
  }

  [class~=w-1-4],
:root [xs~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-xs) / 4);
  }

  [class~=m-1-5],
:root [xs~=m-1-5] {
    margin: calc(28px / 5);
    margin: calc(var(--spacer-xs) / 5);
  }

  [class~=mt-1-5],
:root [xs~=mt-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-xs) / 5);
  }

  [class~=mb-1-5],
:root [xs~=mb-1-5] {
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-xs) / 5);
  }

  [class~=ml-1-5],
:root [xs~=ml-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-xs) / 5);
  }

  [class~=mr-1-5],
:root [xs~=mr-1-5] {
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-xs) / 5);
  }

  [class~=mx-1-5],
:root [xs~=mx-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-xs) / 5);
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-xs) / 5);
  }

  [class~=my-1-5],
:root [xs~=my-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-xs) / 5);
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-xs) / 5);
  }

  [class~=p-1-5],
:root [xs~=p-1-5] {
    padding: calc(28px / 5);
    padding: calc(var(--spacer-xs) / 5);
  }

  [class~=pt-1-5],
:root [xs~=pt-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-xs) / 5);
  }

  [class~=pb-1-5],
:root [xs~=pb-1-5] {
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-xs) / 5);
  }

  [class~=pl-1-5],
:root [xs~=pl-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-xs) / 5);
  }

  [class~=pr-1-5],
:root [xs~=pr-1-5] {
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-xs) / 5);
  }

  [class~=px-1-5],
:root [xs~=px-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-xs) / 5);
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-xs) / 5);
  }

  [class~=py-1-5],
:root [xs~=py-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-xs) / 5);
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-xs) / 5);
  }

  [class~=h-1-5],
:root [xs~=h-1-5] {
    height: calc(28px / 5);
    height: calc(var(--spacer-xs) / 5);
  }

  [class~=w-1-5],
:root [xs~=w-1-5] {
    width: calc(28px / 5);
    width: calc(var(--spacer-xs) / 5);
  }

  [class~=m-1-6],
:root [xs~=m-1-6] {
    margin: calc(28px / 6);
    margin: calc(var(--spacer-xs) / 6);
  }

  [class~=mt-1-6],
:root [xs~=mt-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-xs) / 6);
  }

  [class~=mb-1-6],
:root [xs~=mb-1-6] {
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-xs) / 6);
  }

  [class~=ml-1-6],
:root [xs~=ml-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-xs) / 6);
  }

  [class~=mr-1-6],
:root [xs~=mr-1-6] {
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-xs) / 6);
  }

  [class~=mx-1-6],
:root [xs~=mx-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-xs) / 6);
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-xs) / 6);
  }

  [class~=my-1-6],
:root [xs~=my-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-xs) / 6);
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-xs) / 6);
  }

  [class~=p-1-6],
:root [xs~=p-1-6] {
    padding: calc(28px / 6);
    padding: calc(var(--spacer-xs) / 6);
  }

  [class~=pt-1-6],
:root [xs~=pt-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-xs) / 6);
  }

  [class~=pb-1-6],
:root [xs~=pb-1-6] {
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-xs) / 6);
  }

  [class~=pl-1-6],
:root [xs~=pl-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-xs) / 6);
  }

  [class~=pr-1-6],
:root [xs~=pr-1-6] {
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-xs) / 6);
  }

  [class~=px-1-6],
:root [xs~=px-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-xs) / 6);
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-xs) / 6);
  }

  [class~=py-1-6],
:root [xs~=py-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-xs) / 6);
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-xs) / 6);
  }

  [class~=h-1-6],
:root [xs~=h-1-6] {
    height: calc(28px / 6);
    height: calc(var(--spacer-xs) / 6);
  }

  [class~=w-1-6],
:root [xs~=w-1-6] {
    width: calc(28px / 6);
    width: calc(var(--spacer-xs) / 6);
  }

  [class~=m-1-7],
:root [xs~=m-1-7] {
    margin: calc(28px / 7);
    margin: calc(var(--spacer-xs) / 7);
  }

  [class~=mt-1-7],
:root [xs~=mt-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-xs) / 7);
  }

  [class~=mb-1-7],
:root [xs~=mb-1-7] {
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-xs) / 7);
  }

  [class~=ml-1-7],
:root [xs~=ml-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-xs) / 7);
  }

  [class~=mr-1-7],
:root [xs~=mr-1-7] {
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-xs) / 7);
  }

  [class~=mx-1-7],
:root [xs~=mx-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-xs) / 7);
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-xs) / 7);
  }

  [class~=my-1-7],
:root [xs~=my-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-xs) / 7);
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-xs) / 7);
  }

  [class~=p-1-7],
:root [xs~=p-1-7] {
    padding: calc(28px / 7);
    padding: calc(var(--spacer-xs) / 7);
  }

  [class~=pt-1-7],
:root [xs~=pt-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-xs) / 7);
  }

  [class~=pb-1-7],
:root [xs~=pb-1-7] {
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-xs) / 7);
  }

  [class~=pl-1-7],
:root [xs~=pl-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-xs) / 7);
  }

  [class~=pr-1-7],
:root [xs~=pr-1-7] {
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-xs) / 7);
  }

  [class~=px-1-7],
:root [xs~=px-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-xs) / 7);
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-xs) / 7);
  }

  [class~=py-1-7],
:root [xs~=py-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-xs) / 7);
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-xs) / 7);
  }

  [class~=h-1-7],
:root [xs~=h-1-7] {
    height: calc(28px / 7);
    height: calc(var(--spacer-xs) / 7);
  }

  [class~=w-1-7],
:root [xs~=w-1-7] {
    width: calc(28px / 7);
    width: calc(var(--spacer-xs) / 7);
  }

  [class~=m-0],
:root [xs~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [xs~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [xs~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [xs~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [xs~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [xs~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [xs~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [xs~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [xs~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [xs~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [xs~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [xs~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [xs~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [xs~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [xs~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [xs~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [xs~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-xs) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-xs) * -1);
  }
  [class~=gutter] > *,
:root [xs~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-xs) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-xs) * 1);
  }

  [class~=gutter-1-2],
:root [xs~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-xs) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-xs) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [xs~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-xs) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-xs) * 0.5);
  }

  [class~=row-12],
:root [xs~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [xs~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [xs~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [xs~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [xs~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [xs~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [xs~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [xs~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [xs~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [xs~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [xs~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [xs~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [xs~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [xs~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [xs~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [xs~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [xs~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [xs~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [xs~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [xs~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [xs~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [xs~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [xs~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [xs~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [xs~=row],
:root [xs~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [xs~=row] > *,
:root [xs~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [xs~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [xs~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [xs~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [xs~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [xs~=row][xs~=v-center], :root [xs~=column][xs~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [xs~=row][xs~=v-start], :root [xs~=column][xs~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [xs~=row][xs~=v-end], :root [xs~=column][xs~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [xs~=row][xs~=v-stretch], :root [xs~=column][xs~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [xs~=row][xs~=h-center], :root [xs~=column][xs~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [xs~=row][xs~=h-start], :root [xs~=column][xs~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [xs~=row][xs~=h-end], :root [xs~=column][xs~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [xs~=row][xs~=h-spacein], :root [xs~=column][xs~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [xs~=row][xs~=h-spaceout], :root [xs~=column][xs~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [xs~=row] > [xs~=v-self-center], :root [xs~=column] > [xs~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [xs~=row] > [xs~=v-self-start], :root [xs~=column] > [xs~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [xs~=row] > [xs~=v-self-end], :root [xs~=column] > [xs~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [xs~=row] > [xs~=v-self-stretch], :root [xs~=column] > [xs~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [xs~=row] > [xs~=v-self-selfstart], :root [xs~=column] > [xs~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [xs~=row] > [xs~=v-self-selfend], :root [xs~=column] > [xs~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [xs~=row] > [xs~=h-self-center], :root [xs~=column] > [xs~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [xs~=row] > [xs~=h-self-start], :root [xs~=column] > [xs~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [xs~=row] > [xs~=h-self-end], :root [xs~=column] > [xs~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [xs~=row] > [xs~=h-self-stretch], :root [xs~=column] > [xs~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [xs~=row] > [xs~=h-self-selfstart], :root [xs~=column] > [xs~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [xs~=row] > [xs~=h-self-selfend], :root [xs~=column] > [xs~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [xs~=row] > [xs~=h-self-left], :root [xs~=column] > [xs~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [xs~=row] > [xs~=h-self-right], :root [xs~=column] > [xs~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-xs-1 {
    flex-grow: 1;
  }

  .flex-grow-xs-2 {
    flex-grow: 2;
  }

  .flex-grow-xs-3 {
    flex-grow: 3;
  }

  .flex-grow-xs-4 {
    flex-grow: 4;
  }

  .flex-grow-xs-5 {
    flex-grow: 5;
  }

  .flex-grow-xs-6 {
    flex-grow: 6;
  }

  .flex-grow-xs-7 {
    flex-grow: 7;
  }

  .flex-grow-xs-8 {
    flex-grow: 8;
  }

  .flex-grow-xs-9 {
    flex-grow: 9;
  }

  .flex-grow-xs-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [xs*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [xs*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [xs*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [xs*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [xs*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [xs*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [xs*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [xs*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [xs*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [xs*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [xs*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [xs*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [xs*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [xs*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [xs*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [xs*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [xs*=bottom-inherit] {
    bottom: inherit;
  }

  [xs*=text-center] {
    text-align: center;
  }

  [xs*=text-left] {
    text-align: left;
  }

  [xs*=text-right] {
    text-align: right;
  }

  [xs*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  [class~=m-1-1],
:root [xs-l~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mt-1-1],
:root [xs-l~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mb-1-1],
:root [xs-l~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=ml-1-1],
:root [xs-l~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mr-1-1],
:root [xs-l~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=mx-1-1],
:root [xs-l~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-xs-l) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=my-1-1],
:root [xs-l~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-xs-l) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=p-1-1],
:root [xs-l~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pt-1-1],
:root [xs-l~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pb-1-1],
:root [xs-l~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pl-1-1],
:root [xs-l~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs-l) * 1);
  }

  [class~=pr-1-1],
:root [xs-l~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=px-1-1],
:root [xs-l~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-xs-l) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-xs-l) * 1);
  }

  [class~=py-1-1],
:root [xs-l~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-xs-l) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-xs-l) * 1);
  }

  [class~=h-1-1],
:root [xs-l~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-xs-l) * 1);
  }

  [class~=w-1-1],
:root [xs-l~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-xs-l) * 1);
  }

  [class~=m-2-1],
:root [xs-l~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mt-2-1],
:root [xs-l~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mb-2-1],
:root [xs-l~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=ml-2-1],
:root [xs-l~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mr-2-1],
:root [xs-l~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=mx-2-1],
:root [xs-l~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-xs-l) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=my-2-1],
:root [xs-l~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-xs-l) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=p-2-1],
:root [xs-l~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pt-2-1],
:root [xs-l~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pb-2-1],
:root [xs-l~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pl-2-1],
:root [xs-l~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs-l) * 2);
  }

  [class~=pr-2-1],
:root [xs-l~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=px-2-1],
:root [xs-l~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-xs-l) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-xs-l) * 2);
  }

  [class~=py-2-1],
:root [xs-l~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs-l) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs-l) * 2);
  }

  [class~=h-2-1],
:root [xs-l~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
  }

  [class~=w-2-1],
:root [xs-l~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
  }

  [class~=m-3-1],
:root [xs-l~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mt-3-1],
:root [xs-l~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mb-3-1],
:root [xs-l~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=ml-3-1],
:root [xs-l~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mr-3-1],
:root [xs-l~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=mx-3-1],
:root [xs-l~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-xs-l) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=my-3-1],
:root [xs-l~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-xs-l) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=p-3-1],
:root [xs-l~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pt-3-1],
:root [xs-l~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pb-3-1],
:root [xs-l~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pl-3-1],
:root [xs-l~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs-l) * 3);
  }

  [class~=pr-3-1],
:root [xs-l~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=px-3-1],
:root [xs-l~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-xs-l) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-xs-l) * 3);
  }

  [class~=py-3-1],
:root [xs-l~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-xs-l) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-xs-l) * 3);
  }

  [class~=h-3-1],
:root [xs-l~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-xs-l) * 3);
  }

  [class~=w-3-1],
:root [xs-l~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-xs-l) * 3);
  }

  [class~=m-4-1],
:root [xs-l~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mt-4-1],
:root [xs-l~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mb-4-1],
:root [xs-l~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=ml-4-1],
:root [xs-l~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mr-4-1],
:root [xs-l~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=mx-4-1],
:root [xs-l~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-xs-l) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=my-4-1],
:root [xs-l~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-xs-l) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=p-4-1],
:root [xs-l~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pt-4-1],
:root [xs-l~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pb-4-1],
:root [xs-l~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pl-4-1],
:root [xs-l~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs-l) * 4);
  }

  [class~=pr-4-1],
:root [xs-l~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=px-4-1],
:root [xs-l~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-xs-l) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-xs-l) * 4);
  }

  [class~=py-4-1],
:root [xs-l~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-xs-l) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-xs-l) * 4);
  }

  [class~=h-4-1],
:root [xs-l~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-xs-l) * 4);
  }

  [class~=w-4-1],
:root [xs-l~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-xs-l) * 4);
  }

  [class~=m-5-1],
:root [xs-l~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mt-5-1],
:root [xs-l~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mb-5-1],
:root [xs-l~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=ml-5-1],
:root [xs-l~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mr-5-1],
:root [xs-l~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=mx-5-1],
:root [xs-l~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-xs-l) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=my-5-1],
:root [xs-l~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-xs-l) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=p-5-1],
:root [xs-l~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pt-5-1],
:root [xs-l~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pb-5-1],
:root [xs-l~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pl-5-1],
:root [xs-l~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs-l) * 5);
  }

  [class~=pr-5-1],
:root [xs-l~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=px-5-1],
:root [xs-l~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-xs-l) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-xs-l) * 5);
  }

  [class~=py-5-1],
:root [xs-l~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-xs-l) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-xs-l) * 5);
  }

  [class~=h-5-1],
:root [xs-l~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-xs-l) * 5);
  }

  [class~=w-5-1],
:root [xs-l~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-xs-l) * 5);
  }

  [class~=m-6-1],
:root [xs-l~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mt-6-1],
:root [xs-l~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mb-6-1],
:root [xs-l~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=ml-6-1],
:root [xs-l~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mr-6-1],
:root [xs-l~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=mx-6-1],
:root [xs-l~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-xs-l) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=my-6-1],
:root [xs-l~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-xs-l) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=p-6-1],
:root [xs-l~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pt-6-1],
:root [xs-l~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pb-6-1],
:root [xs-l~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pl-6-1],
:root [xs-l~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs-l) * 6);
  }

  [class~=pr-6-1],
:root [xs-l~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=px-6-1],
:root [xs-l~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-xs-l) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-xs-l) * 6);
  }

  [class~=py-6-1],
:root [xs-l~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-xs-l) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-xs-l) * 6);
  }

  [class~=h-6-1],
:root [xs-l~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-xs-l) * 6);
  }

  [class~=w-6-1],
:root [xs-l~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-xs-l) * 6);
  }

  [class~=m-7-1],
:root [xs-l~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mt-7-1],
:root [xs-l~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mb-7-1],
:root [xs-l~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=ml-7-1],
:root [xs-l~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mr-7-1],
:root [xs-l~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=mx-7-1],
:root [xs-l~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-xs-l) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=my-7-1],
:root [xs-l~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-xs-l) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=p-7-1],
:root [xs-l~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pt-7-1],
:root [xs-l~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pb-7-1],
:root [xs-l~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pl-7-1],
:root [xs-l~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs-l) * 7);
  }

  [class~=pr-7-1],
:root [xs-l~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=px-7-1],
:root [xs-l~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-xs-l) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-xs-l) * 7);
  }

  [class~=py-7-1],
:root [xs-l~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-xs-l) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-xs-l) * 7);
  }

  [class~=h-7-1],
:root [xs-l~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-xs-l) * 7);
  }

  [class~=w-7-1],
:root [xs-l~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-xs-l) * 7);
  }

  [class~=m-8-1],
:root [xs-l~=m-8-1] {
    margin: calc(28px * 8);
    margin: calc(var(--spacer-xs-l) * 8);
  }

  [class~=mt-8-1],
:root [xs-l~=mt-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-xs-l) * 8);
  }

  [class~=mb-8-1],
:root [xs-l~=mb-8-1] {
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-xs-l) * 8);
  }

  [class~=ml-8-1],
:root [xs-l~=ml-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-xs-l) * 8);
  }

  [class~=mr-8-1],
:root [xs-l~=mr-8-1] {
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-xs-l) * 8);
  }

  [class~=mx-8-1],
:root [xs-l~=mx-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-xs-l) * 8);
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-xs-l) * 8);
  }

  [class~=my-8-1],
:root [xs-l~=my-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-xs-l) * 8);
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-xs-l) * 8);
  }

  [class~=p-8-1],
:root [xs-l~=p-8-1] {
    padding: calc(28px * 8);
    padding: calc(var(--spacer-xs-l) * 8);
  }

  [class~=pt-8-1],
:root [xs-l~=pt-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-xs-l) * 8);
  }

  [class~=pb-8-1],
:root [xs-l~=pb-8-1] {
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-xs-l) * 8);
  }

  [class~=pl-8-1],
:root [xs-l~=pl-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-xs-l) * 8);
  }

  [class~=pr-8-1],
:root [xs-l~=pr-8-1] {
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-xs-l) * 8);
  }

  [class~=px-8-1],
:root [xs-l~=px-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-xs-l) * 8);
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-xs-l) * 8);
  }

  [class~=py-8-1],
:root [xs-l~=py-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-xs-l) * 8);
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-xs-l) * 8);
  }

  [class~=h-8-1],
:root [xs-l~=h-8-1] {
    height: calc(28px * 8);
    height: calc(var(--spacer-xs-l) * 8);
  }

  [class~=w-8-1],
:root [xs-l~=w-8-1] {
    width: calc(28px * 8);
    width: calc(var(--spacer-xs-l) * 8);
  }

  [class~=m-1-2],
:root [xs-l~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mt-1-2],
:root [xs-l~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mb-1-2],
:root [xs-l~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=ml-1-2],
:root [xs-l~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mr-1-2],
:root [xs-l~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=mx-1-2],
:root [xs-l~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-xs-l) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=my-1-2],
:root [xs-l~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-xs-l) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=p-1-2],
:root [xs-l~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pt-1-2],
:root [xs-l~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pb-1-2],
:root [xs-l~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pl-1-2],
:root [xs-l~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs-l) / 2);
  }

  [class~=pr-1-2],
:root [xs-l~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=px-1-2],
:root [xs-l~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-xs-l) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-xs-l) / 2);
  }

  [class~=py-1-2],
:root [xs-l~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-xs-l) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-xs-l) / 2);
  }

  [class~=h-1-2],
:root [xs-l~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-xs-l) / 2);
  }

  [class~=w-1-2],
:root [xs-l~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-xs-l) / 2);
  }

  [class~=m-1-3],
:root [xs-l~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mt-1-3],
:root [xs-l~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mb-1-3],
:root [xs-l~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=ml-1-3],
:root [xs-l~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mr-1-3],
:root [xs-l~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=mx-1-3],
:root [xs-l~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-xs-l) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=my-1-3],
:root [xs-l~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-xs-l) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=p-1-3],
:root [xs-l~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pt-1-3],
:root [xs-l~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pb-1-3],
:root [xs-l~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pl-1-3],
:root [xs-l~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs-l) / 3);
  }

  [class~=pr-1-3],
:root [xs-l~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=px-1-3],
:root [xs-l~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-xs-l) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-xs-l) / 3);
  }

  [class~=py-1-3],
:root [xs-l~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-xs-l) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-xs-l) / 3);
  }

  [class~=h-1-3],
:root [xs-l~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-xs-l) / 3);
  }

  [class~=w-1-3],
:root [xs-l~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-xs-l) / 3);
  }

  [class~=m-1-4],
:root [xs-l~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mt-1-4],
:root [xs-l~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mb-1-4],
:root [xs-l~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=ml-1-4],
:root [xs-l~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mr-1-4],
:root [xs-l~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=mx-1-4],
:root [xs-l~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-xs-l) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=my-1-4],
:root [xs-l~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-xs-l) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=p-1-4],
:root [xs-l~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pt-1-4],
:root [xs-l~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pb-1-4],
:root [xs-l~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pl-1-4],
:root [xs-l~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs-l) / 4);
  }

  [class~=pr-1-4],
:root [xs-l~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=px-1-4],
:root [xs-l~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-xs-l) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-xs-l) / 4);
  }

  [class~=py-1-4],
:root [xs-l~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-xs-l) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-xs-l) / 4);
  }

  [class~=h-1-4],
:root [xs-l~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-xs-l) / 4);
  }

  [class~=w-1-4],
:root [xs-l~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-xs-l) / 4);
  }

  [class~=m-1-5],
:root [xs-l~=m-1-5] {
    margin: calc(28px / 5);
    margin: calc(var(--spacer-xs-l) / 5);
  }

  [class~=mt-1-5],
:root [xs-l~=mt-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-xs-l) / 5);
  }

  [class~=mb-1-5],
:root [xs-l~=mb-1-5] {
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-xs-l) / 5);
  }

  [class~=ml-1-5],
:root [xs-l~=ml-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-xs-l) / 5);
  }

  [class~=mr-1-5],
:root [xs-l~=mr-1-5] {
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-xs-l) / 5);
  }

  [class~=mx-1-5],
:root [xs-l~=mx-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-xs-l) / 5);
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-xs-l) / 5);
  }

  [class~=my-1-5],
:root [xs-l~=my-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-xs-l) / 5);
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-xs-l) / 5);
  }

  [class~=p-1-5],
:root [xs-l~=p-1-5] {
    padding: calc(28px / 5);
    padding: calc(var(--spacer-xs-l) / 5);
  }

  [class~=pt-1-5],
:root [xs-l~=pt-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-xs-l) / 5);
  }

  [class~=pb-1-5],
:root [xs-l~=pb-1-5] {
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-xs-l) / 5);
  }

  [class~=pl-1-5],
:root [xs-l~=pl-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-xs-l) / 5);
  }

  [class~=pr-1-5],
:root [xs-l~=pr-1-5] {
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-xs-l) / 5);
  }

  [class~=px-1-5],
:root [xs-l~=px-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-xs-l) / 5);
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-xs-l) / 5);
  }

  [class~=py-1-5],
:root [xs-l~=py-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-xs-l) / 5);
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-xs-l) / 5);
  }

  [class~=h-1-5],
:root [xs-l~=h-1-5] {
    height: calc(28px / 5);
    height: calc(var(--spacer-xs-l) / 5);
  }

  [class~=w-1-5],
:root [xs-l~=w-1-5] {
    width: calc(28px / 5);
    width: calc(var(--spacer-xs-l) / 5);
  }

  [class~=m-1-6],
:root [xs-l~=m-1-6] {
    margin: calc(28px / 6);
    margin: calc(var(--spacer-xs-l) / 6);
  }

  [class~=mt-1-6],
:root [xs-l~=mt-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-xs-l) / 6);
  }

  [class~=mb-1-6],
:root [xs-l~=mb-1-6] {
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-xs-l) / 6);
  }

  [class~=ml-1-6],
:root [xs-l~=ml-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-xs-l) / 6);
  }

  [class~=mr-1-6],
:root [xs-l~=mr-1-6] {
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-xs-l) / 6);
  }

  [class~=mx-1-6],
:root [xs-l~=mx-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-xs-l) / 6);
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-xs-l) / 6);
  }

  [class~=my-1-6],
:root [xs-l~=my-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-xs-l) / 6);
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-xs-l) / 6);
  }

  [class~=p-1-6],
:root [xs-l~=p-1-6] {
    padding: calc(28px / 6);
    padding: calc(var(--spacer-xs-l) / 6);
  }

  [class~=pt-1-6],
:root [xs-l~=pt-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-xs-l) / 6);
  }

  [class~=pb-1-6],
:root [xs-l~=pb-1-6] {
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-xs-l) / 6);
  }

  [class~=pl-1-6],
:root [xs-l~=pl-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-xs-l) / 6);
  }

  [class~=pr-1-6],
:root [xs-l~=pr-1-6] {
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-xs-l) / 6);
  }

  [class~=px-1-6],
:root [xs-l~=px-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-xs-l) / 6);
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-xs-l) / 6);
  }

  [class~=py-1-6],
:root [xs-l~=py-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-xs-l) / 6);
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-xs-l) / 6);
  }

  [class~=h-1-6],
:root [xs-l~=h-1-6] {
    height: calc(28px / 6);
    height: calc(var(--spacer-xs-l) / 6);
  }

  [class~=w-1-6],
:root [xs-l~=w-1-6] {
    width: calc(28px / 6);
    width: calc(var(--spacer-xs-l) / 6);
  }

  [class~=m-1-7],
:root [xs-l~=m-1-7] {
    margin: calc(28px / 7);
    margin: calc(var(--spacer-xs-l) / 7);
  }

  [class~=mt-1-7],
:root [xs-l~=mt-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-xs-l) / 7);
  }

  [class~=mb-1-7],
:root [xs-l~=mb-1-7] {
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-xs-l) / 7);
  }

  [class~=ml-1-7],
:root [xs-l~=ml-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-xs-l) / 7);
  }

  [class~=mr-1-7],
:root [xs-l~=mr-1-7] {
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-xs-l) / 7);
  }

  [class~=mx-1-7],
:root [xs-l~=mx-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-xs-l) / 7);
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-xs-l) / 7);
  }

  [class~=my-1-7],
:root [xs-l~=my-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-xs-l) / 7);
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-xs-l) / 7);
  }

  [class~=p-1-7],
:root [xs-l~=p-1-7] {
    padding: calc(28px / 7);
    padding: calc(var(--spacer-xs-l) / 7);
  }

  [class~=pt-1-7],
:root [xs-l~=pt-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-xs-l) / 7);
  }

  [class~=pb-1-7],
:root [xs-l~=pb-1-7] {
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-xs-l) / 7);
  }

  [class~=pl-1-7],
:root [xs-l~=pl-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-xs-l) / 7);
  }

  [class~=pr-1-7],
:root [xs-l~=pr-1-7] {
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-xs-l) / 7);
  }

  [class~=px-1-7],
:root [xs-l~=px-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-xs-l) / 7);
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-xs-l) / 7);
  }

  [class~=py-1-7],
:root [xs-l~=py-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-xs-l) / 7);
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-xs-l) / 7);
  }

  [class~=h-1-7],
:root [xs-l~=h-1-7] {
    height: calc(28px / 7);
    height: calc(var(--spacer-xs-l) / 7);
  }

  [class~=w-1-7],
:root [xs-l~=w-1-7] {
    width: calc(28px / 7);
    width: calc(var(--spacer-xs-l) / 7);
  }

  [class~=m-0],
:root [xs-l~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [xs-l~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [xs-l~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [xs-l~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [xs-l~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [xs-l~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [xs-l~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [xs-l~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [xs-l~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [xs-l~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [xs-l~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [xs-l~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [xs-l~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [xs-l~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [xs-l~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [xs-l~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [xs-l~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-xs-l) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-xs-l) * -1);
  }
  [class~=gutter] > *,
:root [xs-l~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-xs-l) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-xs-l) * 1);
  }

  [class~=gutter-1-2],
:root [xs-l~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-xs-l) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-xs-l) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [xs-l~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-xs-l) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-xs-l) * 0.5);
  }

  [class~=row-12],
:root [xs-l~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [xs-l~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [xs-l~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [xs-l~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [xs-l~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [xs-l~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [xs-l~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [xs-l~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [xs-l~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [xs-l~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [xs-l~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [xs-l~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [xs-l~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [xs-l~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [xs-l~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [xs-l~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [xs-l~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [xs-l~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [xs-l~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [xs-l~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [xs-l~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [xs-l~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [xs-l~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [xs-l~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [xs-l~=row],
:root [xs-l~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [xs-l~=row] > *,
:root [xs-l~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [xs-l~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [xs-l~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [xs-l~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [xs-l~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [xs-l~=row][xs-l~=v-center], :root [xs-l~=column][xs-l~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [xs-l~=row][xs-l~=v-start], :root [xs-l~=column][xs-l~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [xs-l~=row][xs-l~=v-end], :root [xs-l~=column][xs-l~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [xs-l~=row][xs-l~=v-stretch], :root [xs-l~=column][xs-l~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [xs-l~=row][xs-l~=h-center], :root [xs-l~=column][xs-l~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [xs-l~=row][xs-l~=h-start], :root [xs-l~=column][xs-l~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [xs-l~=row][xs-l~=h-end], :root [xs-l~=column][xs-l~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [xs-l~=row][xs-l~=h-spacein], :root [xs-l~=column][xs-l~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [xs-l~=row][xs-l~=h-spaceout], :root [xs-l~=column][xs-l~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [xs-l~=row] > [xs-l~=v-self-center], :root [xs-l~=column] > [xs-l~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [xs-l~=row] > [xs-l~=v-self-start], :root [xs-l~=column] > [xs-l~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [xs-l~=row] > [xs-l~=v-self-end], :root [xs-l~=column] > [xs-l~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [xs-l~=row] > [xs-l~=v-self-stretch], :root [xs-l~=column] > [xs-l~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [xs-l~=row] > [xs-l~=v-self-selfstart], :root [xs-l~=column] > [xs-l~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [xs-l~=row] > [xs-l~=v-self-selfend], :root [xs-l~=column] > [xs-l~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [xs-l~=row] > [xs-l~=h-self-center], :root [xs-l~=column] > [xs-l~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [xs-l~=row] > [xs-l~=h-self-start], :root [xs-l~=column] > [xs-l~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [xs-l~=row] > [xs-l~=h-self-end], :root [xs-l~=column] > [xs-l~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [xs-l~=row] > [xs-l~=h-self-stretch], :root [xs-l~=column] > [xs-l~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [xs-l~=row] > [xs-l~=h-self-selfstart], :root [xs-l~=column] > [xs-l~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [xs-l~=row] > [xs-l~=h-self-selfend], :root [xs-l~=column] > [xs-l~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [xs-l~=row] > [xs-l~=h-self-left], :root [xs-l~=column] > [xs-l~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [xs-l~=row] > [xs-l~=h-self-right], :root [xs-l~=column] > [xs-l~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-xs-l-1 {
    flex-grow: 1;
  }

  .flex-grow-xs-l-2 {
    flex-grow: 2;
  }

  .flex-grow-xs-l-3 {
    flex-grow: 3;
  }

  .flex-grow-xs-l-4 {
    flex-grow: 4;
  }

  .flex-grow-xs-l-5 {
    flex-grow: 5;
  }

  .flex-grow-xs-l-6 {
    flex-grow: 6;
  }

  .flex-grow-xs-l-7 {
    flex-grow: 7;
  }

  .flex-grow-xs-l-8 {
    flex-grow: 8;
  }

  .flex-grow-xs-l-9 {
    flex-grow: 9;
  }

  .flex-grow-xs-l-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [xs-l*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [xs-l*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [xs-l*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [xs-l*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [xs-l*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [xs-l*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [xs-l*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [xs-l*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [xs-l*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [xs-l*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [xs-l*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [xs-l*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [xs-l*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [xs-l*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [xs-l*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [xs-l*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [xs-l*=bottom-inherit] {
    bottom: inherit;
  }

  [xs-l*=text-center] {
    text-align: center;
  }

  [xs-l*=text-left] {
    text-align: left;
  }

  [xs-l*=text-right] {
    text-align: right;
  }

  [xs-l*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  [class~=m-1-1],
:root [sm~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-sm) * 1);
  }

  [class~=mt-1-1],
:root [sm~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-sm) * 1);
  }

  [class~=mb-1-1],
:root [sm~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=ml-1-1],
:root [sm~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-sm) * 1);
  }

  [class~=mr-1-1],
:root [sm~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-sm) * 1);
  }

  [class~=mx-1-1],
:root [sm~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-sm) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-sm) * 1);
  }

  [class~=my-1-1],
:root [sm~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-sm) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=p-1-1],
:root [sm~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-sm) * 1);
  }

  [class~=pt-1-1],
:root [sm~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-sm) * 1);
  }

  [class~=pb-1-1],
:root [sm~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=pl-1-1],
:root [sm~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-sm) * 1);
  }

  [class~=pr-1-1],
:root [sm~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-sm) * 1);
  }

  [class~=px-1-1],
:root [sm~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-sm) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-sm) * 1);
  }

  [class~=py-1-1],
:root [sm~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-sm) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-sm) * 1);
  }

  [class~=h-1-1],
:root [sm~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-sm) * 1);
  }

  [class~=w-1-1],
:root [sm~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-sm) * 1);
  }

  [class~=m-2-1],
:root [sm~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-sm) * 2);
  }

  [class~=mt-2-1],
:root [sm~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-sm) * 2);
  }

  [class~=mb-2-1],
:root [sm~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=ml-2-1],
:root [sm~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-sm) * 2);
  }

  [class~=mr-2-1],
:root [sm~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-sm) * 2);
  }

  [class~=mx-2-1],
:root [sm~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-sm) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-sm) * 2);
  }

  [class~=my-2-1],
:root [sm~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-sm) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=p-2-1],
:root [sm~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-sm) * 2);
  }

  [class~=pt-2-1],
:root [sm~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-sm) * 2);
  }

  [class~=pb-2-1],
:root [sm~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=pl-2-1],
:root [sm~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-sm) * 2);
  }

  [class~=pr-2-1],
:root [sm~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-sm) * 2);
  }

  [class~=px-2-1],
:root [sm~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-sm) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-sm) * 2);
  }

  [class~=py-2-1],
:root [sm~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-sm) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-sm) * 2);
  }

  [class~=h-2-1],
:root [sm~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
  }

  [class~=w-2-1],
:root [sm~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
  }

  [class~=m-3-1],
:root [sm~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-sm) * 3);
  }

  [class~=mt-3-1],
:root [sm~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-sm) * 3);
  }

  [class~=mb-3-1],
:root [sm~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=ml-3-1],
:root [sm~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-sm) * 3);
  }

  [class~=mr-3-1],
:root [sm~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-sm) * 3);
  }

  [class~=mx-3-1],
:root [sm~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-sm) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-sm) * 3);
  }

  [class~=my-3-1],
:root [sm~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-sm) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=p-3-1],
:root [sm~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-sm) * 3);
  }

  [class~=pt-3-1],
:root [sm~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-sm) * 3);
  }

  [class~=pb-3-1],
:root [sm~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=pl-3-1],
:root [sm~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-sm) * 3);
  }

  [class~=pr-3-1],
:root [sm~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-sm) * 3);
  }

  [class~=px-3-1],
:root [sm~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-sm) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-sm) * 3);
  }

  [class~=py-3-1],
:root [sm~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-sm) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-sm) * 3);
  }

  [class~=h-3-1],
:root [sm~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-sm) * 3);
  }

  [class~=w-3-1],
:root [sm~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-sm) * 3);
  }

  [class~=m-4-1],
:root [sm~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-sm) * 4);
  }

  [class~=mt-4-1],
:root [sm~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-sm) * 4);
  }

  [class~=mb-4-1],
:root [sm~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=ml-4-1],
:root [sm~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-sm) * 4);
  }

  [class~=mr-4-1],
:root [sm~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-sm) * 4);
  }

  [class~=mx-4-1],
:root [sm~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-sm) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-sm) * 4);
  }

  [class~=my-4-1],
:root [sm~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-sm) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=p-4-1],
:root [sm~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-sm) * 4);
  }

  [class~=pt-4-1],
:root [sm~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-sm) * 4);
  }

  [class~=pb-4-1],
:root [sm~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=pl-4-1],
:root [sm~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-sm) * 4);
  }

  [class~=pr-4-1],
:root [sm~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-sm) * 4);
  }

  [class~=px-4-1],
:root [sm~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-sm) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-sm) * 4);
  }

  [class~=py-4-1],
:root [sm~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-sm) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-sm) * 4);
  }

  [class~=h-4-1],
:root [sm~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-sm) * 4);
  }

  [class~=w-4-1],
:root [sm~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-sm) * 4);
  }

  [class~=m-5-1],
:root [sm~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-sm) * 5);
  }

  [class~=mt-5-1],
:root [sm~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-sm) * 5);
  }

  [class~=mb-5-1],
:root [sm~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=ml-5-1],
:root [sm~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-sm) * 5);
  }

  [class~=mr-5-1],
:root [sm~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-sm) * 5);
  }

  [class~=mx-5-1],
:root [sm~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-sm) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-sm) * 5);
  }

  [class~=my-5-1],
:root [sm~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-sm) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=p-5-1],
:root [sm~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-sm) * 5);
  }

  [class~=pt-5-1],
:root [sm~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
  }

  [class~=pb-5-1],
:root [sm~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=pl-5-1],
:root [sm~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-sm) * 5);
  }

  [class~=pr-5-1],
:root [sm~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-sm) * 5);
  }

  [class~=px-5-1],
:root [sm~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-sm) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-sm) * 5);
  }

  [class~=py-5-1],
:root [sm~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-sm) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-sm) * 5);
  }

  [class~=h-5-1],
:root [sm~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-sm) * 5);
  }

  [class~=w-5-1],
:root [sm~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-sm) * 5);
  }

  [class~=m-6-1],
:root [sm~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-sm) * 6);
  }

  [class~=mt-6-1],
:root [sm~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-sm) * 6);
  }

  [class~=mb-6-1],
:root [sm~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=ml-6-1],
:root [sm~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-sm) * 6);
  }

  [class~=mr-6-1],
:root [sm~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-sm) * 6);
  }

  [class~=mx-6-1],
:root [sm~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-sm) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-sm) * 6);
  }

  [class~=my-6-1],
:root [sm~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-sm) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=p-6-1],
:root [sm~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-sm) * 6);
  }

  [class~=pt-6-1],
:root [sm~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-sm) * 6);
  }

  [class~=pb-6-1],
:root [sm~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=pl-6-1],
:root [sm~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-sm) * 6);
  }

  [class~=pr-6-1],
:root [sm~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-sm) * 6);
  }

  [class~=px-6-1],
:root [sm~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-sm) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-sm) * 6);
  }

  [class~=py-6-1],
:root [sm~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-sm) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-sm) * 6);
  }

  [class~=h-6-1],
:root [sm~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-sm) * 6);
  }

  [class~=w-6-1],
:root [sm~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-sm) * 6);
  }

  [class~=m-7-1],
:root [sm~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-sm) * 7);
  }

  [class~=mt-7-1],
:root [sm~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-sm) * 7);
  }

  [class~=mb-7-1],
:root [sm~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=ml-7-1],
:root [sm~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-sm) * 7);
  }

  [class~=mr-7-1],
:root [sm~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-sm) * 7);
  }

  [class~=mx-7-1],
:root [sm~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-sm) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-sm) * 7);
  }

  [class~=my-7-1],
:root [sm~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-sm) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=p-7-1],
:root [sm~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-sm) * 7);
  }

  [class~=pt-7-1],
:root [sm~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-sm) * 7);
  }

  [class~=pb-7-1],
:root [sm~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=pl-7-1],
:root [sm~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-sm) * 7);
  }

  [class~=pr-7-1],
:root [sm~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-sm) * 7);
  }

  [class~=px-7-1],
:root [sm~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-sm) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-sm) * 7);
  }

  [class~=py-7-1],
:root [sm~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-sm) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-sm) * 7);
  }

  [class~=h-7-1],
:root [sm~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-sm) * 7);
  }

  [class~=w-7-1],
:root [sm~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-sm) * 7);
  }

  [class~=m-8-1],
:root [sm~=m-8-1] {
    margin: calc(28px * 8);
    margin: calc(var(--spacer-sm) * 8);
  }

  [class~=mt-8-1],
:root [sm~=mt-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-sm) * 8);
  }

  [class~=mb-8-1],
:root [sm~=mb-8-1] {
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-sm) * 8);
  }

  [class~=ml-8-1],
:root [sm~=ml-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-sm) * 8);
  }

  [class~=mr-8-1],
:root [sm~=mr-8-1] {
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-sm) * 8);
  }

  [class~=mx-8-1],
:root [sm~=mx-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-sm) * 8);
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-sm) * 8);
  }

  [class~=my-8-1],
:root [sm~=my-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-sm) * 8);
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-sm) * 8);
  }

  [class~=p-8-1],
:root [sm~=p-8-1] {
    padding: calc(28px * 8);
    padding: calc(var(--spacer-sm) * 8);
  }

  [class~=pt-8-1],
:root [sm~=pt-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-sm) * 8);
  }

  [class~=pb-8-1],
:root [sm~=pb-8-1] {
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-sm) * 8);
  }

  [class~=pl-8-1],
:root [sm~=pl-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-sm) * 8);
  }

  [class~=pr-8-1],
:root [sm~=pr-8-1] {
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-sm) * 8);
  }

  [class~=px-8-1],
:root [sm~=px-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-sm) * 8);
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-sm) * 8);
  }

  [class~=py-8-1],
:root [sm~=py-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-sm) * 8);
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-sm) * 8);
  }

  [class~=h-8-1],
:root [sm~=h-8-1] {
    height: calc(28px * 8);
    height: calc(var(--spacer-sm) * 8);
  }

  [class~=w-8-1],
:root [sm~=w-8-1] {
    width: calc(28px * 8);
    width: calc(var(--spacer-sm) * 8);
  }

  [class~=m-1-2],
:root [sm~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-sm) / 2);
  }

  [class~=mt-1-2],
:root [sm~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-sm) / 2);
  }

  [class~=mb-1-2],
:root [sm~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=ml-1-2],
:root [sm~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-sm) / 2);
  }

  [class~=mr-1-2],
:root [sm~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-sm) / 2);
  }

  [class~=mx-1-2],
:root [sm~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-sm) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-sm) / 2);
  }

  [class~=my-1-2],
:root [sm~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-sm) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=p-1-2],
:root [sm~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-sm) / 2);
  }

  [class~=pt-1-2],
:root [sm~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-sm) / 2);
  }

  [class~=pb-1-2],
:root [sm~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=pl-1-2],
:root [sm~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-sm) / 2);
  }

  [class~=pr-1-2],
:root [sm~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-sm) / 2);
  }

  [class~=px-1-2],
:root [sm~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-sm) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-sm) / 2);
  }

  [class~=py-1-2],
:root [sm~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-sm) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-sm) / 2);
  }

  [class~=h-1-2],
:root [sm~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-sm) / 2);
  }

  [class~=w-1-2],
:root [sm~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-sm) / 2);
  }

  [class~=m-1-3],
:root [sm~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-sm) / 3);
  }

  [class~=mt-1-3],
:root [sm~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-sm) / 3);
  }

  [class~=mb-1-3],
:root [sm~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=ml-1-3],
:root [sm~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-sm) / 3);
  }

  [class~=mr-1-3],
:root [sm~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-sm) / 3);
  }

  [class~=mx-1-3],
:root [sm~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-sm) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-sm) / 3);
  }

  [class~=my-1-3],
:root [sm~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-sm) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=p-1-3],
:root [sm~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-sm) / 3);
  }

  [class~=pt-1-3],
:root [sm~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-sm) / 3);
  }

  [class~=pb-1-3],
:root [sm~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=pl-1-3],
:root [sm~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-sm) / 3);
  }

  [class~=pr-1-3],
:root [sm~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-sm) / 3);
  }

  [class~=px-1-3],
:root [sm~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-sm) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-sm) / 3);
  }

  [class~=py-1-3],
:root [sm~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-sm) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-sm) / 3);
  }

  [class~=h-1-3],
:root [sm~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-sm) / 3);
  }

  [class~=w-1-3],
:root [sm~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-sm) / 3);
  }

  [class~=m-1-4],
:root [sm~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-sm) / 4);
  }

  [class~=mt-1-4],
:root [sm~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-sm) / 4);
  }

  [class~=mb-1-4],
:root [sm~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=ml-1-4],
:root [sm~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-sm) / 4);
  }

  [class~=mr-1-4],
:root [sm~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-sm) / 4);
  }

  [class~=mx-1-4],
:root [sm~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-sm) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-sm) / 4);
  }

  [class~=my-1-4],
:root [sm~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-sm) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=p-1-4],
:root [sm~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-sm) / 4);
  }

  [class~=pt-1-4],
:root [sm~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-sm) / 4);
  }

  [class~=pb-1-4],
:root [sm~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=pl-1-4],
:root [sm~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-sm) / 4);
  }

  [class~=pr-1-4],
:root [sm~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-sm) / 4);
  }

  [class~=px-1-4],
:root [sm~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-sm) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-sm) / 4);
  }

  [class~=py-1-4],
:root [sm~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-sm) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-sm) / 4);
  }

  [class~=h-1-4],
:root [sm~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-sm) / 4);
  }

  [class~=w-1-4],
:root [sm~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-sm) / 4);
  }

  [class~=m-1-5],
:root [sm~=m-1-5] {
    margin: calc(28px / 5);
    margin: calc(var(--spacer-sm) / 5);
  }

  [class~=mt-1-5],
:root [sm~=mt-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-sm) / 5);
  }

  [class~=mb-1-5],
:root [sm~=mb-1-5] {
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-sm) / 5);
  }

  [class~=ml-1-5],
:root [sm~=ml-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-sm) / 5);
  }

  [class~=mr-1-5],
:root [sm~=mr-1-5] {
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-sm) / 5);
  }

  [class~=mx-1-5],
:root [sm~=mx-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-sm) / 5);
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-sm) / 5);
  }

  [class~=my-1-5],
:root [sm~=my-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-sm) / 5);
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-sm) / 5);
  }

  [class~=p-1-5],
:root [sm~=p-1-5] {
    padding: calc(28px / 5);
    padding: calc(var(--spacer-sm) / 5);
  }

  [class~=pt-1-5],
:root [sm~=pt-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-sm) / 5);
  }

  [class~=pb-1-5],
:root [sm~=pb-1-5] {
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-sm) / 5);
  }

  [class~=pl-1-5],
:root [sm~=pl-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-sm) / 5);
  }

  [class~=pr-1-5],
:root [sm~=pr-1-5] {
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-sm) / 5);
  }

  [class~=px-1-5],
:root [sm~=px-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-sm) / 5);
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-sm) / 5);
  }

  [class~=py-1-5],
:root [sm~=py-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-sm) / 5);
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-sm) / 5);
  }

  [class~=h-1-5],
:root [sm~=h-1-5] {
    height: calc(28px / 5);
    height: calc(var(--spacer-sm) / 5);
  }

  [class~=w-1-5],
:root [sm~=w-1-5] {
    width: calc(28px / 5);
    width: calc(var(--spacer-sm) / 5);
  }

  [class~=m-1-6],
:root [sm~=m-1-6] {
    margin: calc(28px / 6);
    margin: calc(var(--spacer-sm) / 6);
  }

  [class~=mt-1-6],
:root [sm~=mt-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-sm) / 6);
  }

  [class~=mb-1-6],
:root [sm~=mb-1-6] {
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-sm) / 6);
  }

  [class~=ml-1-6],
:root [sm~=ml-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-sm) / 6);
  }

  [class~=mr-1-6],
:root [sm~=mr-1-6] {
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-sm) / 6);
  }

  [class~=mx-1-6],
:root [sm~=mx-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-sm) / 6);
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-sm) / 6);
  }

  [class~=my-1-6],
:root [sm~=my-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-sm) / 6);
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-sm) / 6);
  }

  [class~=p-1-6],
:root [sm~=p-1-6] {
    padding: calc(28px / 6);
    padding: calc(var(--spacer-sm) / 6);
  }

  [class~=pt-1-6],
:root [sm~=pt-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-sm) / 6);
  }

  [class~=pb-1-6],
:root [sm~=pb-1-6] {
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-sm) / 6);
  }

  [class~=pl-1-6],
:root [sm~=pl-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-sm) / 6);
  }

  [class~=pr-1-6],
:root [sm~=pr-1-6] {
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-sm) / 6);
  }

  [class~=px-1-6],
:root [sm~=px-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-sm) / 6);
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-sm) / 6);
  }

  [class~=py-1-6],
:root [sm~=py-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-sm) / 6);
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-sm) / 6);
  }

  [class~=h-1-6],
:root [sm~=h-1-6] {
    height: calc(28px / 6);
    height: calc(var(--spacer-sm) / 6);
  }

  [class~=w-1-6],
:root [sm~=w-1-6] {
    width: calc(28px / 6);
    width: calc(var(--spacer-sm) / 6);
  }

  [class~=m-1-7],
:root [sm~=m-1-7] {
    margin: calc(28px / 7);
    margin: calc(var(--spacer-sm) / 7);
  }

  [class~=mt-1-7],
:root [sm~=mt-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-sm) / 7);
  }

  [class~=mb-1-7],
:root [sm~=mb-1-7] {
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-sm) / 7);
  }

  [class~=ml-1-7],
:root [sm~=ml-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-sm) / 7);
  }

  [class~=mr-1-7],
:root [sm~=mr-1-7] {
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-sm) / 7);
  }

  [class~=mx-1-7],
:root [sm~=mx-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-sm) / 7);
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-sm) / 7);
  }

  [class~=my-1-7],
:root [sm~=my-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-sm) / 7);
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-sm) / 7);
  }

  [class~=p-1-7],
:root [sm~=p-1-7] {
    padding: calc(28px / 7);
    padding: calc(var(--spacer-sm) / 7);
  }

  [class~=pt-1-7],
:root [sm~=pt-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-sm) / 7);
  }

  [class~=pb-1-7],
:root [sm~=pb-1-7] {
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-sm) / 7);
  }

  [class~=pl-1-7],
:root [sm~=pl-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-sm) / 7);
  }

  [class~=pr-1-7],
:root [sm~=pr-1-7] {
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-sm) / 7);
  }

  [class~=px-1-7],
:root [sm~=px-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-sm) / 7);
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-sm) / 7);
  }

  [class~=py-1-7],
:root [sm~=py-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-sm) / 7);
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-sm) / 7);
  }

  [class~=h-1-7],
:root [sm~=h-1-7] {
    height: calc(28px / 7);
    height: calc(var(--spacer-sm) / 7);
  }

  [class~=w-1-7],
:root [sm~=w-1-7] {
    width: calc(28px / 7);
    width: calc(var(--spacer-sm) / 7);
  }

  [class~=m-0],
:root [sm~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [sm~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [sm~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [sm~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [sm~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [sm~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [sm~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [sm~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [sm~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [sm~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [sm~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [sm~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [sm~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [sm~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [sm~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [sm~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [sm~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-sm) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-sm) * -1);
  }
  [class~=gutter] > *,
:root [sm~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-sm) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-sm) * 1);
  }

  [class~=gutter-1-2],
:root [sm~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-sm) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-sm) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [sm~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-sm) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-sm) * 0.5);
  }

  [class~=row-12],
:root [sm~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [sm~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [sm~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [sm~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [sm~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [sm~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [sm~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [sm~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [sm~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [sm~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [sm~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [sm~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [sm~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [sm~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [sm~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [sm~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [sm~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [sm~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [sm~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [sm~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [sm~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [sm~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [sm~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [sm~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [sm~=row],
:root [sm~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [sm~=row] > *,
:root [sm~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [sm~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [sm~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [sm~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [sm~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [sm~=row][sm~=v-center], :root [sm~=column][sm~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [sm~=row][sm~=v-start], :root [sm~=column][sm~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [sm~=row][sm~=v-end], :root [sm~=column][sm~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [sm~=row][sm~=v-stretch], :root [sm~=column][sm~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [sm~=row][sm~=h-center], :root [sm~=column][sm~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [sm~=row][sm~=h-start], :root [sm~=column][sm~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [sm~=row][sm~=h-end], :root [sm~=column][sm~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [sm~=row][sm~=h-spacein], :root [sm~=column][sm~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [sm~=row][sm~=h-spaceout], :root [sm~=column][sm~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [sm~=row] > [sm~=v-self-center], :root [sm~=column] > [sm~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [sm~=row] > [sm~=v-self-start], :root [sm~=column] > [sm~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [sm~=row] > [sm~=v-self-end], :root [sm~=column] > [sm~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [sm~=row] > [sm~=v-self-stretch], :root [sm~=column] > [sm~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [sm~=row] > [sm~=v-self-selfstart], :root [sm~=column] > [sm~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [sm~=row] > [sm~=v-self-selfend], :root [sm~=column] > [sm~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [sm~=row] > [sm~=h-self-center], :root [sm~=column] > [sm~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [sm~=row] > [sm~=h-self-start], :root [sm~=column] > [sm~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [sm~=row] > [sm~=h-self-end], :root [sm~=column] > [sm~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [sm~=row] > [sm~=h-self-stretch], :root [sm~=column] > [sm~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [sm~=row] > [sm~=h-self-selfstart], :root [sm~=column] > [sm~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [sm~=row] > [sm~=h-self-selfend], :root [sm~=column] > [sm~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [sm~=row] > [sm~=h-self-left], :root [sm~=column] > [sm~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [sm~=row] > [sm~=h-self-right], :root [sm~=column] > [sm~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-sm-1 {
    flex-grow: 1;
  }

  .flex-grow-sm-2 {
    flex-grow: 2;
  }

  .flex-grow-sm-3 {
    flex-grow: 3;
  }

  .flex-grow-sm-4 {
    flex-grow: 4;
  }

  .flex-grow-sm-5 {
    flex-grow: 5;
  }

  .flex-grow-sm-6 {
    flex-grow: 6;
  }

  .flex-grow-sm-7 {
    flex-grow: 7;
  }

  .flex-grow-sm-8 {
    flex-grow: 8;
  }

  .flex-grow-sm-9 {
    flex-grow: 9;
  }

  .flex-grow-sm-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [sm*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [sm*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [sm*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [sm*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [sm*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [sm*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [sm*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [sm*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [sm*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [sm*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [sm*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [sm*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [sm*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [sm*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [sm*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [sm*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [sm*=bottom-inherit] {
    bottom: inherit;
  }

  [sm*=text-center] {
    text-align: center;
  }

  [sm*=text-left] {
    text-align: left;
  }

  [sm*=text-right] {
    text-align: right;
  }

  [sm*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  [class~=m-1-1],
:root [sm-l~=m-1-1] {
    margin: calc(24px * 1);
    margin: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mt-1-1],
:root [sm-l~=mt-1-1] {
    margin-top: calc(24px * 1);
    margin-top: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mb-1-1],
:root [sm-l~=mb-1-1] {
    margin-bottom: calc(24px * 1);
    margin-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=ml-1-1],
:root [sm-l~=ml-1-1] {
    margin-left: calc(24px * 1);
    margin-left: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mr-1-1],
:root [sm-l~=mr-1-1] {
    margin-right: calc(24px * 1);
    margin-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=mx-1-1],
:root [sm-l~=mx-1-1] {
    margin-left: calc(24px * 1);
    margin-left: calc(var(--spacer-sm-l) * 1);
    margin-right: calc(24px * 1);
    margin-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=my-1-1],
:root [sm-l~=my-1-1] {
    margin-top: calc(24px * 1);
    margin-top: calc(var(--spacer-sm-l) * 1);
    margin-bottom: calc(24px * 1);
    margin-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=p-1-1],
:root [sm-l~=p-1-1] {
    padding: calc(24px * 1);
    padding: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pt-1-1],
:root [sm-l~=pt-1-1] {
    padding-top: calc(24px * 1);
    padding-top: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pb-1-1],
:root [sm-l~=pb-1-1] {
    padding-bottom: calc(24px * 1);
    padding-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pl-1-1],
:root [sm-l~=pl-1-1] {
    padding-left: calc(24px * 1);
    padding-left: calc(var(--spacer-sm-l) * 1);
  }

  [class~=pr-1-1],
:root [sm-l~=pr-1-1] {
    padding-right: calc(24px * 1);
    padding-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=px-1-1],
:root [sm-l~=px-1-1] {
    padding-left: calc(24px * 1);
    padding-left: calc(var(--spacer-sm-l) * 1);
    padding-right: calc(24px * 1);
    padding-right: calc(var(--spacer-sm-l) * 1);
  }

  [class~=py-1-1],
:root [sm-l~=py-1-1] {
    padding-top: calc(24px * 1);
    padding-top: calc(var(--spacer-sm-l) * 1);
    padding-bottom: calc(24px * 1);
    padding-bottom: calc(var(--spacer-sm-l) * 1);
  }

  [class~=h-1-1],
:root [sm-l~=h-1-1] {
    height: calc(24px * 1);
    height: calc(var(--spacer-sm-l) * 1);
  }

  [class~=w-1-1],
:root [sm-l~=w-1-1] {
    width: calc(24px * 1);
    width: calc(var(--spacer-sm-l) * 1);
  }

  [class~=m-2-1],
:root [sm-l~=m-2-1] {
    margin: calc(24px * 2);
    margin: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mt-2-1],
:root [sm-l~=mt-2-1] {
    margin-top: calc(24px * 2);
    margin-top: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mb-2-1],
:root [sm-l~=mb-2-1] {
    margin-bottom: calc(24px * 2);
    margin-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=ml-2-1],
:root [sm-l~=ml-2-1] {
    margin-left: calc(24px * 2);
    margin-left: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mr-2-1],
:root [sm-l~=mr-2-1] {
    margin-right: calc(24px * 2);
    margin-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=mx-2-1],
:root [sm-l~=mx-2-1] {
    margin-left: calc(24px * 2);
    margin-left: calc(var(--spacer-sm-l) * 2);
    margin-right: calc(24px * 2);
    margin-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=my-2-1],
:root [sm-l~=my-2-1] {
    margin-top: calc(24px * 2);
    margin-top: calc(var(--spacer-sm-l) * 2);
    margin-bottom: calc(24px * 2);
    margin-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=p-2-1],
:root [sm-l~=p-2-1] {
    padding: calc(24px * 2);
    padding: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pt-2-1],
:root [sm-l~=pt-2-1] {
    padding-top: calc(24px * 2);
    padding-top: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pb-2-1],
:root [sm-l~=pb-2-1] {
    padding-bottom: calc(24px * 2);
    padding-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pl-2-1],
:root [sm-l~=pl-2-1] {
    padding-left: calc(24px * 2);
    padding-left: calc(var(--spacer-sm-l) * 2);
  }

  [class~=pr-2-1],
:root [sm-l~=pr-2-1] {
    padding-right: calc(24px * 2);
    padding-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=px-2-1],
:root [sm-l~=px-2-1] {
    padding-left: calc(24px * 2);
    padding-left: calc(var(--spacer-sm-l) * 2);
    padding-right: calc(24px * 2);
    padding-right: calc(var(--spacer-sm-l) * 2);
  }

  [class~=py-2-1],
:root [sm-l~=py-2-1] {
    padding-top: calc(24px * 2);
    padding-top: calc(var(--spacer-sm-l) * 2);
    padding-bottom: calc(24px * 2);
    padding-bottom: calc(var(--spacer-sm-l) * 2);
  }

  [class~=h-2-1],
:root [sm-l~=h-2-1] {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
  }

  [class~=w-2-1],
:root [sm-l~=w-2-1] {
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
  }

  [class~=m-3-1],
:root [sm-l~=m-3-1] {
    margin: calc(24px * 3);
    margin: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mt-3-1],
:root [sm-l~=mt-3-1] {
    margin-top: calc(24px * 3);
    margin-top: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mb-3-1],
:root [sm-l~=mb-3-1] {
    margin-bottom: calc(24px * 3);
    margin-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=ml-3-1],
:root [sm-l~=ml-3-1] {
    margin-left: calc(24px * 3);
    margin-left: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mr-3-1],
:root [sm-l~=mr-3-1] {
    margin-right: calc(24px * 3);
    margin-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=mx-3-1],
:root [sm-l~=mx-3-1] {
    margin-left: calc(24px * 3);
    margin-left: calc(var(--spacer-sm-l) * 3);
    margin-right: calc(24px * 3);
    margin-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=my-3-1],
:root [sm-l~=my-3-1] {
    margin-top: calc(24px * 3);
    margin-top: calc(var(--spacer-sm-l) * 3);
    margin-bottom: calc(24px * 3);
    margin-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=p-3-1],
:root [sm-l~=p-3-1] {
    padding: calc(24px * 3);
    padding: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pt-3-1],
:root [sm-l~=pt-3-1] {
    padding-top: calc(24px * 3);
    padding-top: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pb-3-1],
:root [sm-l~=pb-3-1] {
    padding-bottom: calc(24px * 3);
    padding-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pl-3-1],
:root [sm-l~=pl-3-1] {
    padding-left: calc(24px * 3);
    padding-left: calc(var(--spacer-sm-l) * 3);
  }

  [class~=pr-3-1],
:root [sm-l~=pr-3-1] {
    padding-right: calc(24px * 3);
    padding-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=px-3-1],
:root [sm-l~=px-3-1] {
    padding-left: calc(24px * 3);
    padding-left: calc(var(--spacer-sm-l) * 3);
    padding-right: calc(24px * 3);
    padding-right: calc(var(--spacer-sm-l) * 3);
  }

  [class~=py-3-1],
:root [sm-l~=py-3-1] {
    padding-top: calc(24px * 3);
    padding-top: calc(var(--spacer-sm-l) * 3);
    padding-bottom: calc(24px * 3);
    padding-bottom: calc(var(--spacer-sm-l) * 3);
  }

  [class~=h-3-1],
:root [sm-l~=h-3-1] {
    height: calc(24px * 3);
    height: calc(var(--spacer-sm-l) * 3);
  }

  [class~=w-3-1],
:root [sm-l~=w-3-1] {
    width: calc(24px * 3);
    width: calc(var(--spacer-sm-l) * 3);
  }

  [class~=m-4-1],
:root [sm-l~=m-4-1] {
    margin: calc(24px * 4);
    margin: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mt-4-1],
:root [sm-l~=mt-4-1] {
    margin-top: calc(24px * 4);
    margin-top: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mb-4-1],
:root [sm-l~=mb-4-1] {
    margin-bottom: calc(24px * 4);
    margin-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=ml-4-1],
:root [sm-l~=ml-4-1] {
    margin-left: calc(24px * 4);
    margin-left: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mr-4-1],
:root [sm-l~=mr-4-1] {
    margin-right: calc(24px * 4);
    margin-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=mx-4-1],
:root [sm-l~=mx-4-1] {
    margin-left: calc(24px * 4);
    margin-left: calc(var(--spacer-sm-l) * 4);
    margin-right: calc(24px * 4);
    margin-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=my-4-1],
:root [sm-l~=my-4-1] {
    margin-top: calc(24px * 4);
    margin-top: calc(var(--spacer-sm-l) * 4);
    margin-bottom: calc(24px * 4);
    margin-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=p-4-1],
:root [sm-l~=p-4-1] {
    padding: calc(24px * 4);
    padding: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pt-4-1],
:root [sm-l~=pt-4-1] {
    padding-top: calc(24px * 4);
    padding-top: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pb-4-1],
:root [sm-l~=pb-4-1] {
    padding-bottom: calc(24px * 4);
    padding-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pl-4-1],
:root [sm-l~=pl-4-1] {
    padding-left: calc(24px * 4);
    padding-left: calc(var(--spacer-sm-l) * 4);
  }

  [class~=pr-4-1],
:root [sm-l~=pr-4-1] {
    padding-right: calc(24px * 4);
    padding-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=px-4-1],
:root [sm-l~=px-4-1] {
    padding-left: calc(24px * 4);
    padding-left: calc(var(--spacer-sm-l) * 4);
    padding-right: calc(24px * 4);
    padding-right: calc(var(--spacer-sm-l) * 4);
  }

  [class~=py-4-1],
:root [sm-l~=py-4-1] {
    padding-top: calc(24px * 4);
    padding-top: calc(var(--spacer-sm-l) * 4);
    padding-bottom: calc(24px * 4);
    padding-bottom: calc(var(--spacer-sm-l) * 4);
  }

  [class~=h-4-1],
:root [sm-l~=h-4-1] {
    height: calc(24px * 4);
    height: calc(var(--spacer-sm-l) * 4);
  }

  [class~=w-4-1],
:root [sm-l~=w-4-1] {
    width: calc(24px * 4);
    width: calc(var(--spacer-sm-l) * 4);
  }

  [class~=m-5-1],
:root [sm-l~=m-5-1] {
    margin: calc(24px * 5);
    margin: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mt-5-1],
:root [sm-l~=mt-5-1] {
    margin-top: calc(24px * 5);
    margin-top: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mb-5-1],
:root [sm-l~=mb-5-1] {
    margin-bottom: calc(24px * 5);
    margin-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=ml-5-1],
:root [sm-l~=ml-5-1] {
    margin-left: calc(24px * 5);
    margin-left: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mr-5-1],
:root [sm-l~=mr-5-1] {
    margin-right: calc(24px * 5);
    margin-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=mx-5-1],
:root [sm-l~=mx-5-1] {
    margin-left: calc(24px * 5);
    margin-left: calc(var(--spacer-sm-l) * 5);
    margin-right: calc(24px * 5);
    margin-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=my-5-1],
:root [sm-l~=my-5-1] {
    margin-top: calc(24px * 5);
    margin-top: calc(var(--spacer-sm-l) * 5);
    margin-bottom: calc(24px * 5);
    margin-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=p-5-1],
:root [sm-l~=p-5-1] {
    padding: calc(24px * 5);
    padding: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pt-5-1],
:root [sm-l~=pt-5-1] {
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pb-5-1],
:root [sm-l~=pb-5-1] {
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pl-5-1],
:root [sm-l~=pl-5-1] {
    padding-left: calc(24px * 5);
    padding-left: calc(var(--spacer-sm-l) * 5);
  }

  [class~=pr-5-1],
:root [sm-l~=pr-5-1] {
    padding-right: calc(24px * 5);
    padding-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=px-5-1],
:root [sm-l~=px-5-1] {
    padding-left: calc(24px * 5);
    padding-left: calc(var(--spacer-sm-l) * 5);
    padding-right: calc(24px * 5);
    padding-right: calc(var(--spacer-sm-l) * 5);
  }

  [class~=py-5-1],
:root [sm-l~=py-5-1] {
    padding-top: calc(24px * 5);
    padding-top: calc(var(--spacer-sm-l) * 5);
    padding-bottom: calc(24px * 5);
    padding-bottom: calc(var(--spacer-sm-l) * 5);
  }

  [class~=h-5-1],
:root [sm-l~=h-5-1] {
    height: calc(24px * 5);
    height: calc(var(--spacer-sm-l) * 5);
  }

  [class~=w-5-1],
:root [sm-l~=w-5-1] {
    width: calc(24px * 5);
    width: calc(var(--spacer-sm-l) * 5);
  }

  [class~=m-6-1],
:root [sm-l~=m-6-1] {
    margin: calc(24px * 6);
    margin: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mt-6-1],
:root [sm-l~=mt-6-1] {
    margin-top: calc(24px * 6);
    margin-top: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mb-6-1],
:root [sm-l~=mb-6-1] {
    margin-bottom: calc(24px * 6);
    margin-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=ml-6-1],
:root [sm-l~=ml-6-1] {
    margin-left: calc(24px * 6);
    margin-left: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mr-6-1],
:root [sm-l~=mr-6-1] {
    margin-right: calc(24px * 6);
    margin-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=mx-6-1],
:root [sm-l~=mx-6-1] {
    margin-left: calc(24px * 6);
    margin-left: calc(var(--spacer-sm-l) * 6);
    margin-right: calc(24px * 6);
    margin-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=my-6-1],
:root [sm-l~=my-6-1] {
    margin-top: calc(24px * 6);
    margin-top: calc(var(--spacer-sm-l) * 6);
    margin-bottom: calc(24px * 6);
    margin-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=p-6-1],
:root [sm-l~=p-6-1] {
    padding: calc(24px * 6);
    padding: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pt-6-1],
:root [sm-l~=pt-6-1] {
    padding-top: calc(24px * 6);
    padding-top: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pb-6-1],
:root [sm-l~=pb-6-1] {
    padding-bottom: calc(24px * 6);
    padding-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pl-6-1],
:root [sm-l~=pl-6-1] {
    padding-left: calc(24px * 6);
    padding-left: calc(var(--spacer-sm-l) * 6);
  }

  [class~=pr-6-1],
:root [sm-l~=pr-6-1] {
    padding-right: calc(24px * 6);
    padding-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=px-6-1],
:root [sm-l~=px-6-1] {
    padding-left: calc(24px * 6);
    padding-left: calc(var(--spacer-sm-l) * 6);
    padding-right: calc(24px * 6);
    padding-right: calc(var(--spacer-sm-l) * 6);
  }

  [class~=py-6-1],
:root [sm-l~=py-6-1] {
    padding-top: calc(24px * 6);
    padding-top: calc(var(--spacer-sm-l) * 6);
    padding-bottom: calc(24px * 6);
    padding-bottom: calc(var(--spacer-sm-l) * 6);
  }

  [class~=h-6-1],
:root [sm-l~=h-6-1] {
    height: calc(24px * 6);
    height: calc(var(--spacer-sm-l) * 6);
  }

  [class~=w-6-1],
:root [sm-l~=w-6-1] {
    width: calc(24px * 6);
    width: calc(var(--spacer-sm-l) * 6);
  }

  [class~=m-7-1],
:root [sm-l~=m-7-1] {
    margin: calc(24px * 7);
    margin: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mt-7-1],
:root [sm-l~=mt-7-1] {
    margin-top: calc(24px * 7);
    margin-top: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mb-7-1],
:root [sm-l~=mb-7-1] {
    margin-bottom: calc(24px * 7);
    margin-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=ml-7-1],
:root [sm-l~=ml-7-1] {
    margin-left: calc(24px * 7);
    margin-left: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mr-7-1],
:root [sm-l~=mr-7-1] {
    margin-right: calc(24px * 7);
    margin-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=mx-7-1],
:root [sm-l~=mx-7-1] {
    margin-left: calc(24px * 7);
    margin-left: calc(var(--spacer-sm-l) * 7);
    margin-right: calc(24px * 7);
    margin-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=my-7-1],
:root [sm-l~=my-7-1] {
    margin-top: calc(24px * 7);
    margin-top: calc(var(--spacer-sm-l) * 7);
    margin-bottom: calc(24px * 7);
    margin-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=p-7-1],
:root [sm-l~=p-7-1] {
    padding: calc(24px * 7);
    padding: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pt-7-1],
:root [sm-l~=pt-7-1] {
    padding-top: calc(24px * 7);
    padding-top: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pb-7-1],
:root [sm-l~=pb-7-1] {
    padding-bottom: calc(24px * 7);
    padding-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pl-7-1],
:root [sm-l~=pl-7-1] {
    padding-left: calc(24px * 7);
    padding-left: calc(var(--spacer-sm-l) * 7);
  }

  [class~=pr-7-1],
:root [sm-l~=pr-7-1] {
    padding-right: calc(24px * 7);
    padding-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=px-7-1],
:root [sm-l~=px-7-1] {
    padding-left: calc(24px * 7);
    padding-left: calc(var(--spacer-sm-l) * 7);
    padding-right: calc(24px * 7);
    padding-right: calc(var(--spacer-sm-l) * 7);
  }

  [class~=py-7-1],
:root [sm-l~=py-7-1] {
    padding-top: calc(24px * 7);
    padding-top: calc(var(--spacer-sm-l) * 7);
    padding-bottom: calc(24px * 7);
    padding-bottom: calc(var(--spacer-sm-l) * 7);
  }

  [class~=h-7-1],
:root [sm-l~=h-7-1] {
    height: calc(24px * 7);
    height: calc(var(--spacer-sm-l) * 7);
  }

  [class~=w-7-1],
:root [sm-l~=w-7-1] {
    width: calc(24px * 7);
    width: calc(var(--spacer-sm-l) * 7);
  }

  [class~=m-8-1],
:root [sm-l~=m-8-1] {
    margin: calc(24px * 8);
    margin: calc(var(--spacer-sm-l) * 8);
  }

  [class~=mt-8-1],
:root [sm-l~=mt-8-1] {
    margin-top: calc(24px * 8);
    margin-top: calc(var(--spacer-sm-l) * 8);
  }

  [class~=mb-8-1],
:root [sm-l~=mb-8-1] {
    margin-bottom: calc(24px * 8);
    margin-bottom: calc(var(--spacer-sm-l) * 8);
  }

  [class~=ml-8-1],
:root [sm-l~=ml-8-1] {
    margin-left: calc(24px * 8);
    margin-left: calc(var(--spacer-sm-l) * 8);
  }

  [class~=mr-8-1],
:root [sm-l~=mr-8-1] {
    margin-right: calc(24px * 8);
    margin-right: calc(var(--spacer-sm-l) * 8);
  }

  [class~=mx-8-1],
:root [sm-l~=mx-8-1] {
    margin-left: calc(24px * 8);
    margin-left: calc(var(--spacer-sm-l) * 8);
    margin-right: calc(24px * 8);
    margin-right: calc(var(--spacer-sm-l) * 8);
  }

  [class~=my-8-1],
:root [sm-l~=my-8-1] {
    margin-top: calc(24px * 8);
    margin-top: calc(var(--spacer-sm-l) * 8);
    margin-bottom: calc(24px * 8);
    margin-bottom: calc(var(--spacer-sm-l) * 8);
  }

  [class~=p-8-1],
:root [sm-l~=p-8-1] {
    padding: calc(24px * 8);
    padding: calc(var(--spacer-sm-l) * 8);
  }

  [class~=pt-8-1],
:root [sm-l~=pt-8-1] {
    padding-top: calc(24px * 8);
    padding-top: calc(var(--spacer-sm-l) * 8);
  }

  [class~=pb-8-1],
:root [sm-l~=pb-8-1] {
    padding-bottom: calc(24px * 8);
    padding-bottom: calc(var(--spacer-sm-l) * 8);
  }

  [class~=pl-8-1],
:root [sm-l~=pl-8-1] {
    padding-left: calc(24px * 8);
    padding-left: calc(var(--spacer-sm-l) * 8);
  }

  [class~=pr-8-1],
:root [sm-l~=pr-8-1] {
    padding-right: calc(24px * 8);
    padding-right: calc(var(--spacer-sm-l) * 8);
  }

  [class~=px-8-1],
:root [sm-l~=px-8-1] {
    padding-left: calc(24px * 8);
    padding-left: calc(var(--spacer-sm-l) * 8);
    padding-right: calc(24px * 8);
    padding-right: calc(var(--spacer-sm-l) * 8);
  }

  [class~=py-8-1],
:root [sm-l~=py-8-1] {
    padding-top: calc(24px * 8);
    padding-top: calc(var(--spacer-sm-l) * 8);
    padding-bottom: calc(24px * 8);
    padding-bottom: calc(var(--spacer-sm-l) * 8);
  }

  [class~=h-8-1],
:root [sm-l~=h-8-1] {
    height: calc(24px * 8);
    height: calc(var(--spacer-sm-l) * 8);
  }

  [class~=w-8-1],
:root [sm-l~=w-8-1] {
    width: calc(24px * 8);
    width: calc(var(--spacer-sm-l) * 8);
  }

  [class~=m-1-2],
:root [sm-l~=m-1-2] {
    margin: calc(24px / 2);
    margin: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mt-1-2],
:root [sm-l~=mt-1-2] {
    margin-top: calc(24px / 2);
    margin-top: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mb-1-2],
:root [sm-l~=mb-1-2] {
    margin-bottom: calc(24px / 2);
    margin-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=ml-1-2],
:root [sm-l~=ml-1-2] {
    margin-left: calc(24px / 2);
    margin-left: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mr-1-2],
:root [sm-l~=mr-1-2] {
    margin-right: calc(24px / 2);
    margin-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=mx-1-2],
:root [sm-l~=mx-1-2] {
    margin-left: calc(24px / 2);
    margin-left: calc(var(--spacer-sm-l) / 2);
    margin-right: calc(24px / 2);
    margin-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=my-1-2],
:root [sm-l~=my-1-2] {
    margin-top: calc(24px / 2);
    margin-top: calc(var(--spacer-sm-l) / 2);
    margin-bottom: calc(24px / 2);
    margin-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=p-1-2],
:root [sm-l~=p-1-2] {
    padding: calc(24px / 2);
    padding: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pt-1-2],
:root [sm-l~=pt-1-2] {
    padding-top: calc(24px / 2);
    padding-top: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pb-1-2],
:root [sm-l~=pb-1-2] {
    padding-bottom: calc(24px / 2);
    padding-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pl-1-2],
:root [sm-l~=pl-1-2] {
    padding-left: calc(24px / 2);
    padding-left: calc(var(--spacer-sm-l) / 2);
  }

  [class~=pr-1-2],
:root [sm-l~=pr-1-2] {
    padding-right: calc(24px / 2);
    padding-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=px-1-2],
:root [sm-l~=px-1-2] {
    padding-left: calc(24px / 2);
    padding-left: calc(var(--spacer-sm-l) / 2);
    padding-right: calc(24px / 2);
    padding-right: calc(var(--spacer-sm-l) / 2);
  }

  [class~=py-1-2],
:root [sm-l~=py-1-2] {
    padding-top: calc(24px / 2);
    padding-top: calc(var(--spacer-sm-l) / 2);
    padding-bottom: calc(24px / 2);
    padding-bottom: calc(var(--spacer-sm-l) / 2);
  }

  [class~=h-1-2],
:root [sm-l~=h-1-2] {
    height: calc(24px / 2);
    height: calc(var(--spacer-sm-l) / 2);
  }

  [class~=w-1-2],
:root [sm-l~=w-1-2] {
    width: calc(24px / 2);
    width: calc(var(--spacer-sm-l) / 2);
  }

  [class~=m-1-3],
:root [sm-l~=m-1-3] {
    margin: calc(24px / 3);
    margin: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mt-1-3],
:root [sm-l~=mt-1-3] {
    margin-top: calc(24px / 3);
    margin-top: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mb-1-3],
:root [sm-l~=mb-1-3] {
    margin-bottom: calc(24px / 3);
    margin-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=ml-1-3],
:root [sm-l~=ml-1-3] {
    margin-left: calc(24px / 3);
    margin-left: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mr-1-3],
:root [sm-l~=mr-1-3] {
    margin-right: calc(24px / 3);
    margin-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=mx-1-3],
:root [sm-l~=mx-1-3] {
    margin-left: calc(24px / 3);
    margin-left: calc(var(--spacer-sm-l) / 3);
    margin-right: calc(24px / 3);
    margin-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=my-1-3],
:root [sm-l~=my-1-3] {
    margin-top: calc(24px / 3);
    margin-top: calc(var(--spacer-sm-l) / 3);
    margin-bottom: calc(24px / 3);
    margin-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=p-1-3],
:root [sm-l~=p-1-3] {
    padding: calc(24px / 3);
    padding: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pt-1-3],
:root [sm-l~=pt-1-3] {
    padding-top: calc(24px / 3);
    padding-top: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pb-1-3],
:root [sm-l~=pb-1-3] {
    padding-bottom: calc(24px / 3);
    padding-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pl-1-3],
:root [sm-l~=pl-1-3] {
    padding-left: calc(24px / 3);
    padding-left: calc(var(--spacer-sm-l) / 3);
  }

  [class~=pr-1-3],
:root [sm-l~=pr-1-3] {
    padding-right: calc(24px / 3);
    padding-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=px-1-3],
:root [sm-l~=px-1-3] {
    padding-left: calc(24px / 3);
    padding-left: calc(var(--spacer-sm-l) / 3);
    padding-right: calc(24px / 3);
    padding-right: calc(var(--spacer-sm-l) / 3);
  }

  [class~=py-1-3],
:root [sm-l~=py-1-3] {
    padding-top: calc(24px / 3);
    padding-top: calc(var(--spacer-sm-l) / 3);
    padding-bottom: calc(24px / 3);
    padding-bottom: calc(var(--spacer-sm-l) / 3);
  }

  [class~=h-1-3],
:root [sm-l~=h-1-3] {
    height: calc(24px / 3);
    height: calc(var(--spacer-sm-l) / 3);
  }

  [class~=w-1-3],
:root [sm-l~=w-1-3] {
    width: calc(24px / 3);
    width: calc(var(--spacer-sm-l) / 3);
  }

  [class~=m-1-4],
:root [sm-l~=m-1-4] {
    margin: calc(24px / 4);
    margin: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mt-1-4],
:root [sm-l~=mt-1-4] {
    margin-top: calc(24px / 4);
    margin-top: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mb-1-4],
:root [sm-l~=mb-1-4] {
    margin-bottom: calc(24px / 4);
    margin-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=ml-1-4],
:root [sm-l~=ml-1-4] {
    margin-left: calc(24px / 4);
    margin-left: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mr-1-4],
:root [sm-l~=mr-1-4] {
    margin-right: calc(24px / 4);
    margin-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=mx-1-4],
:root [sm-l~=mx-1-4] {
    margin-left: calc(24px / 4);
    margin-left: calc(var(--spacer-sm-l) / 4);
    margin-right: calc(24px / 4);
    margin-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=my-1-4],
:root [sm-l~=my-1-4] {
    margin-top: calc(24px / 4);
    margin-top: calc(var(--spacer-sm-l) / 4);
    margin-bottom: calc(24px / 4);
    margin-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=p-1-4],
:root [sm-l~=p-1-4] {
    padding: calc(24px / 4);
    padding: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pt-1-4],
:root [sm-l~=pt-1-4] {
    padding-top: calc(24px / 4);
    padding-top: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pb-1-4],
:root [sm-l~=pb-1-4] {
    padding-bottom: calc(24px / 4);
    padding-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pl-1-4],
:root [sm-l~=pl-1-4] {
    padding-left: calc(24px / 4);
    padding-left: calc(var(--spacer-sm-l) / 4);
  }

  [class~=pr-1-4],
:root [sm-l~=pr-1-4] {
    padding-right: calc(24px / 4);
    padding-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=px-1-4],
:root [sm-l~=px-1-4] {
    padding-left: calc(24px / 4);
    padding-left: calc(var(--spacer-sm-l) / 4);
    padding-right: calc(24px / 4);
    padding-right: calc(var(--spacer-sm-l) / 4);
  }

  [class~=py-1-4],
:root [sm-l~=py-1-4] {
    padding-top: calc(24px / 4);
    padding-top: calc(var(--spacer-sm-l) / 4);
    padding-bottom: calc(24px / 4);
    padding-bottom: calc(var(--spacer-sm-l) / 4);
  }

  [class~=h-1-4],
:root [sm-l~=h-1-4] {
    height: calc(24px / 4);
    height: calc(var(--spacer-sm-l) / 4);
  }

  [class~=w-1-4],
:root [sm-l~=w-1-4] {
    width: calc(24px / 4);
    width: calc(var(--spacer-sm-l) / 4);
  }

  [class~=m-1-5],
:root [sm-l~=m-1-5] {
    margin: calc(24px / 5);
    margin: calc(var(--spacer-sm-l) / 5);
  }

  [class~=mt-1-5],
:root [sm-l~=mt-1-5] {
    margin-top: calc(24px / 5);
    margin-top: calc(var(--spacer-sm-l) / 5);
  }

  [class~=mb-1-5],
:root [sm-l~=mb-1-5] {
    margin-bottom: calc(24px / 5);
    margin-bottom: calc(var(--spacer-sm-l) / 5);
  }

  [class~=ml-1-5],
:root [sm-l~=ml-1-5] {
    margin-left: calc(24px / 5);
    margin-left: calc(var(--spacer-sm-l) / 5);
  }

  [class~=mr-1-5],
:root [sm-l~=mr-1-5] {
    margin-right: calc(24px / 5);
    margin-right: calc(var(--spacer-sm-l) / 5);
  }

  [class~=mx-1-5],
:root [sm-l~=mx-1-5] {
    margin-left: calc(24px / 5);
    margin-left: calc(var(--spacer-sm-l) / 5);
    margin-right: calc(24px / 5);
    margin-right: calc(var(--spacer-sm-l) / 5);
  }

  [class~=my-1-5],
:root [sm-l~=my-1-5] {
    margin-top: calc(24px / 5);
    margin-top: calc(var(--spacer-sm-l) / 5);
    margin-bottom: calc(24px / 5);
    margin-bottom: calc(var(--spacer-sm-l) / 5);
  }

  [class~=p-1-5],
:root [sm-l~=p-1-5] {
    padding: calc(24px / 5);
    padding: calc(var(--spacer-sm-l) / 5);
  }

  [class~=pt-1-5],
:root [sm-l~=pt-1-5] {
    padding-top: calc(24px / 5);
    padding-top: calc(var(--spacer-sm-l) / 5);
  }

  [class~=pb-1-5],
:root [sm-l~=pb-1-5] {
    padding-bottom: calc(24px / 5);
    padding-bottom: calc(var(--spacer-sm-l) / 5);
  }

  [class~=pl-1-5],
:root [sm-l~=pl-1-5] {
    padding-left: calc(24px / 5);
    padding-left: calc(var(--spacer-sm-l) / 5);
  }

  [class~=pr-1-5],
:root [sm-l~=pr-1-5] {
    padding-right: calc(24px / 5);
    padding-right: calc(var(--spacer-sm-l) / 5);
  }

  [class~=px-1-5],
:root [sm-l~=px-1-5] {
    padding-left: calc(24px / 5);
    padding-left: calc(var(--spacer-sm-l) / 5);
    padding-right: calc(24px / 5);
    padding-right: calc(var(--spacer-sm-l) / 5);
  }

  [class~=py-1-5],
:root [sm-l~=py-1-5] {
    padding-top: calc(24px / 5);
    padding-top: calc(var(--spacer-sm-l) / 5);
    padding-bottom: calc(24px / 5);
    padding-bottom: calc(var(--spacer-sm-l) / 5);
  }

  [class~=h-1-5],
:root [sm-l~=h-1-5] {
    height: calc(24px / 5);
    height: calc(var(--spacer-sm-l) / 5);
  }

  [class~=w-1-5],
:root [sm-l~=w-1-5] {
    width: calc(24px / 5);
    width: calc(var(--spacer-sm-l) / 5);
  }

  [class~=m-1-6],
:root [sm-l~=m-1-6] {
    margin: calc(24px / 6);
    margin: calc(var(--spacer-sm-l) / 6);
  }

  [class~=mt-1-6],
:root [sm-l~=mt-1-6] {
    margin-top: calc(24px / 6);
    margin-top: calc(var(--spacer-sm-l) / 6);
  }

  [class~=mb-1-6],
:root [sm-l~=mb-1-6] {
    margin-bottom: calc(24px / 6);
    margin-bottom: calc(var(--spacer-sm-l) / 6);
  }

  [class~=ml-1-6],
:root [sm-l~=ml-1-6] {
    margin-left: calc(24px / 6);
    margin-left: calc(var(--spacer-sm-l) / 6);
  }

  [class~=mr-1-6],
:root [sm-l~=mr-1-6] {
    margin-right: calc(24px / 6);
    margin-right: calc(var(--spacer-sm-l) / 6);
  }

  [class~=mx-1-6],
:root [sm-l~=mx-1-6] {
    margin-left: calc(24px / 6);
    margin-left: calc(var(--spacer-sm-l) / 6);
    margin-right: calc(24px / 6);
    margin-right: calc(var(--spacer-sm-l) / 6);
  }

  [class~=my-1-6],
:root [sm-l~=my-1-6] {
    margin-top: calc(24px / 6);
    margin-top: calc(var(--spacer-sm-l) / 6);
    margin-bottom: calc(24px / 6);
    margin-bottom: calc(var(--spacer-sm-l) / 6);
  }

  [class~=p-1-6],
:root [sm-l~=p-1-6] {
    padding: calc(24px / 6);
    padding: calc(var(--spacer-sm-l) / 6);
  }

  [class~=pt-1-6],
:root [sm-l~=pt-1-6] {
    padding-top: calc(24px / 6);
    padding-top: calc(var(--spacer-sm-l) / 6);
  }

  [class~=pb-1-6],
:root [sm-l~=pb-1-6] {
    padding-bottom: calc(24px / 6);
    padding-bottom: calc(var(--spacer-sm-l) / 6);
  }

  [class~=pl-1-6],
:root [sm-l~=pl-1-6] {
    padding-left: calc(24px / 6);
    padding-left: calc(var(--spacer-sm-l) / 6);
  }

  [class~=pr-1-6],
:root [sm-l~=pr-1-6] {
    padding-right: calc(24px / 6);
    padding-right: calc(var(--spacer-sm-l) / 6);
  }

  [class~=px-1-6],
:root [sm-l~=px-1-6] {
    padding-left: calc(24px / 6);
    padding-left: calc(var(--spacer-sm-l) / 6);
    padding-right: calc(24px / 6);
    padding-right: calc(var(--spacer-sm-l) / 6);
  }

  [class~=py-1-6],
:root [sm-l~=py-1-6] {
    padding-top: calc(24px / 6);
    padding-top: calc(var(--spacer-sm-l) / 6);
    padding-bottom: calc(24px / 6);
    padding-bottom: calc(var(--spacer-sm-l) / 6);
  }

  [class~=h-1-6],
:root [sm-l~=h-1-6] {
    height: calc(24px / 6);
    height: calc(var(--spacer-sm-l) / 6);
  }

  [class~=w-1-6],
:root [sm-l~=w-1-6] {
    width: calc(24px / 6);
    width: calc(var(--spacer-sm-l) / 6);
  }

  [class~=m-1-7],
:root [sm-l~=m-1-7] {
    margin: calc(24px / 7);
    margin: calc(var(--spacer-sm-l) / 7);
  }

  [class~=mt-1-7],
:root [sm-l~=mt-1-7] {
    margin-top: calc(24px / 7);
    margin-top: calc(var(--spacer-sm-l) / 7);
  }

  [class~=mb-1-7],
:root [sm-l~=mb-1-7] {
    margin-bottom: calc(24px / 7);
    margin-bottom: calc(var(--spacer-sm-l) / 7);
  }

  [class~=ml-1-7],
:root [sm-l~=ml-1-7] {
    margin-left: calc(24px / 7);
    margin-left: calc(var(--spacer-sm-l) / 7);
  }

  [class~=mr-1-7],
:root [sm-l~=mr-1-7] {
    margin-right: calc(24px / 7);
    margin-right: calc(var(--spacer-sm-l) / 7);
  }

  [class~=mx-1-7],
:root [sm-l~=mx-1-7] {
    margin-left: calc(24px / 7);
    margin-left: calc(var(--spacer-sm-l) / 7);
    margin-right: calc(24px / 7);
    margin-right: calc(var(--spacer-sm-l) / 7);
  }

  [class~=my-1-7],
:root [sm-l~=my-1-7] {
    margin-top: calc(24px / 7);
    margin-top: calc(var(--spacer-sm-l) / 7);
    margin-bottom: calc(24px / 7);
    margin-bottom: calc(var(--spacer-sm-l) / 7);
  }

  [class~=p-1-7],
:root [sm-l~=p-1-7] {
    padding: calc(24px / 7);
    padding: calc(var(--spacer-sm-l) / 7);
  }

  [class~=pt-1-7],
:root [sm-l~=pt-1-7] {
    padding-top: calc(24px / 7);
    padding-top: calc(var(--spacer-sm-l) / 7);
  }

  [class~=pb-1-7],
:root [sm-l~=pb-1-7] {
    padding-bottom: calc(24px / 7);
    padding-bottom: calc(var(--spacer-sm-l) / 7);
  }

  [class~=pl-1-7],
:root [sm-l~=pl-1-7] {
    padding-left: calc(24px / 7);
    padding-left: calc(var(--spacer-sm-l) / 7);
  }

  [class~=pr-1-7],
:root [sm-l~=pr-1-7] {
    padding-right: calc(24px / 7);
    padding-right: calc(var(--spacer-sm-l) / 7);
  }

  [class~=px-1-7],
:root [sm-l~=px-1-7] {
    padding-left: calc(24px / 7);
    padding-left: calc(var(--spacer-sm-l) / 7);
    padding-right: calc(24px / 7);
    padding-right: calc(var(--spacer-sm-l) / 7);
  }

  [class~=py-1-7],
:root [sm-l~=py-1-7] {
    padding-top: calc(24px / 7);
    padding-top: calc(var(--spacer-sm-l) / 7);
    padding-bottom: calc(24px / 7);
    padding-bottom: calc(var(--spacer-sm-l) / 7);
  }

  [class~=h-1-7],
:root [sm-l~=h-1-7] {
    height: calc(24px / 7);
    height: calc(var(--spacer-sm-l) / 7);
  }

  [class~=w-1-7],
:root [sm-l~=w-1-7] {
    width: calc(24px / 7);
    width: calc(var(--spacer-sm-l) / 7);
  }

  [class~=m-0],
:root [sm-l~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [sm-l~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [sm-l~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [sm-l~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [sm-l~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [sm-l~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [sm-l~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [sm-l~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [sm-l~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [sm-l~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [sm-l~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [sm-l~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [sm-l~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [sm-l~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [sm-l~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [sm-l~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [sm-l~=gutter] {
    margin-left: calc(24px * -1);
    margin-left: calc(var(--gutter-sm-l) * -1);
    margin-right: calc(24px * -1);
    margin-right: calc(var(--gutter-sm-l) * -1);
  }
  [class~=gutter] > *,
:root [sm-l~=gutter] > * {
    padding-left: calc(24px * 1);
    padding-left: calc(var(--gutter-sm-l) * 1);
    padding-right: calc(24px * 1);
    padding-right: calc(var(--gutter-sm-l) * 1);
  }

  [class~=gutter-1-2],
:root [sm-l~=gutter-1-2] {
    margin-left: calc(24px * -0.5);
    margin-left: calc(var(--gutter-sm-l) * -0.5);
    margin-right: calc(24px * -0.5);
    margin-right: calc(var(--gutter-sm-l) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [sm-l~=gutter-1-2] > * {
    padding-left: calc(24px * 0.5);
    padding-left: calc(var(--gutter-sm-l) * 0.5);
    padding-right: calc(24px * 0.5);
    padding-right: calc(var(--gutter-sm-l) * 0.5);
  }

  [class~=row-12],
:root [sm-l~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [sm-l~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [sm-l~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [sm-l~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [sm-l~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [sm-l~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [sm-l~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [sm-l~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [sm-l~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [sm-l~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [sm-l~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [sm-l~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [sm-l~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [sm-l~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [sm-l~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [sm-l~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [sm-l~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [sm-l~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [sm-l~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [sm-l~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [sm-l~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [sm-l~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [sm-l~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [sm-l~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [sm-l~=row],
:root [sm-l~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [sm-l~=row] > *,
:root [sm-l~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [sm-l~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [sm-l~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [sm-l~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [sm-l~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [sm-l~=row][sm-l~=v-center], :root [sm-l~=column][sm-l~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [sm-l~=row][sm-l~=v-start], :root [sm-l~=column][sm-l~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [sm-l~=row][sm-l~=v-end], :root [sm-l~=column][sm-l~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [sm-l~=row][sm-l~=v-stretch], :root [sm-l~=column][sm-l~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [sm-l~=row][sm-l~=h-center], :root [sm-l~=column][sm-l~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [sm-l~=row][sm-l~=h-start], :root [sm-l~=column][sm-l~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [sm-l~=row][sm-l~=h-end], :root [sm-l~=column][sm-l~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [sm-l~=row][sm-l~=h-spacein], :root [sm-l~=column][sm-l~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [sm-l~=row][sm-l~=h-spaceout], :root [sm-l~=column][sm-l~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [sm-l~=row] > [sm-l~=v-self-center], :root [sm-l~=column] > [sm-l~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [sm-l~=row] > [sm-l~=v-self-start], :root [sm-l~=column] > [sm-l~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [sm-l~=row] > [sm-l~=v-self-end], :root [sm-l~=column] > [sm-l~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [sm-l~=row] > [sm-l~=v-self-stretch], :root [sm-l~=column] > [sm-l~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [sm-l~=row] > [sm-l~=v-self-selfstart], :root [sm-l~=column] > [sm-l~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [sm-l~=row] > [sm-l~=v-self-selfend], :root [sm-l~=column] > [sm-l~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [sm-l~=row] > [sm-l~=h-self-center], :root [sm-l~=column] > [sm-l~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [sm-l~=row] > [sm-l~=h-self-start], :root [sm-l~=column] > [sm-l~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [sm-l~=row] > [sm-l~=h-self-end], :root [sm-l~=column] > [sm-l~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [sm-l~=row] > [sm-l~=h-self-stretch], :root [sm-l~=column] > [sm-l~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [sm-l~=row] > [sm-l~=h-self-selfstart], :root [sm-l~=column] > [sm-l~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [sm-l~=row] > [sm-l~=h-self-selfend], :root [sm-l~=column] > [sm-l~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [sm-l~=row] > [sm-l~=h-self-left], :root [sm-l~=column] > [sm-l~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [sm-l~=row] > [sm-l~=h-self-right], :root [sm-l~=column] > [sm-l~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-sm-l-1 {
    flex-grow: 1;
  }

  .flex-grow-sm-l-2 {
    flex-grow: 2;
  }

  .flex-grow-sm-l-3 {
    flex-grow: 3;
  }

  .flex-grow-sm-l-4 {
    flex-grow: 4;
  }

  .flex-grow-sm-l-5 {
    flex-grow: 5;
  }

  .flex-grow-sm-l-6 {
    flex-grow: 6;
  }

  .flex-grow-sm-l-7 {
    flex-grow: 7;
  }

  .flex-grow-sm-l-8 {
    flex-grow: 8;
  }

  .flex-grow-sm-l-9 {
    flex-grow: 9;
  }

  .flex-grow-sm-l-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [sm-l*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [sm-l*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [sm-l*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [sm-l*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [sm-l*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [sm-l*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [sm-l*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [sm-l*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [sm-l*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [sm-l*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [sm-l*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [sm-l*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [sm-l*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [sm-l*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [sm-l*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [sm-l*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [sm-l*=bottom-inherit] {
    bottom: inherit;
  }

  [sm-l*=text-center] {
    text-align: center;
  }

  [sm-l*=text-left] {
    text-align: left;
  }

  [sm-l*=text-right] {
    text-align: right;
  }

  [sm-l*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  [class~=m-1-1],
:root [md~=m-1-1] {
    margin: calc(28px * 1);
    margin: calc(var(--spacer-md) * 1);
  }

  [class~=mt-1-1],
:root [md~=mt-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-md) * 1);
  }

  [class~=mb-1-1],
:root [md~=mb-1-1] {
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=ml-1-1],
:root [md~=ml-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-md) * 1);
  }

  [class~=mr-1-1],
:root [md~=mr-1-1] {
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-md) * 1);
  }

  [class~=mx-1-1],
:root [md~=mx-1-1] {
    margin-left: calc(28px * 1);
    margin-left: calc(var(--spacer-md) * 1);
    margin-right: calc(28px * 1);
    margin-right: calc(var(--spacer-md) * 1);
  }

  [class~=my-1-1],
:root [md~=my-1-1] {
    margin-top: calc(28px * 1);
    margin-top: calc(var(--spacer-md) * 1);
    margin-bottom: calc(28px * 1);
    margin-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=p-1-1],
:root [md~=p-1-1] {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-md) * 1);
  }

  [class~=pt-1-1],
:root [md~=pt-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-md) * 1);
  }

  [class~=pb-1-1],
:root [md~=pb-1-1] {
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=pl-1-1],
:root [md~=pl-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-md) * 1);
  }

  [class~=pr-1-1],
:root [md~=pr-1-1] {
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-md) * 1);
  }

  [class~=px-1-1],
:root [md~=px-1-1] {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--spacer-md) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--spacer-md) * 1);
  }

  [class~=py-1-1],
:root [md~=py-1-1] {
    padding-top: calc(28px * 1);
    padding-top: calc(var(--spacer-md) * 1);
    padding-bottom: calc(28px * 1);
    padding-bottom: calc(var(--spacer-md) * 1);
  }

  [class~=h-1-1],
:root [md~=h-1-1] {
    height: calc(28px * 1);
    height: calc(var(--spacer-md) * 1);
  }

  [class~=w-1-1],
:root [md~=w-1-1] {
    width: calc(28px * 1);
    width: calc(var(--spacer-md) * 1);
  }

  [class~=m-2-1],
:root [md~=m-2-1] {
    margin: calc(28px * 2);
    margin: calc(var(--spacer-md) * 2);
  }

  [class~=mt-2-1],
:root [md~=mt-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-md) * 2);
  }

  [class~=mb-2-1],
:root [md~=mb-2-1] {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=ml-2-1],
:root [md~=ml-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-md) * 2);
  }

  [class~=mr-2-1],
:root [md~=mr-2-1] {
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-md) * 2);
  }

  [class~=mx-2-1],
:root [md~=mx-2-1] {
    margin-left: calc(28px * 2);
    margin-left: calc(var(--spacer-md) * 2);
    margin-right: calc(28px * 2);
    margin-right: calc(var(--spacer-md) * 2);
  }

  [class~=my-2-1],
:root [md~=my-2-1] {
    margin-top: calc(28px * 2);
    margin-top: calc(var(--spacer-md) * 2);
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=p-2-1],
:root [md~=p-2-1] {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-md) * 2);
  }

  [class~=pt-2-1],
:root [md~=pt-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-md) * 2);
  }

  [class~=pb-2-1],
:root [md~=pb-2-1] {
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=pl-2-1],
:root [md~=pl-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-md) * 2);
  }

  [class~=pr-2-1],
:root [md~=pr-2-1] {
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-md) * 2);
  }

  [class~=px-2-1],
:root [md~=px-2-1] {
    padding-left: calc(28px * 2);
    padding-left: calc(var(--spacer-md) * 2);
    padding-right: calc(28px * 2);
    padding-right: calc(var(--spacer-md) * 2);
  }

  [class~=py-2-1],
:root [md~=py-2-1] {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-md) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-md) * 2);
  }

  [class~=h-2-1],
:root [md~=h-2-1] {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
  }

  [class~=w-2-1],
:root [md~=w-2-1] {
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
  }

  [class~=m-3-1],
:root [md~=m-3-1] {
    margin: calc(28px * 3);
    margin: calc(var(--spacer-md) * 3);
  }

  [class~=mt-3-1],
:root [md~=mt-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-md) * 3);
  }

  [class~=mb-3-1],
:root [md~=mb-3-1] {
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=ml-3-1],
:root [md~=ml-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-md) * 3);
  }

  [class~=mr-3-1],
:root [md~=mr-3-1] {
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-md) * 3);
  }

  [class~=mx-3-1],
:root [md~=mx-3-1] {
    margin-left: calc(28px * 3);
    margin-left: calc(var(--spacer-md) * 3);
    margin-right: calc(28px * 3);
    margin-right: calc(var(--spacer-md) * 3);
  }

  [class~=my-3-1],
:root [md~=my-3-1] {
    margin-top: calc(28px * 3);
    margin-top: calc(var(--spacer-md) * 3);
    margin-bottom: calc(28px * 3);
    margin-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=p-3-1],
:root [md~=p-3-1] {
    padding: calc(28px * 3);
    padding: calc(var(--spacer-md) * 3);
  }

  [class~=pt-3-1],
:root [md~=pt-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-md) * 3);
  }

  [class~=pb-3-1],
:root [md~=pb-3-1] {
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=pl-3-1],
:root [md~=pl-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-md) * 3);
  }

  [class~=pr-3-1],
:root [md~=pr-3-1] {
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-md) * 3);
  }

  [class~=px-3-1],
:root [md~=px-3-1] {
    padding-left: calc(28px * 3);
    padding-left: calc(var(--spacer-md) * 3);
    padding-right: calc(28px * 3);
    padding-right: calc(var(--spacer-md) * 3);
  }

  [class~=py-3-1],
:root [md~=py-3-1] {
    padding-top: calc(28px * 3);
    padding-top: calc(var(--spacer-md) * 3);
    padding-bottom: calc(28px * 3);
    padding-bottom: calc(var(--spacer-md) * 3);
  }

  [class~=h-3-1],
:root [md~=h-3-1] {
    height: calc(28px * 3);
    height: calc(var(--spacer-md) * 3);
  }

  [class~=w-3-1],
:root [md~=w-3-1] {
    width: calc(28px * 3);
    width: calc(var(--spacer-md) * 3);
  }

  [class~=m-4-1],
:root [md~=m-4-1] {
    margin: calc(28px * 4);
    margin: calc(var(--spacer-md) * 4);
  }

  [class~=mt-4-1],
:root [md~=mt-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-md) * 4);
  }

  [class~=mb-4-1],
:root [md~=mb-4-1] {
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=ml-4-1],
:root [md~=ml-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-md) * 4);
  }

  [class~=mr-4-1],
:root [md~=mr-4-1] {
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-md) * 4);
  }

  [class~=mx-4-1],
:root [md~=mx-4-1] {
    margin-left: calc(28px * 4);
    margin-left: calc(var(--spacer-md) * 4);
    margin-right: calc(28px * 4);
    margin-right: calc(var(--spacer-md) * 4);
  }

  [class~=my-4-1],
:root [md~=my-4-1] {
    margin-top: calc(28px * 4);
    margin-top: calc(var(--spacer-md) * 4);
    margin-bottom: calc(28px * 4);
    margin-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=p-4-1],
:root [md~=p-4-1] {
    padding: calc(28px * 4);
    padding: calc(var(--spacer-md) * 4);
  }

  [class~=pt-4-1],
:root [md~=pt-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-md) * 4);
  }

  [class~=pb-4-1],
:root [md~=pb-4-1] {
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=pl-4-1],
:root [md~=pl-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-md) * 4);
  }

  [class~=pr-4-1],
:root [md~=pr-4-1] {
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-md) * 4);
  }

  [class~=px-4-1],
:root [md~=px-4-1] {
    padding-left: calc(28px * 4);
    padding-left: calc(var(--spacer-md) * 4);
    padding-right: calc(28px * 4);
    padding-right: calc(var(--spacer-md) * 4);
  }

  [class~=py-4-1],
:root [md~=py-4-1] {
    padding-top: calc(28px * 4);
    padding-top: calc(var(--spacer-md) * 4);
    padding-bottom: calc(28px * 4);
    padding-bottom: calc(var(--spacer-md) * 4);
  }

  [class~=h-4-1],
:root [md~=h-4-1] {
    height: calc(28px * 4);
    height: calc(var(--spacer-md) * 4);
  }

  [class~=w-4-1],
:root [md~=w-4-1] {
    width: calc(28px * 4);
    width: calc(var(--spacer-md) * 4);
  }

  [class~=m-5-1],
:root [md~=m-5-1] {
    margin: calc(28px * 5);
    margin: calc(var(--spacer-md) * 5);
  }

  [class~=mt-5-1],
:root [md~=mt-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-md) * 5);
  }

  [class~=mb-5-1],
:root [md~=mb-5-1] {
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=ml-5-1],
:root [md~=ml-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-md) * 5);
  }

  [class~=mr-5-1],
:root [md~=mr-5-1] {
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-md) * 5);
  }

  [class~=mx-5-1],
:root [md~=mx-5-1] {
    margin-left: calc(28px * 5);
    margin-left: calc(var(--spacer-md) * 5);
    margin-right: calc(28px * 5);
    margin-right: calc(var(--spacer-md) * 5);
  }

  [class~=my-5-1],
:root [md~=my-5-1] {
    margin-top: calc(28px * 5);
    margin-top: calc(var(--spacer-md) * 5);
    margin-bottom: calc(28px * 5);
    margin-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=p-5-1],
:root [md~=p-5-1] {
    padding: calc(28px * 5);
    padding: calc(var(--spacer-md) * 5);
  }

  [class~=pt-5-1],
:root [md~=pt-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
  }

  [class~=pb-5-1],
:root [md~=pb-5-1] {
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=pl-5-1],
:root [md~=pl-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-md) * 5);
  }

  [class~=pr-5-1],
:root [md~=pr-5-1] {
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-md) * 5);
  }

  [class~=px-5-1],
:root [md~=px-5-1] {
    padding-left: calc(28px * 5);
    padding-left: calc(var(--spacer-md) * 5);
    padding-right: calc(28px * 5);
    padding-right: calc(var(--spacer-md) * 5);
  }

  [class~=py-5-1],
:root [md~=py-5-1] {
    padding-top: calc(28px * 5);
    padding-top: calc(var(--spacer-md) * 5);
    padding-bottom: calc(28px * 5);
    padding-bottom: calc(var(--spacer-md) * 5);
  }

  [class~=h-5-1],
:root [md~=h-5-1] {
    height: calc(28px * 5);
    height: calc(var(--spacer-md) * 5);
  }

  [class~=w-5-1],
:root [md~=w-5-1] {
    width: calc(28px * 5);
    width: calc(var(--spacer-md) * 5);
  }

  [class~=m-6-1],
:root [md~=m-6-1] {
    margin: calc(28px * 6);
    margin: calc(var(--spacer-md) * 6);
  }

  [class~=mt-6-1],
:root [md~=mt-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-md) * 6);
  }

  [class~=mb-6-1],
:root [md~=mb-6-1] {
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=ml-6-1],
:root [md~=ml-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-md) * 6);
  }

  [class~=mr-6-1],
:root [md~=mr-6-1] {
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-md) * 6);
  }

  [class~=mx-6-1],
:root [md~=mx-6-1] {
    margin-left: calc(28px * 6);
    margin-left: calc(var(--spacer-md) * 6);
    margin-right: calc(28px * 6);
    margin-right: calc(var(--spacer-md) * 6);
  }

  [class~=my-6-1],
:root [md~=my-6-1] {
    margin-top: calc(28px * 6);
    margin-top: calc(var(--spacer-md) * 6);
    margin-bottom: calc(28px * 6);
    margin-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=p-6-1],
:root [md~=p-6-1] {
    padding: calc(28px * 6);
    padding: calc(var(--spacer-md) * 6);
  }

  [class~=pt-6-1],
:root [md~=pt-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-md) * 6);
  }

  [class~=pb-6-1],
:root [md~=pb-6-1] {
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=pl-6-1],
:root [md~=pl-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-md) * 6);
  }

  [class~=pr-6-1],
:root [md~=pr-6-1] {
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-md) * 6);
  }

  [class~=px-6-1],
:root [md~=px-6-1] {
    padding-left: calc(28px * 6);
    padding-left: calc(var(--spacer-md) * 6);
    padding-right: calc(28px * 6);
    padding-right: calc(var(--spacer-md) * 6);
  }

  [class~=py-6-1],
:root [md~=py-6-1] {
    padding-top: calc(28px * 6);
    padding-top: calc(var(--spacer-md) * 6);
    padding-bottom: calc(28px * 6);
    padding-bottom: calc(var(--spacer-md) * 6);
  }

  [class~=h-6-1],
:root [md~=h-6-1] {
    height: calc(28px * 6);
    height: calc(var(--spacer-md) * 6);
  }

  [class~=w-6-1],
:root [md~=w-6-1] {
    width: calc(28px * 6);
    width: calc(var(--spacer-md) * 6);
  }

  [class~=m-7-1],
:root [md~=m-7-1] {
    margin: calc(28px * 7);
    margin: calc(var(--spacer-md) * 7);
  }

  [class~=mt-7-1],
:root [md~=mt-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-md) * 7);
  }

  [class~=mb-7-1],
:root [md~=mb-7-1] {
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=ml-7-1],
:root [md~=ml-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-md) * 7);
  }

  [class~=mr-7-1],
:root [md~=mr-7-1] {
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-md) * 7);
  }

  [class~=mx-7-1],
:root [md~=mx-7-1] {
    margin-left: calc(28px * 7);
    margin-left: calc(var(--spacer-md) * 7);
    margin-right: calc(28px * 7);
    margin-right: calc(var(--spacer-md) * 7);
  }

  [class~=my-7-1],
:root [md~=my-7-1] {
    margin-top: calc(28px * 7);
    margin-top: calc(var(--spacer-md) * 7);
    margin-bottom: calc(28px * 7);
    margin-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=p-7-1],
:root [md~=p-7-1] {
    padding: calc(28px * 7);
    padding: calc(var(--spacer-md) * 7);
  }

  [class~=pt-7-1],
:root [md~=pt-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-md) * 7);
  }

  [class~=pb-7-1],
:root [md~=pb-7-1] {
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=pl-7-1],
:root [md~=pl-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-md) * 7);
  }

  [class~=pr-7-1],
:root [md~=pr-7-1] {
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-md) * 7);
  }

  [class~=px-7-1],
:root [md~=px-7-1] {
    padding-left: calc(28px * 7);
    padding-left: calc(var(--spacer-md) * 7);
    padding-right: calc(28px * 7);
    padding-right: calc(var(--spacer-md) * 7);
  }

  [class~=py-7-1],
:root [md~=py-7-1] {
    padding-top: calc(28px * 7);
    padding-top: calc(var(--spacer-md) * 7);
    padding-bottom: calc(28px * 7);
    padding-bottom: calc(var(--spacer-md) * 7);
  }

  [class~=h-7-1],
:root [md~=h-7-1] {
    height: calc(28px * 7);
    height: calc(var(--spacer-md) * 7);
  }

  [class~=w-7-1],
:root [md~=w-7-1] {
    width: calc(28px * 7);
    width: calc(var(--spacer-md) * 7);
  }

  [class~=m-8-1],
:root [md~=m-8-1] {
    margin: calc(28px * 8);
    margin: calc(var(--spacer-md) * 8);
  }

  [class~=mt-8-1],
:root [md~=mt-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-md) * 8);
  }

  [class~=mb-8-1],
:root [md~=mb-8-1] {
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-md) * 8);
  }

  [class~=ml-8-1],
:root [md~=ml-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-md) * 8);
  }

  [class~=mr-8-1],
:root [md~=mr-8-1] {
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-md) * 8);
  }

  [class~=mx-8-1],
:root [md~=mx-8-1] {
    margin-left: calc(28px * 8);
    margin-left: calc(var(--spacer-md) * 8);
    margin-right: calc(28px * 8);
    margin-right: calc(var(--spacer-md) * 8);
  }

  [class~=my-8-1],
:root [md~=my-8-1] {
    margin-top: calc(28px * 8);
    margin-top: calc(var(--spacer-md) * 8);
    margin-bottom: calc(28px * 8);
    margin-bottom: calc(var(--spacer-md) * 8);
  }

  [class~=p-8-1],
:root [md~=p-8-1] {
    padding: calc(28px * 8);
    padding: calc(var(--spacer-md) * 8);
  }

  [class~=pt-8-1],
:root [md~=pt-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-md) * 8);
  }

  [class~=pb-8-1],
:root [md~=pb-8-1] {
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-md) * 8);
  }

  [class~=pl-8-1],
:root [md~=pl-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-md) * 8);
  }

  [class~=pr-8-1],
:root [md~=pr-8-1] {
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-md) * 8);
  }

  [class~=px-8-1],
:root [md~=px-8-1] {
    padding-left: calc(28px * 8);
    padding-left: calc(var(--spacer-md) * 8);
    padding-right: calc(28px * 8);
    padding-right: calc(var(--spacer-md) * 8);
  }

  [class~=py-8-1],
:root [md~=py-8-1] {
    padding-top: calc(28px * 8);
    padding-top: calc(var(--spacer-md) * 8);
    padding-bottom: calc(28px * 8);
    padding-bottom: calc(var(--spacer-md) * 8);
  }

  [class~=h-8-1],
:root [md~=h-8-1] {
    height: calc(28px * 8);
    height: calc(var(--spacer-md) * 8);
  }

  [class~=w-8-1],
:root [md~=w-8-1] {
    width: calc(28px * 8);
    width: calc(var(--spacer-md) * 8);
  }

  [class~=m-1-2],
:root [md~=m-1-2] {
    margin: calc(28px / 2);
    margin: calc(var(--spacer-md) / 2);
  }

  [class~=mt-1-2],
:root [md~=mt-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-md) / 2);
  }

  [class~=mb-1-2],
:root [md~=mb-1-2] {
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=ml-1-2],
:root [md~=ml-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-md) / 2);
  }

  [class~=mr-1-2],
:root [md~=mr-1-2] {
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-md) / 2);
  }

  [class~=mx-1-2],
:root [md~=mx-1-2] {
    margin-left: calc(28px / 2);
    margin-left: calc(var(--spacer-md) / 2);
    margin-right: calc(28px / 2);
    margin-right: calc(var(--spacer-md) / 2);
  }

  [class~=my-1-2],
:root [md~=my-1-2] {
    margin-top: calc(28px / 2);
    margin-top: calc(var(--spacer-md) / 2);
    margin-bottom: calc(28px / 2);
    margin-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=p-1-2],
:root [md~=p-1-2] {
    padding: calc(28px / 2);
    padding: calc(var(--spacer-md) / 2);
  }

  [class~=pt-1-2],
:root [md~=pt-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-md) / 2);
  }

  [class~=pb-1-2],
:root [md~=pb-1-2] {
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=pl-1-2],
:root [md~=pl-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-md) / 2);
  }

  [class~=pr-1-2],
:root [md~=pr-1-2] {
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-md) / 2);
  }

  [class~=px-1-2],
:root [md~=px-1-2] {
    padding-left: calc(28px / 2);
    padding-left: calc(var(--spacer-md) / 2);
    padding-right: calc(28px / 2);
    padding-right: calc(var(--spacer-md) / 2);
  }

  [class~=py-1-2],
:root [md~=py-1-2] {
    padding-top: calc(28px / 2);
    padding-top: calc(var(--spacer-md) / 2);
    padding-bottom: calc(28px / 2);
    padding-bottom: calc(var(--spacer-md) / 2);
  }

  [class~=h-1-2],
:root [md~=h-1-2] {
    height: calc(28px / 2);
    height: calc(var(--spacer-md) / 2);
  }

  [class~=w-1-2],
:root [md~=w-1-2] {
    width: calc(28px / 2);
    width: calc(var(--spacer-md) / 2);
  }

  [class~=m-1-3],
:root [md~=m-1-3] {
    margin: calc(28px / 3);
    margin: calc(var(--spacer-md) / 3);
  }

  [class~=mt-1-3],
:root [md~=mt-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-md) / 3);
  }

  [class~=mb-1-3],
:root [md~=mb-1-3] {
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=ml-1-3],
:root [md~=ml-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-md) / 3);
  }

  [class~=mr-1-3],
:root [md~=mr-1-3] {
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-md) / 3);
  }

  [class~=mx-1-3],
:root [md~=mx-1-3] {
    margin-left: calc(28px / 3);
    margin-left: calc(var(--spacer-md) / 3);
    margin-right: calc(28px / 3);
    margin-right: calc(var(--spacer-md) / 3);
  }

  [class~=my-1-3],
:root [md~=my-1-3] {
    margin-top: calc(28px / 3);
    margin-top: calc(var(--spacer-md) / 3);
    margin-bottom: calc(28px / 3);
    margin-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=p-1-3],
:root [md~=p-1-3] {
    padding: calc(28px / 3);
    padding: calc(var(--spacer-md) / 3);
  }

  [class~=pt-1-3],
:root [md~=pt-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-md) / 3);
  }

  [class~=pb-1-3],
:root [md~=pb-1-3] {
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=pl-1-3],
:root [md~=pl-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-md) / 3);
  }

  [class~=pr-1-3],
:root [md~=pr-1-3] {
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-md) / 3);
  }

  [class~=px-1-3],
:root [md~=px-1-3] {
    padding-left: calc(28px / 3);
    padding-left: calc(var(--spacer-md) / 3);
    padding-right: calc(28px / 3);
    padding-right: calc(var(--spacer-md) / 3);
  }

  [class~=py-1-3],
:root [md~=py-1-3] {
    padding-top: calc(28px / 3);
    padding-top: calc(var(--spacer-md) / 3);
    padding-bottom: calc(28px / 3);
    padding-bottom: calc(var(--spacer-md) / 3);
  }

  [class~=h-1-3],
:root [md~=h-1-3] {
    height: calc(28px / 3);
    height: calc(var(--spacer-md) / 3);
  }

  [class~=w-1-3],
:root [md~=w-1-3] {
    width: calc(28px / 3);
    width: calc(var(--spacer-md) / 3);
  }

  [class~=m-1-4],
:root [md~=m-1-4] {
    margin: calc(28px / 4);
    margin: calc(var(--spacer-md) / 4);
  }

  [class~=mt-1-4],
:root [md~=mt-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-md) / 4);
  }

  [class~=mb-1-4],
:root [md~=mb-1-4] {
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=ml-1-4],
:root [md~=ml-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-md) / 4);
  }

  [class~=mr-1-4],
:root [md~=mr-1-4] {
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-md) / 4);
  }

  [class~=mx-1-4],
:root [md~=mx-1-4] {
    margin-left: calc(28px / 4);
    margin-left: calc(var(--spacer-md) / 4);
    margin-right: calc(28px / 4);
    margin-right: calc(var(--spacer-md) / 4);
  }

  [class~=my-1-4],
:root [md~=my-1-4] {
    margin-top: calc(28px / 4);
    margin-top: calc(var(--spacer-md) / 4);
    margin-bottom: calc(28px / 4);
    margin-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=p-1-4],
:root [md~=p-1-4] {
    padding: calc(28px / 4);
    padding: calc(var(--spacer-md) / 4);
  }

  [class~=pt-1-4],
:root [md~=pt-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-md) / 4);
  }

  [class~=pb-1-4],
:root [md~=pb-1-4] {
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=pl-1-4],
:root [md~=pl-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-md) / 4);
  }

  [class~=pr-1-4],
:root [md~=pr-1-4] {
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-md) / 4);
  }

  [class~=px-1-4],
:root [md~=px-1-4] {
    padding-left: calc(28px / 4);
    padding-left: calc(var(--spacer-md) / 4);
    padding-right: calc(28px / 4);
    padding-right: calc(var(--spacer-md) / 4);
  }

  [class~=py-1-4],
:root [md~=py-1-4] {
    padding-top: calc(28px / 4);
    padding-top: calc(var(--spacer-md) / 4);
    padding-bottom: calc(28px / 4);
    padding-bottom: calc(var(--spacer-md) / 4);
  }

  [class~=h-1-4],
:root [md~=h-1-4] {
    height: calc(28px / 4);
    height: calc(var(--spacer-md) / 4);
  }

  [class~=w-1-4],
:root [md~=w-1-4] {
    width: calc(28px / 4);
    width: calc(var(--spacer-md) / 4);
  }

  [class~=m-1-5],
:root [md~=m-1-5] {
    margin: calc(28px / 5);
    margin: calc(var(--spacer-md) / 5);
  }

  [class~=mt-1-5],
:root [md~=mt-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-md) / 5);
  }

  [class~=mb-1-5],
:root [md~=mb-1-5] {
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-md) / 5);
  }

  [class~=ml-1-5],
:root [md~=ml-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-md) / 5);
  }

  [class~=mr-1-5],
:root [md~=mr-1-5] {
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-md) / 5);
  }

  [class~=mx-1-5],
:root [md~=mx-1-5] {
    margin-left: calc(28px / 5);
    margin-left: calc(var(--spacer-md) / 5);
    margin-right: calc(28px / 5);
    margin-right: calc(var(--spacer-md) / 5);
  }

  [class~=my-1-5],
:root [md~=my-1-5] {
    margin-top: calc(28px / 5);
    margin-top: calc(var(--spacer-md) / 5);
    margin-bottom: calc(28px / 5);
    margin-bottom: calc(var(--spacer-md) / 5);
  }

  [class~=p-1-5],
:root [md~=p-1-5] {
    padding: calc(28px / 5);
    padding: calc(var(--spacer-md) / 5);
  }

  [class~=pt-1-5],
:root [md~=pt-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-md) / 5);
  }

  [class~=pb-1-5],
:root [md~=pb-1-5] {
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-md) / 5);
  }

  [class~=pl-1-5],
:root [md~=pl-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-md) / 5);
  }

  [class~=pr-1-5],
:root [md~=pr-1-5] {
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-md) / 5);
  }

  [class~=px-1-5],
:root [md~=px-1-5] {
    padding-left: calc(28px / 5);
    padding-left: calc(var(--spacer-md) / 5);
    padding-right: calc(28px / 5);
    padding-right: calc(var(--spacer-md) / 5);
  }

  [class~=py-1-5],
:root [md~=py-1-5] {
    padding-top: calc(28px / 5);
    padding-top: calc(var(--spacer-md) / 5);
    padding-bottom: calc(28px / 5);
    padding-bottom: calc(var(--spacer-md) / 5);
  }

  [class~=h-1-5],
:root [md~=h-1-5] {
    height: calc(28px / 5);
    height: calc(var(--spacer-md) / 5);
  }

  [class~=w-1-5],
:root [md~=w-1-5] {
    width: calc(28px / 5);
    width: calc(var(--spacer-md) / 5);
  }

  [class~=m-1-6],
:root [md~=m-1-6] {
    margin: calc(28px / 6);
    margin: calc(var(--spacer-md) / 6);
  }

  [class~=mt-1-6],
:root [md~=mt-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-md) / 6);
  }

  [class~=mb-1-6],
:root [md~=mb-1-6] {
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-md) / 6);
  }

  [class~=ml-1-6],
:root [md~=ml-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-md) / 6);
  }

  [class~=mr-1-6],
:root [md~=mr-1-6] {
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-md) / 6);
  }

  [class~=mx-1-6],
:root [md~=mx-1-6] {
    margin-left: calc(28px / 6);
    margin-left: calc(var(--spacer-md) / 6);
    margin-right: calc(28px / 6);
    margin-right: calc(var(--spacer-md) / 6);
  }

  [class~=my-1-6],
:root [md~=my-1-6] {
    margin-top: calc(28px / 6);
    margin-top: calc(var(--spacer-md) / 6);
    margin-bottom: calc(28px / 6);
    margin-bottom: calc(var(--spacer-md) / 6);
  }

  [class~=p-1-6],
:root [md~=p-1-6] {
    padding: calc(28px / 6);
    padding: calc(var(--spacer-md) / 6);
  }

  [class~=pt-1-6],
:root [md~=pt-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-md) / 6);
  }

  [class~=pb-1-6],
:root [md~=pb-1-6] {
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-md) / 6);
  }

  [class~=pl-1-6],
:root [md~=pl-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-md) / 6);
  }

  [class~=pr-1-6],
:root [md~=pr-1-6] {
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-md) / 6);
  }

  [class~=px-1-6],
:root [md~=px-1-6] {
    padding-left: calc(28px / 6);
    padding-left: calc(var(--spacer-md) / 6);
    padding-right: calc(28px / 6);
    padding-right: calc(var(--spacer-md) / 6);
  }

  [class~=py-1-6],
:root [md~=py-1-6] {
    padding-top: calc(28px / 6);
    padding-top: calc(var(--spacer-md) / 6);
    padding-bottom: calc(28px / 6);
    padding-bottom: calc(var(--spacer-md) / 6);
  }

  [class~=h-1-6],
:root [md~=h-1-6] {
    height: calc(28px / 6);
    height: calc(var(--spacer-md) / 6);
  }

  [class~=w-1-6],
:root [md~=w-1-6] {
    width: calc(28px / 6);
    width: calc(var(--spacer-md) / 6);
  }

  [class~=m-1-7],
:root [md~=m-1-7] {
    margin: calc(28px / 7);
    margin: calc(var(--spacer-md) / 7);
  }

  [class~=mt-1-7],
:root [md~=mt-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-md) / 7);
  }

  [class~=mb-1-7],
:root [md~=mb-1-7] {
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-md) / 7);
  }

  [class~=ml-1-7],
:root [md~=ml-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-md) / 7);
  }

  [class~=mr-1-7],
:root [md~=mr-1-7] {
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-md) / 7);
  }

  [class~=mx-1-7],
:root [md~=mx-1-7] {
    margin-left: calc(28px / 7);
    margin-left: calc(var(--spacer-md) / 7);
    margin-right: calc(28px / 7);
    margin-right: calc(var(--spacer-md) / 7);
  }

  [class~=my-1-7],
:root [md~=my-1-7] {
    margin-top: calc(28px / 7);
    margin-top: calc(var(--spacer-md) / 7);
    margin-bottom: calc(28px / 7);
    margin-bottom: calc(var(--spacer-md) / 7);
  }

  [class~=p-1-7],
:root [md~=p-1-7] {
    padding: calc(28px / 7);
    padding: calc(var(--spacer-md) / 7);
  }

  [class~=pt-1-7],
:root [md~=pt-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-md) / 7);
  }

  [class~=pb-1-7],
:root [md~=pb-1-7] {
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-md) / 7);
  }

  [class~=pl-1-7],
:root [md~=pl-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-md) / 7);
  }

  [class~=pr-1-7],
:root [md~=pr-1-7] {
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-md) / 7);
  }

  [class~=px-1-7],
:root [md~=px-1-7] {
    padding-left: calc(28px / 7);
    padding-left: calc(var(--spacer-md) / 7);
    padding-right: calc(28px / 7);
    padding-right: calc(var(--spacer-md) / 7);
  }

  [class~=py-1-7],
:root [md~=py-1-7] {
    padding-top: calc(28px / 7);
    padding-top: calc(var(--spacer-md) / 7);
    padding-bottom: calc(28px / 7);
    padding-bottom: calc(var(--spacer-md) / 7);
  }

  [class~=h-1-7],
:root [md~=h-1-7] {
    height: calc(28px / 7);
    height: calc(var(--spacer-md) / 7);
  }

  [class~=w-1-7],
:root [md~=w-1-7] {
    width: calc(28px / 7);
    width: calc(var(--spacer-md) / 7);
  }

  [class~=m-0],
:root [md~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [md~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [md~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [md~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [md~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [md~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [md~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [md~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [md~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [md~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [md~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [md~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [md~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [md~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [md~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [md~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [md~=gutter] {
    margin-left: calc(28px * -1);
    margin-left: calc(var(--gutter-md) * -1);
    margin-right: calc(28px * -1);
    margin-right: calc(var(--gutter-md) * -1);
  }
  [class~=gutter] > *,
:root [md~=gutter] > * {
    padding-left: calc(28px * 1);
    padding-left: calc(var(--gutter-md) * 1);
    padding-right: calc(28px * 1);
    padding-right: calc(var(--gutter-md) * 1);
  }

  [class~=gutter-1-2],
:root [md~=gutter-1-2] {
    margin-left: calc(28px * -0.5);
    margin-left: calc(var(--gutter-md) * -0.5);
    margin-right: calc(28px * -0.5);
    margin-right: calc(var(--gutter-md) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [md~=gutter-1-2] > * {
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--gutter-md) * 0.5);
    padding-right: calc(28px * 0.5);
    padding-right: calc(var(--gutter-md) * 0.5);
  }

  [class~=row-12],
:root [md~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [md~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [md~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [md~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [md~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [md~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [md~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [md~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [md~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [md~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [md~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [md~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [md~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [md~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [md~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [md~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [md~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [md~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [md~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [md~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [md~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [md~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [md~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [md~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [md~=row],
:root [md~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [md~=row] > *,
:root [md~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [md~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [md~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [md~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [md~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [md~=row][md~=v-center], :root [md~=column][md~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [md~=row][md~=v-start], :root [md~=column][md~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [md~=row][md~=v-end], :root [md~=column][md~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [md~=row][md~=v-stretch], :root [md~=column][md~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [md~=row][md~=h-center], :root [md~=column][md~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [md~=row][md~=h-start], :root [md~=column][md~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [md~=row][md~=h-end], :root [md~=column][md~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [md~=row][md~=h-spacein], :root [md~=column][md~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [md~=row][md~=h-spaceout], :root [md~=column][md~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [md~=row] > [md~=v-self-center], :root [md~=column] > [md~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [md~=row] > [md~=v-self-start], :root [md~=column] > [md~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [md~=row] > [md~=v-self-end], :root [md~=column] > [md~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [md~=row] > [md~=v-self-stretch], :root [md~=column] > [md~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [md~=row] > [md~=v-self-selfstart], :root [md~=column] > [md~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [md~=row] > [md~=v-self-selfend], :root [md~=column] > [md~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [md~=row] > [md~=h-self-center], :root [md~=column] > [md~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [md~=row] > [md~=h-self-start], :root [md~=column] > [md~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [md~=row] > [md~=h-self-end], :root [md~=column] > [md~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [md~=row] > [md~=h-self-stretch], :root [md~=column] > [md~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [md~=row] > [md~=h-self-selfstart], :root [md~=column] > [md~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [md~=row] > [md~=h-self-selfend], :root [md~=column] > [md~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [md~=row] > [md~=h-self-left], :root [md~=column] > [md~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [md~=row] > [md~=h-self-right], :root [md~=column] > [md~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-md-1 {
    flex-grow: 1;
  }

  .flex-grow-md-2 {
    flex-grow: 2;
  }

  .flex-grow-md-3 {
    flex-grow: 3;
  }

  .flex-grow-md-4 {
    flex-grow: 4;
  }

  .flex-grow-md-5 {
    flex-grow: 5;
  }

  .flex-grow-md-6 {
    flex-grow: 6;
  }

  .flex-grow-md-7 {
    flex-grow: 7;
  }

  .flex-grow-md-8 {
    flex-grow: 8;
  }

  .flex-grow-md-9 {
    flex-grow: 9;
  }

  .flex-grow-md-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [md*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [md*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [md*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [md*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [md*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [md*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [md*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [md*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [md*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [md*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [md*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [md*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [md*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [md*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [md*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [md*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [md*=bottom-inherit] {
    bottom: inherit;
  }

  [md*=text-center] {
    text-align: center;
  }

  [md*=text-left] {
    text-align: left;
  }

  [md*=text-right] {
    text-align: right;
  }

  [md*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  [class~=m-1-1],
:root [lg~=m-1-1] {
    margin: calc(32px * 1);
    margin: calc(var(--spacer-lg) * 1);
  }

  [class~=mt-1-1],
:root [lg~=mt-1-1] {
    margin-top: calc(32px * 1);
    margin-top: calc(var(--spacer-lg) * 1);
  }

  [class~=mb-1-1],
:root [lg~=mb-1-1] {
    margin-bottom: calc(32px * 1);
    margin-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=ml-1-1],
:root [lg~=ml-1-1] {
    margin-left: calc(32px * 1);
    margin-left: calc(var(--spacer-lg) * 1);
  }

  [class~=mr-1-1],
:root [lg~=mr-1-1] {
    margin-right: calc(32px * 1);
    margin-right: calc(var(--spacer-lg) * 1);
  }

  [class~=mx-1-1],
:root [lg~=mx-1-1] {
    margin-left: calc(32px * 1);
    margin-left: calc(var(--spacer-lg) * 1);
    margin-right: calc(32px * 1);
    margin-right: calc(var(--spacer-lg) * 1);
  }

  [class~=my-1-1],
:root [lg~=my-1-1] {
    margin-top: calc(32px * 1);
    margin-top: calc(var(--spacer-lg) * 1);
    margin-bottom: calc(32px * 1);
    margin-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=p-1-1],
:root [lg~=p-1-1] {
    padding: calc(32px * 1);
    padding: calc(var(--spacer-lg) * 1);
  }

  [class~=pt-1-1],
:root [lg~=pt-1-1] {
    padding-top: calc(32px * 1);
    padding-top: calc(var(--spacer-lg) * 1);
  }

  [class~=pb-1-1],
:root [lg~=pb-1-1] {
    padding-bottom: calc(32px * 1);
    padding-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=pl-1-1],
:root [lg~=pl-1-1] {
    padding-left: calc(32px * 1);
    padding-left: calc(var(--spacer-lg) * 1);
  }

  [class~=pr-1-1],
:root [lg~=pr-1-1] {
    padding-right: calc(32px * 1);
    padding-right: calc(var(--spacer-lg) * 1);
  }

  [class~=px-1-1],
:root [lg~=px-1-1] {
    padding-left: calc(32px * 1);
    padding-left: calc(var(--spacer-lg) * 1);
    padding-right: calc(32px * 1);
    padding-right: calc(var(--spacer-lg) * 1);
  }

  [class~=py-1-1],
:root [lg~=py-1-1] {
    padding-top: calc(32px * 1);
    padding-top: calc(var(--spacer-lg) * 1);
    padding-bottom: calc(32px * 1);
    padding-bottom: calc(var(--spacer-lg) * 1);
  }

  [class~=h-1-1],
:root [lg~=h-1-1] {
    height: calc(32px * 1);
    height: calc(var(--spacer-lg) * 1);
  }

  [class~=w-1-1],
:root [lg~=w-1-1] {
    width: calc(32px * 1);
    width: calc(var(--spacer-lg) * 1);
  }

  [class~=m-2-1],
:root [lg~=m-2-1] {
    margin: calc(32px * 2);
    margin: calc(var(--spacer-lg) * 2);
  }

  [class~=mt-2-1],
:root [lg~=mt-2-1] {
    margin-top: calc(32px * 2);
    margin-top: calc(var(--spacer-lg) * 2);
  }

  [class~=mb-2-1],
:root [lg~=mb-2-1] {
    margin-bottom: calc(32px * 2);
    margin-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=ml-2-1],
:root [lg~=ml-2-1] {
    margin-left: calc(32px * 2);
    margin-left: calc(var(--spacer-lg) * 2);
  }

  [class~=mr-2-1],
:root [lg~=mr-2-1] {
    margin-right: calc(32px * 2);
    margin-right: calc(var(--spacer-lg) * 2);
  }

  [class~=mx-2-1],
:root [lg~=mx-2-1] {
    margin-left: calc(32px * 2);
    margin-left: calc(var(--spacer-lg) * 2);
    margin-right: calc(32px * 2);
    margin-right: calc(var(--spacer-lg) * 2);
  }

  [class~=my-2-1],
:root [lg~=my-2-1] {
    margin-top: calc(32px * 2);
    margin-top: calc(var(--spacer-lg) * 2);
    margin-bottom: calc(32px * 2);
    margin-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=p-2-1],
:root [lg~=p-2-1] {
    padding: calc(32px * 2);
    padding: calc(var(--spacer-lg) * 2);
  }

  [class~=pt-2-1],
:root [lg~=pt-2-1] {
    padding-top: calc(32px * 2);
    padding-top: calc(var(--spacer-lg) * 2);
  }

  [class~=pb-2-1],
:root [lg~=pb-2-1] {
    padding-bottom: calc(32px * 2);
    padding-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=pl-2-1],
:root [lg~=pl-2-1] {
    padding-left: calc(32px * 2);
    padding-left: calc(var(--spacer-lg) * 2);
  }

  [class~=pr-2-1],
:root [lg~=pr-2-1] {
    padding-right: calc(32px * 2);
    padding-right: calc(var(--spacer-lg) * 2);
  }

  [class~=px-2-1],
:root [lg~=px-2-1] {
    padding-left: calc(32px * 2);
    padding-left: calc(var(--spacer-lg) * 2);
    padding-right: calc(32px * 2);
    padding-right: calc(var(--spacer-lg) * 2);
  }

  [class~=py-2-1],
:root [lg~=py-2-1] {
    padding-top: calc(32px * 2);
    padding-top: calc(var(--spacer-lg) * 2);
    padding-bottom: calc(32px * 2);
    padding-bottom: calc(var(--spacer-lg) * 2);
  }

  [class~=h-2-1],
:root [lg~=h-2-1] {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
  }

  [class~=w-2-1],
:root [lg~=w-2-1] {
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
  }

  [class~=m-3-1],
:root [lg~=m-3-1] {
    margin: calc(32px * 3);
    margin: calc(var(--spacer-lg) * 3);
  }

  [class~=mt-3-1],
:root [lg~=mt-3-1] {
    margin-top: calc(32px * 3);
    margin-top: calc(var(--spacer-lg) * 3);
  }

  [class~=mb-3-1],
:root [lg~=mb-3-1] {
    margin-bottom: calc(32px * 3);
    margin-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=ml-3-1],
:root [lg~=ml-3-1] {
    margin-left: calc(32px * 3);
    margin-left: calc(var(--spacer-lg) * 3);
  }

  [class~=mr-3-1],
:root [lg~=mr-3-1] {
    margin-right: calc(32px * 3);
    margin-right: calc(var(--spacer-lg) * 3);
  }

  [class~=mx-3-1],
:root [lg~=mx-3-1] {
    margin-left: calc(32px * 3);
    margin-left: calc(var(--spacer-lg) * 3);
    margin-right: calc(32px * 3);
    margin-right: calc(var(--spacer-lg) * 3);
  }

  [class~=my-3-1],
:root [lg~=my-3-1] {
    margin-top: calc(32px * 3);
    margin-top: calc(var(--spacer-lg) * 3);
    margin-bottom: calc(32px * 3);
    margin-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=p-3-1],
:root [lg~=p-3-1] {
    padding: calc(32px * 3);
    padding: calc(var(--spacer-lg) * 3);
  }

  [class~=pt-3-1],
:root [lg~=pt-3-1] {
    padding-top: calc(32px * 3);
    padding-top: calc(var(--spacer-lg) * 3);
  }

  [class~=pb-3-1],
:root [lg~=pb-3-1] {
    padding-bottom: calc(32px * 3);
    padding-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=pl-3-1],
:root [lg~=pl-3-1] {
    padding-left: calc(32px * 3);
    padding-left: calc(var(--spacer-lg) * 3);
  }

  [class~=pr-3-1],
:root [lg~=pr-3-1] {
    padding-right: calc(32px * 3);
    padding-right: calc(var(--spacer-lg) * 3);
  }

  [class~=px-3-1],
:root [lg~=px-3-1] {
    padding-left: calc(32px * 3);
    padding-left: calc(var(--spacer-lg) * 3);
    padding-right: calc(32px * 3);
    padding-right: calc(var(--spacer-lg) * 3);
  }

  [class~=py-3-1],
:root [lg~=py-3-1] {
    padding-top: calc(32px * 3);
    padding-top: calc(var(--spacer-lg) * 3);
    padding-bottom: calc(32px * 3);
    padding-bottom: calc(var(--spacer-lg) * 3);
  }

  [class~=h-3-1],
:root [lg~=h-3-1] {
    height: calc(32px * 3);
    height: calc(var(--spacer-lg) * 3);
  }

  [class~=w-3-1],
:root [lg~=w-3-1] {
    width: calc(32px * 3);
    width: calc(var(--spacer-lg) * 3);
  }

  [class~=m-4-1],
:root [lg~=m-4-1] {
    margin: calc(32px * 4);
    margin: calc(var(--spacer-lg) * 4);
  }

  [class~=mt-4-1],
:root [lg~=mt-4-1] {
    margin-top: calc(32px * 4);
    margin-top: calc(var(--spacer-lg) * 4);
  }

  [class~=mb-4-1],
:root [lg~=mb-4-1] {
    margin-bottom: calc(32px * 4);
    margin-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=ml-4-1],
:root [lg~=ml-4-1] {
    margin-left: calc(32px * 4);
    margin-left: calc(var(--spacer-lg) * 4);
  }

  [class~=mr-4-1],
:root [lg~=mr-4-1] {
    margin-right: calc(32px * 4);
    margin-right: calc(var(--spacer-lg) * 4);
  }

  [class~=mx-4-1],
:root [lg~=mx-4-1] {
    margin-left: calc(32px * 4);
    margin-left: calc(var(--spacer-lg) * 4);
    margin-right: calc(32px * 4);
    margin-right: calc(var(--spacer-lg) * 4);
  }

  [class~=my-4-1],
:root [lg~=my-4-1] {
    margin-top: calc(32px * 4);
    margin-top: calc(var(--spacer-lg) * 4);
    margin-bottom: calc(32px * 4);
    margin-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=p-4-1],
:root [lg~=p-4-1] {
    padding: calc(32px * 4);
    padding: calc(var(--spacer-lg) * 4);
  }

  [class~=pt-4-1],
:root [lg~=pt-4-1] {
    padding-top: calc(32px * 4);
    padding-top: calc(var(--spacer-lg) * 4);
  }

  [class~=pb-4-1],
:root [lg~=pb-4-1] {
    padding-bottom: calc(32px * 4);
    padding-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=pl-4-1],
:root [lg~=pl-4-1] {
    padding-left: calc(32px * 4);
    padding-left: calc(var(--spacer-lg) * 4);
  }

  [class~=pr-4-1],
:root [lg~=pr-4-1] {
    padding-right: calc(32px * 4);
    padding-right: calc(var(--spacer-lg) * 4);
  }

  [class~=px-4-1],
:root [lg~=px-4-1] {
    padding-left: calc(32px * 4);
    padding-left: calc(var(--spacer-lg) * 4);
    padding-right: calc(32px * 4);
    padding-right: calc(var(--spacer-lg) * 4);
  }

  [class~=py-4-1],
:root [lg~=py-4-1] {
    padding-top: calc(32px * 4);
    padding-top: calc(var(--spacer-lg) * 4);
    padding-bottom: calc(32px * 4);
    padding-bottom: calc(var(--spacer-lg) * 4);
  }

  [class~=h-4-1],
:root [lg~=h-4-1] {
    height: calc(32px * 4);
    height: calc(var(--spacer-lg) * 4);
  }

  [class~=w-4-1],
:root [lg~=w-4-1] {
    width: calc(32px * 4);
    width: calc(var(--spacer-lg) * 4);
  }

  [class~=m-5-1],
:root [lg~=m-5-1] {
    margin: calc(32px * 5);
    margin: calc(var(--spacer-lg) * 5);
  }

  [class~=mt-5-1],
:root [lg~=mt-5-1] {
    margin-top: calc(32px * 5);
    margin-top: calc(var(--spacer-lg) * 5);
  }

  [class~=mb-5-1],
:root [lg~=mb-5-1] {
    margin-bottom: calc(32px * 5);
    margin-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=ml-5-1],
:root [lg~=ml-5-1] {
    margin-left: calc(32px * 5);
    margin-left: calc(var(--spacer-lg) * 5);
  }

  [class~=mr-5-1],
:root [lg~=mr-5-1] {
    margin-right: calc(32px * 5);
    margin-right: calc(var(--spacer-lg) * 5);
  }

  [class~=mx-5-1],
:root [lg~=mx-5-1] {
    margin-left: calc(32px * 5);
    margin-left: calc(var(--spacer-lg) * 5);
    margin-right: calc(32px * 5);
    margin-right: calc(var(--spacer-lg) * 5);
  }

  [class~=my-5-1],
:root [lg~=my-5-1] {
    margin-top: calc(32px * 5);
    margin-top: calc(var(--spacer-lg) * 5);
    margin-bottom: calc(32px * 5);
    margin-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=p-5-1],
:root [lg~=p-5-1] {
    padding: calc(32px * 5);
    padding: calc(var(--spacer-lg) * 5);
  }

  [class~=pt-5-1],
:root [lg~=pt-5-1] {
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
  }

  [class~=pb-5-1],
:root [lg~=pb-5-1] {
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=pl-5-1],
:root [lg~=pl-5-1] {
    padding-left: calc(32px * 5);
    padding-left: calc(var(--spacer-lg) * 5);
  }

  [class~=pr-5-1],
:root [lg~=pr-5-1] {
    padding-right: calc(32px * 5);
    padding-right: calc(var(--spacer-lg) * 5);
  }

  [class~=px-5-1],
:root [lg~=px-5-1] {
    padding-left: calc(32px * 5);
    padding-left: calc(var(--spacer-lg) * 5);
    padding-right: calc(32px * 5);
    padding-right: calc(var(--spacer-lg) * 5);
  }

  [class~=py-5-1],
:root [lg~=py-5-1] {
    padding-top: calc(32px * 5);
    padding-top: calc(var(--spacer-lg) * 5);
    padding-bottom: calc(32px * 5);
    padding-bottom: calc(var(--spacer-lg) * 5);
  }

  [class~=h-5-1],
:root [lg~=h-5-1] {
    height: calc(32px * 5);
    height: calc(var(--spacer-lg) * 5);
  }

  [class~=w-5-1],
:root [lg~=w-5-1] {
    width: calc(32px * 5);
    width: calc(var(--spacer-lg) * 5);
  }

  [class~=m-6-1],
:root [lg~=m-6-1] {
    margin: calc(32px * 6);
    margin: calc(var(--spacer-lg) * 6);
  }

  [class~=mt-6-1],
:root [lg~=mt-6-1] {
    margin-top: calc(32px * 6);
    margin-top: calc(var(--spacer-lg) * 6);
  }

  [class~=mb-6-1],
:root [lg~=mb-6-1] {
    margin-bottom: calc(32px * 6);
    margin-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=ml-6-1],
:root [lg~=ml-6-1] {
    margin-left: calc(32px * 6);
    margin-left: calc(var(--spacer-lg) * 6);
  }

  [class~=mr-6-1],
:root [lg~=mr-6-1] {
    margin-right: calc(32px * 6);
    margin-right: calc(var(--spacer-lg) * 6);
  }

  [class~=mx-6-1],
:root [lg~=mx-6-1] {
    margin-left: calc(32px * 6);
    margin-left: calc(var(--spacer-lg) * 6);
    margin-right: calc(32px * 6);
    margin-right: calc(var(--spacer-lg) * 6);
  }

  [class~=my-6-1],
:root [lg~=my-6-1] {
    margin-top: calc(32px * 6);
    margin-top: calc(var(--spacer-lg) * 6);
    margin-bottom: calc(32px * 6);
    margin-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=p-6-1],
:root [lg~=p-6-1] {
    padding: calc(32px * 6);
    padding: calc(var(--spacer-lg) * 6);
  }

  [class~=pt-6-1],
:root [lg~=pt-6-1] {
    padding-top: calc(32px * 6);
    padding-top: calc(var(--spacer-lg) * 6);
  }

  [class~=pb-6-1],
:root [lg~=pb-6-1] {
    padding-bottom: calc(32px * 6);
    padding-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=pl-6-1],
:root [lg~=pl-6-1] {
    padding-left: calc(32px * 6);
    padding-left: calc(var(--spacer-lg) * 6);
  }

  [class~=pr-6-1],
:root [lg~=pr-6-1] {
    padding-right: calc(32px * 6);
    padding-right: calc(var(--spacer-lg) * 6);
  }

  [class~=px-6-1],
:root [lg~=px-6-1] {
    padding-left: calc(32px * 6);
    padding-left: calc(var(--spacer-lg) * 6);
    padding-right: calc(32px * 6);
    padding-right: calc(var(--spacer-lg) * 6);
  }

  [class~=py-6-1],
:root [lg~=py-6-1] {
    padding-top: calc(32px * 6);
    padding-top: calc(var(--spacer-lg) * 6);
    padding-bottom: calc(32px * 6);
    padding-bottom: calc(var(--spacer-lg) * 6);
  }

  [class~=h-6-1],
:root [lg~=h-6-1] {
    height: calc(32px * 6);
    height: calc(var(--spacer-lg) * 6);
  }

  [class~=w-6-1],
:root [lg~=w-6-1] {
    width: calc(32px * 6);
    width: calc(var(--spacer-lg) * 6);
  }

  [class~=m-7-1],
:root [lg~=m-7-1] {
    margin: calc(32px * 7);
    margin: calc(var(--spacer-lg) * 7);
  }

  [class~=mt-7-1],
:root [lg~=mt-7-1] {
    margin-top: calc(32px * 7);
    margin-top: calc(var(--spacer-lg) * 7);
  }

  [class~=mb-7-1],
:root [lg~=mb-7-1] {
    margin-bottom: calc(32px * 7);
    margin-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=ml-7-1],
:root [lg~=ml-7-1] {
    margin-left: calc(32px * 7);
    margin-left: calc(var(--spacer-lg) * 7);
  }

  [class~=mr-7-1],
:root [lg~=mr-7-1] {
    margin-right: calc(32px * 7);
    margin-right: calc(var(--spacer-lg) * 7);
  }

  [class~=mx-7-1],
:root [lg~=mx-7-1] {
    margin-left: calc(32px * 7);
    margin-left: calc(var(--spacer-lg) * 7);
    margin-right: calc(32px * 7);
    margin-right: calc(var(--spacer-lg) * 7);
  }

  [class~=my-7-1],
:root [lg~=my-7-1] {
    margin-top: calc(32px * 7);
    margin-top: calc(var(--spacer-lg) * 7);
    margin-bottom: calc(32px * 7);
    margin-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=p-7-1],
:root [lg~=p-7-1] {
    padding: calc(32px * 7);
    padding: calc(var(--spacer-lg) * 7);
  }

  [class~=pt-7-1],
:root [lg~=pt-7-1] {
    padding-top: calc(32px * 7);
    padding-top: calc(var(--spacer-lg) * 7);
  }

  [class~=pb-7-1],
:root [lg~=pb-7-1] {
    padding-bottom: calc(32px * 7);
    padding-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=pl-7-1],
:root [lg~=pl-7-1] {
    padding-left: calc(32px * 7);
    padding-left: calc(var(--spacer-lg) * 7);
  }

  [class~=pr-7-1],
:root [lg~=pr-7-1] {
    padding-right: calc(32px * 7);
    padding-right: calc(var(--spacer-lg) * 7);
  }

  [class~=px-7-1],
:root [lg~=px-7-1] {
    padding-left: calc(32px * 7);
    padding-left: calc(var(--spacer-lg) * 7);
    padding-right: calc(32px * 7);
    padding-right: calc(var(--spacer-lg) * 7);
  }

  [class~=py-7-1],
:root [lg~=py-7-1] {
    padding-top: calc(32px * 7);
    padding-top: calc(var(--spacer-lg) * 7);
    padding-bottom: calc(32px * 7);
    padding-bottom: calc(var(--spacer-lg) * 7);
  }

  [class~=h-7-1],
:root [lg~=h-7-1] {
    height: calc(32px * 7);
    height: calc(var(--spacer-lg) * 7);
  }

  [class~=w-7-1],
:root [lg~=w-7-1] {
    width: calc(32px * 7);
    width: calc(var(--spacer-lg) * 7);
  }

  [class~=m-8-1],
:root [lg~=m-8-1] {
    margin: calc(32px * 8);
    margin: calc(var(--spacer-lg) * 8);
  }

  [class~=mt-8-1],
:root [lg~=mt-8-1] {
    margin-top: calc(32px * 8);
    margin-top: calc(var(--spacer-lg) * 8);
  }

  [class~=mb-8-1],
:root [lg~=mb-8-1] {
    margin-bottom: calc(32px * 8);
    margin-bottom: calc(var(--spacer-lg) * 8);
  }

  [class~=ml-8-1],
:root [lg~=ml-8-1] {
    margin-left: calc(32px * 8);
    margin-left: calc(var(--spacer-lg) * 8);
  }

  [class~=mr-8-1],
:root [lg~=mr-8-1] {
    margin-right: calc(32px * 8);
    margin-right: calc(var(--spacer-lg) * 8);
  }

  [class~=mx-8-1],
:root [lg~=mx-8-1] {
    margin-left: calc(32px * 8);
    margin-left: calc(var(--spacer-lg) * 8);
    margin-right: calc(32px * 8);
    margin-right: calc(var(--spacer-lg) * 8);
  }

  [class~=my-8-1],
:root [lg~=my-8-1] {
    margin-top: calc(32px * 8);
    margin-top: calc(var(--spacer-lg) * 8);
    margin-bottom: calc(32px * 8);
    margin-bottom: calc(var(--spacer-lg) * 8);
  }

  [class~=p-8-1],
:root [lg~=p-8-1] {
    padding: calc(32px * 8);
    padding: calc(var(--spacer-lg) * 8);
  }

  [class~=pt-8-1],
:root [lg~=pt-8-1] {
    padding-top: calc(32px * 8);
    padding-top: calc(var(--spacer-lg) * 8);
  }

  [class~=pb-8-1],
:root [lg~=pb-8-1] {
    padding-bottom: calc(32px * 8);
    padding-bottom: calc(var(--spacer-lg) * 8);
  }

  [class~=pl-8-1],
:root [lg~=pl-8-1] {
    padding-left: calc(32px * 8);
    padding-left: calc(var(--spacer-lg) * 8);
  }

  [class~=pr-8-1],
:root [lg~=pr-8-1] {
    padding-right: calc(32px * 8);
    padding-right: calc(var(--spacer-lg) * 8);
  }

  [class~=px-8-1],
:root [lg~=px-8-1] {
    padding-left: calc(32px * 8);
    padding-left: calc(var(--spacer-lg) * 8);
    padding-right: calc(32px * 8);
    padding-right: calc(var(--spacer-lg) * 8);
  }

  [class~=py-8-1],
:root [lg~=py-8-1] {
    padding-top: calc(32px * 8);
    padding-top: calc(var(--spacer-lg) * 8);
    padding-bottom: calc(32px * 8);
    padding-bottom: calc(var(--spacer-lg) * 8);
  }

  [class~=h-8-1],
:root [lg~=h-8-1] {
    height: calc(32px * 8);
    height: calc(var(--spacer-lg) * 8);
  }

  [class~=w-8-1],
:root [lg~=w-8-1] {
    width: calc(32px * 8);
    width: calc(var(--spacer-lg) * 8);
  }

  [class~=m-1-2],
:root [lg~=m-1-2] {
    margin: calc(32px / 2);
    margin: calc(var(--spacer-lg) / 2);
  }

  [class~=mt-1-2],
:root [lg~=mt-1-2] {
    margin-top: calc(32px / 2);
    margin-top: calc(var(--spacer-lg) / 2);
  }

  [class~=mb-1-2],
:root [lg~=mb-1-2] {
    margin-bottom: calc(32px / 2);
    margin-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=ml-1-2],
:root [lg~=ml-1-2] {
    margin-left: calc(32px / 2);
    margin-left: calc(var(--spacer-lg) / 2);
  }

  [class~=mr-1-2],
:root [lg~=mr-1-2] {
    margin-right: calc(32px / 2);
    margin-right: calc(var(--spacer-lg) / 2);
  }

  [class~=mx-1-2],
:root [lg~=mx-1-2] {
    margin-left: calc(32px / 2);
    margin-left: calc(var(--spacer-lg) / 2);
    margin-right: calc(32px / 2);
    margin-right: calc(var(--spacer-lg) / 2);
  }

  [class~=my-1-2],
:root [lg~=my-1-2] {
    margin-top: calc(32px / 2);
    margin-top: calc(var(--spacer-lg) / 2);
    margin-bottom: calc(32px / 2);
    margin-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=p-1-2],
:root [lg~=p-1-2] {
    padding: calc(32px / 2);
    padding: calc(var(--spacer-lg) / 2);
  }

  [class~=pt-1-2],
:root [lg~=pt-1-2] {
    padding-top: calc(32px / 2);
    padding-top: calc(var(--spacer-lg) / 2);
  }

  [class~=pb-1-2],
:root [lg~=pb-1-2] {
    padding-bottom: calc(32px / 2);
    padding-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=pl-1-2],
:root [lg~=pl-1-2] {
    padding-left: calc(32px / 2);
    padding-left: calc(var(--spacer-lg) / 2);
  }

  [class~=pr-1-2],
:root [lg~=pr-1-2] {
    padding-right: calc(32px / 2);
    padding-right: calc(var(--spacer-lg) / 2);
  }

  [class~=px-1-2],
:root [lg~=px-1-2] {
    padding-left: calc(32px / 2);
    padding-left: calc(var(--spacer-lg) / 2);
    padding-right: calc(32px / 2);
    padding-right: calc(var(--spacer-lg) / 2);
  }

  [class~=py-1-2],
:root [lg~=py-1-2] {
    padding-top: calc(32px / 2);
    padding-top: calc(var(--spacer-lg) / 2);
    padding-bottom: calc(32px / 2);
    padding-bottom: calc(var(--spacer-lg) / 2);
  }

  [class~=h-1-2],
:root [lg~=h-1-2] {
    height: calc(32px / 2);
    height: calc(var(--spacer-lg) / 2);
  }

  [class~=w-1-2],
:root [lg~=w-1-2] {
    width: calc(32px / 2);
    width: calc(var(--spacer-lg) / 2);
  }

  [class~=m-1-3],
:root [lg~=m-1-3] {
    margin: calc(32px / 3);
    margin: calc(var(--spacer-lg) / 3);
  }

  [class~=mt-1-3],
:root [lg~=mt-1-3] {
    margin-top: calc(32px / 3);
    margin-top: calc(var(--spacer-lg) / 3);
  }

  [class~=mb-1-3],
:root [lg~=mb-1-3] {
    margin-bottom: calc(32px / 3);
    margin-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=ml-1-3],
:root [lg~=ml-1-3] {
    margin-left: calc(32px / 3);
    margin-left: calc(var(--spacer-lg) / 3);
  }

  [class~=mr-1-3],
:root [lg~=mr-1-3] {
    margin-right: calc(32px / 3);
    margin-right: calc(var(--spacer-lg) / 3);
  }

  [class~=mx-1-3],
:root [lg~=mx-1-3] {
    margin-left: calc(32px / 3);
    margin-left: calc(var(--spacer-lg) / 3);
    margin-right: calc(32px / 3);
    margin-right: calc(var(--spacer-lg) / 3);
  }

  [class~=my-1-3],
:root [lg~=my-1-3] {
    margin-top: calc(32px / 3);
    margin-top: calc(var(--spacer-lg) / 3);
    margin-bottom: calc(32px / 3);
    margin-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=p-1-3],
:root [lg~=p-1-3] {
    padding: calc(32px / 3);
    padding: calc(var(--spacer-lg) / 3);
  }

  [class~=pt-1-3],
:root [lg~=pt-1-3] {
    padding-top: calc(32px / 3);
    padding-top: calc(var(--spacer-lg) / 3);
  }

  [class~=pb-1-3],
:root [lg~=pb-1-3] {
    padding-bottom: calc(32px / 3);
    padding-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=pl-1-3],
:root [lg~=pl-1-3] {
    padding-left: calc(32px / 3);
    padding-left: calc(var(--spacer-lg) / 3);
  }

  [class~=pr-1-3],
:root [lg~=pr-1-3] {
    padding-right: calc(32px / 3);
    padding-right: calc(var(--spacer-lg) / 3);
  }

  [class~=px-1-3],
:root [lg~=px-1-3] {
    padding-left: calc(32px / 3);
    padding-left: calc(var(--spacer-lg) / 3);
    padding-right: calc(32px / 3);
    padding-right: calc(var(--spacer-lg) / 3);
  }

  [class~=py-1-3],
:root [lg~=py-1-3] {
    padding-top: calc(32px / 3);
    padding-top: calc(var(--spacer-lg) / 3);
    padding-bottom: calc(32px / 3);
    padding-bottom: calc(var(--spacer-lg) / 3);
  }

  [class~=h-1-3],
:root [lg~=h-1-3] {
    height: calc(32px / 3);
    height: calc(var(--spacer-lg) / 3);
  }

  [class~=w-1-3],
:root [lg~=w-1-3] {
    width: calc(32px / 3);
    width: calc(var(--spacer-lg) / 3);
  }

  [class~=m-1-4],
:root [lg~=m-1-4] {
    margin: calc(32px / 4);
    margin: calc(var(--spacer-lg) / 4);
  }

  [class~=mt-1-4],
:root [lg~=mt-1-4] {
    margin-top: calc(32px / 4);
    margin-top: calc(var(--spacer-lg) / 4);
  }

  [class~=mb-1-4],
:root [lg~=mb-1-4] {
    margin-bottom: calc(32px / 4);
    margin-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=ml-1-4],
:root [lg~=ml-1-4] {
    margin-left: calc(32px / 4);
    margin-left: calc(var(--spacer-lg) / 4);
  }

  [class~=mr-1-4],
:root [lg~=mr-1-4] {
    margin-right: calc(32px / 4);
    margin-right: calc(var(--spacer-lg) / 4);
  }

  [class~=mx-1-4],
:root [lg~=mx-1-4] {
    margin-left: calc(32px / 4);
    margin-left: calc(var(--spacer-lg) / 4);
    margin-right: calc(32px / 4);
    margin-right: calc(var(--spacer-lg) / 4);
  }

  [class~=my-1-4],
:root [lg~=my-1-4] {
    margin-top: calc(32px / 4);
    margin-top: calc(var(--spacer-lg) / 4);
    margin-bottom: calc(32px / 4);
    margin-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=p-1-4],
:root [lg~=p-1-4] {
    padding: calc(32px / 4);
    padding: calc(var(--spacer-lg) / 4);
  }

  [class~=pt-1-4],
:root [lg~=pt-1-4] {
    padding-top: calc(32px / 4);
    padding-top: calc(var(--spacer-lg) / 4);
  }

  [class~=pb-1-4],
:root [lg~=pb-1-4] {
    padding-bottom: calc(32px / 4);
    padding-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=pl-1-4],
:root [lg~=pl-1-4] {
    padding-left: calc(32px / 4);
    padding-left: calc(var(--spacer-lg) / 4);
  }

  [class~=pr-1-4],
:root [lg~=pr-1-4] {
    padding-right: calc(32px / 4);
    padding-right: calc(var(--spacer-lg) / 4);
  }

  [class~=px-1-4],
:root [lg~=px-1-4] {
    padding-left: calc(32px / 4);
    padding-left: calc(var(--spacer-lg) / 4);
    padding-right: calc(32px / 4);
    padding-right: calc(var(--spacer-lg) / 4);
  }

  [class~=py-1-4],
:root [lg~=py-1-4] {
    padding-top: calc(32px / 4);
    padding-top: calc(var(--spacer-lg) / 4);
    padding-bottom: calc(32px / 4);
    padding-bottom: calc(var(--spacer-lg) / 4);
  }

  [class~=h-1-4],
:root [lg~=h-1-4] {
    height: calc(32px / 4);
    height: calc(var(--spacer-lg) / 4);
  }

  [class~=w-1-4],
:root [lg~=w-1-4] {
    width: calc(32px / 4);
    width: calc(var(--spacer-lg) / 4);
  }

  [class~=m-1-5],
:root [lg~=m-1-5] {
    margin: calc(32px / 5);
    margin: calc(var(--spacer-lg) / 5);
  }

  [class~=mt-1-5],
:root [lg~=mt-1-5] {
    margin-top: calc(32px / 5);
    margin-top: calc(var(--spacer-lg) / 5);
  }

  [class~=mb-1-5],
:root [lg~=mb-1-5] {
    margin-bottom: calc(32px / 5);
    margin-bottom: calc(var(--spacer-lg) / 5);
  }

  [class~=ml-1-5],
:root [lg~=ml-1-5] {
    margin-left: calc(32px / 5);
    margin-left: calc(var(--spacer-lg) / 5);
  }

  [class~=mr-1-5],
:root [lg~=mr-1-5] {
    margin-right: calc(32px / 5);
    margin-right: calc(var(--spacer-lg) / 5);
  }

  [class~=mx-1-5],
:root [lg~=mx-1-5] {
    margin-left: calc(32px / 5);
    margin-left: calc(var(--spacer-lg) / 5);
    margin-right: calc(32px / 5);
    margin-right: calc(var(--spacer-lg) / 5);
  }

  [class~=my-1-5],
:root [lg~=my-1-5] {
    margin-top: calc(32px / 5);
    margin-top: calc(var(--spacer-lg) / 5);
    margin-bottom: calc(32px / 5);
    margin-bottom: calc(var(--spacer-lg) / 5);
  }

  [class~=p-1-5],
:root [lg~=p-1-5] {
    padding: calc(32px / 5);
    padding: calc(var(--spacer-lg) / 5);
  }

  [class~=pt-1-5],
:root [lg~=pt-1-5] {
    padding-top: calc(32px / 5);
    padding-top: calc(var(--spacer-lg) / 5);
  }

  [class~=pb-1-5],
:root [lg~=pb-1-5] {
    padding-bottom: calc(32px / 5);
    padding-bottom: calc(var(--spacer-lg) / 5);
  }

  [class~=pl-1-5],
:root [lg~=pl-1-5] {
    padding-left: calc(32px / 5);
    padding-left: calc(var(--spacer-lg) / 5);
  }

  [class~=pr-1-5],
:root [lg~=pr-1-5] {
    padding-right: calc(32px / 5);
    padding-right: calc(var(--spacer-lg) / 5);
  }

  [class~=px-1-5],
:root [lg~=px-1-5] {
    padding-left: calc(32px / 5);
    padding-left: calc(var(--spacer-lg) / 5);
    padding-right: calc(32px / 5);
    padding-right: calc(var(--spacer-lg) / 5);
  }

  [class~=py-1-5],
:root [lg~=py-1-5] {
    padding-top: calc(32px / 5);
    padding-top: calc(var(--spacer-lg) / 5);
    padding-bottom: calc(32px / 5);
    padding-bottom: calc(var(--spacer-lg) / 5);
  }

  [class~=h-1-5],
:root [lg~=h-1-5] {
    height: calc(32px / 5);
    height: calc(var(--spacer-lg) / 5);
  }

  [class~=w-1-5],
:root [lg~=w-1-5] {
    width: calc(32px / 5);
    width: calc(var(--spacer-lg) / 5);
  }

  [class~=m-1-6],
:root [lg~=m-1-6] {
    margin: calc(32px / 6);
    margin: calc(var(--spacer-lg) / 6);
  }

  [class~=mt-1-6],
:root [lg~=mt-1-6] {
    margin-top: calc(32px / 6);
    margin-top: calc(var(--spacer-lg) / 6);
  }

  [class~=mb-1-6],
:root [lg~=mb-1-6] {
    margin-bottom: calc(32px / 6);
    margin-bottom: calc(var(--spacer-lg) / 6);
  }

  [class~=ml-1-6],
:root [lg~=ml-1-6] {
    margin-left: calc(32px / 6);
    margin-left: calc(var(--spacer-lg) / 6);
  }

  [class~=mr-1-6],
:root [lg~=mr-1-6] {
    margin-right: calc(32px / 6);
    margin-right: calc(var(--spacer-lg) / 6);
  }

  [class~=mx-1-6],
:root [lg~=mx-1-6] {
    margin-left: calc(32px / 6);
    margin-left: calc(var(--spacer-lg) / 6);
    margin-right: calc(32px / 6);
    margin-right: calc(var(--spacer-lg) / 6);
  }

  [class~=my-1-6],
:root [lg~=my-1-6] {
    margin-top: calc(32px / 6);
    margin-top: calc(var(--spacer-lg) / 6);
    margin-bottom: calc(32px / 6);
    margin-bottom: calc(var(--spacer-lg) / 6);
  }

  [class~=p-1-6],
:root [lg~=p-1-6] {
    padding: calc(32px / 6);
    padding: calc(var(--spacer-lg) / 6);
  }

  [class~=pt-1-6],
:root [lg~=pt-1-6] {
    padding-top: calc(32px / 6);
    padding-top: calc(var(--spacer-lg) / 6);
  }

  [class~=pb-1-6],
:root [lg~=pb-1-6] {
    padding-bottom: calc(32px / 6);
    padding-bottom: calc(var(--spacer-lg) / 6);
  }

  [class~=pl-1-6],
:root [lg~=pl-1-6] {
    padding-left: calc(32px / 6);
    padding-left: calc(var(--spacer-lg) / 6);
  }

  [class~=pr-1-6],
:root [lg~=pr-1-6] {
    padding-right: calc(32px / 6);
    padding-right: calc(var(--spacer-lg) / 6);
  }

  [class~=px-1-6],
:root [lg~=px-1-6] {
    padding-left: calc(32px / 6);
    padding-left: calc(var(--spacer-lg) / 6);
    padding-right: calc(32px / 6);
    padding-right: calc(var(--spacer-lg) / 6);
  }

  [class~=py-1-6],
:root [lg~=py-1-6] {
    padding-top: calc(32px / 6);
    padding-top: calc(var(--spacer-lg) / 6);
    padding-bottom: calc(32px / 6);
    padding-bottom: calc(var(--spacer-lg) / 6);
  }

  [class~=h-1-6],
:root [lg~=h-1-6] {
    height: calc(32px / 6);
    height: calc(var(--spacer-lg) / 6);
  }

  [class~=w-1-6],
:root [lg~=w-1-6] {
    width: calc(32px / 6);
    width: calc(var(--spacer-lg) / 6);
  }

  [class~=m-1-7],
:root [lg~=m-1-7] {
    margin: calc(32px / 7);
    margin: calc(var(--spacer-lg) / 7);
  }

  [class~=mt-1-7],
:root [lg~=mt-1-7] {
    margin-top: calc(32px / 7);
    margin-top: calc(var(--spacer-lg) / 7);
  }

  [class~=mb-1-7],
:root [lg~=mb-1-7] {
    margin-bottom: calc(32px / 7);
    margin-bottom: calc(var(--spacer-lg) / 7);
  }

  [class~=ml-1-7],
:root [lg~=ml-1-7] {
    margin-left: calc(32px / 7);
    margin-left: calc(var(--spacer-lg) / 7);
  }

  [class~=mr-1-7],
:root [lg~=mr-1-7] {
    margin-right: calc(32px / 7);
    margin-right: calc(var(--spacer-lg) / 7);
  }

  [class~=mx-1-7],
:root [lg~=mx-1-7] {
    margin-left: calc(32px / 7);
    margin-left: calc(var(--spacer-lg) / 7);
    margin-right: calc(32px / 7);
    margin-right: calc(var(--spacer-lg) / 7);
  }

  [class~=my-1-7],
:root [lg~=my-1-7] {
    margin-top: calc(32px / 7);
    margin-top: calc(var(--spacer-lg) / 7);
    margin-bottom: calc(32px / 7);
    margin-bottom: calc(var(--spacer-lg) / 7);
  }

  [class~=p-1-7],
:root [lg~=p-1-7] {
    padding: calc(32px / 7);
    padding: calc(var(--spacer-lg) / 7);
  }

  [class~=pt-1-7],
:root [lg~=pt-1-7] {
    padding-top: calc(32px / 7);
    padding-top: calc(var(--spacer-lg) / 7);
  }

  [class~=pb-1-7],
:root [lg~=pb-1-7] {
    padding-bottom: calc(32px / 7);
    padding-bottom: calc(var(--spacer-lg) / 7);
  }

  [class~=pl-1-7],
:root [lg~=pl-1-7] {
    padding-left: calc(32px / 7);
    padding-left: calc(var(--spacer-lg) / 7);
  }

  [class~=pr-1-7],
:root [lg~=pr-1-7] {
    padding-right: calc(32px / 7);
    padding-right: calc(var(--spacer-lg) / 7);
  }

  [class~=px-1-7],
:root [lg~=px-1-7] {
    padding-left: calc(32px / 7);
    padding-left: calc(var(--spacer-lg) / 7);
    padding-right: calc(32px / 7);
    padding-right: calc(var(--spacer-lg) / 7);
  }

  [class~=py-1-7],
:root [lg~=py-1-7] {
    padding-top: calc(32px / 7);
    padding-top: calc(var(--spacer-lg) / 7);
    padding-bottom: calc(32px / 7);
    padding-bottom: calc(var(--spacer-lg) / 7);
  }

  [class~=h-1-7],
:root [lg~=h-1-7] {
    height: calc(32px / 7);
    height: calc(var(--spacer-lg) / 7);
  }

  [class~=w-1-7],
:root [lg~=w-1-7] {
    width: calc(32px / 7);
    width: calc(var(--spacer-lg) / 7);
  }

  [class~=m-0],
:root [lg~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [lg~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [lg~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [lg~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [lg~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [lg~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [lg~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [lg~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [lg~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [lg~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [lg~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [lg~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [lg~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [lg~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [lg~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [lg~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [lg~=gutter] {
    margin-left: calc(32px * -1);
    margin-left: calc(var(--gutter-lg) * -1);
    margin-right: calc(32px * -1);
    margin-right: calc(var(--gutter-lg) * -1);
  }
  [class~=gutter] > *,
:root [lg~=gutter] > * {
    padding-left: calc(32px * 1);
    padding-left: calc(var(--gutter-lg) * 1);
    padding-right: calc(32px * 1);
    padding-right: calc(var(--gutter-lg) * 1);
  }

  [class~=gutter-1-2],
:root [lg~=gutter-1-2] {
    margin-left: calc(32px * -0.5);
    margin-left: calc(var(--gutter-lg) * -0.5);
    margin-right: calc(32px * -0.5);
    margin-right: calc(var(--gutter-lg) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [lg~=gutter-1-2] > * {
    padding-left: calc(32px * 0.5);
    padding-left: calc(var(--gutter-lg) * 0.5);
    padding-right: calc(32px * 0.5);
    padding-right: calc(var(--gutter-lg) * 0.5);
  }

  [class~=row-12],
:root [lg~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [lg~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [lg~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [lg~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [lg~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [lg~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [lg~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [lg~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [lg~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [lg~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [lg~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [lg~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [lg~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [lg~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [lg~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [lg~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [lg~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [lg~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [lg~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [lg~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [lg~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [lg~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [lg~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [lg~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [lg~=row],
:root [lg~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [lg~=row] > *,
:root [lg~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [lg~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [lg~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [lg~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [lg~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [lg~=row][lg~=v-center], :root [lg~=column][lg~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [lg~=row][lg~=v-start], :root [lg~=column][lg~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [lg~=row][lg~=v-end], :root [lg~=column][lg~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [lg~=row][lg~=v-stretch], :root [lg~=column][lg~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [lg~=row][lg~=h-center], :root [lg~=column][lg~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [lg~=row][lg~=h-start], :root [lg~=column][lg~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [lg~=row][lg~=h-end], :root [lg~=column][lg~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [lg~=row][lg~=h-spacein], :root [lg~=column][lg~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [lg~=row][lg~=h-spaceout], :root [lg~=column][lg~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [lg~=row] > [lg~=v-self-center], :root [lg~=column] > [lg~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [lg~=row] > [lg~=v-self-start], :root [lg~=column] > [lg~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [lg~=row] > [lg~=v-self-end], :root [lg~=column] > [lg~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [lg~=row] > [lg~=v-self-stretch], :root [lg~=column] > [lg~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [lg~=row] > [lg~=v-self-selfstart], :root [lg~=column] > [lg~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [lg~=row] > [lg~=v-self-selfend], :root [lg~=column] > [lg~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [lg~=row] > [lg~=h-self-center], :root [lg~=column] > [lg~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [lg~=row] > [lg~=h-self-start], :root [lg~=column] > [lg~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [lg~=row] > [lg~=h-self-end], :root [lg~=column] > [lg~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [lg~=row] > [lg~=h-self-stretch], :root [lg~=column] > [lg~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [lg~=row] > [lg~=h-self-selfstart], :root [lg~=column] > [lg~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [lg~=row] > [lg~=h-self-selfend], :root [lg~=column] > [lg~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [lg~=row] > [lg~=h-self-left], :root [lg~=column] > [lg~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [lg~=row] > [lg~=h-self-right], :root [lg~=column] > [lg~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-lg-1 {
    flex-grow: 1;
  }

  .flex-grow-lg-2 {
    flex-grow: 2;
  }

  .flex-grow-lg-3 {
    flex-grow: 3;
  }

  .flex-grow-lg-4 {
    flex-grow: 4;
  }

  .flex-grow-lg-5 {
    flex-grow: 5;
  }

  .flex-grow-lg-6 {
    flex-grow: 6;
  }

  .flex-grow-lg-7 {
    flex-grow: 7;
  }

  .flex-grow-lg-8 {
    flex-grow: 8;
  }

  .flex-grow-lg-9 {
    flex-grow: 9;
  }

  .flex-grow-lg-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [lg*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [lg*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [lg*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [lg*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [lg*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [lg*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [lg*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [lg*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [lg*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [lg*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [lg*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [lg*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [lg*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [lg*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [lg*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [lg*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [lg*=bottom-inherit] {
    bottom: inherit;
  }

  [lg*=text-center] {
    text-align: center;
  }

  [lg*=text-left] {
    text-align: left;
  }

  [lg*=text-right] {
    text-align: right;
  }

  [lg*=text-justify] {
    text-align: justify;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  [class~=m-1-1],
:root [xl~=m-1-1] {
    margin: calc(36px * 1);
    margin: calc(var(--spacer-xl) * 1);
  }

  [class~=mt-1-1],
:root [xl~=mt-1-1] {
    margin-top: calc(36px * 1);
    margin-top: calc(var(--spacer-xl) * 1);
  }

  [class~=mb-1-1],
:root [xl~=mb-1-1] {
    margin-bottom: calc(36px * 1);
    margin-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=ml-1-1],
:root [xl~=ml-1-1] {
    margin-left: calc(36px * 1);
    margin-left: calc(var(--spacer-xl) * 1);
  }

  [class~=mr-1-1],
:root [xl~=mr-1-1] {
    margin-right: calc(36px * 1);
    margin-right: calc(var(--spacer-xl) * 1);
  }

  [class~=mx-1-1],
:root [xl~=mx-1-1] {
    margin-left: calc(36px * 1);
    margin-left: calc(var(--spacer-xl) * 1);
    margin-right: calc(36px * 1);
    margin-right: calc(var(--spacer-xl) * 1);
  }

  [class~=my-1-1],
:root [xl~=my-1-1] {
    margin-top: calc(36px * 1);
    margin-top: calc(var(--spacer-xl) * 1);
    margin-bottom: calc(36px * 1);
    margin-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=p-1-1],
:root [xl~=p-1-1] {
    padding: calc(36px * 1);
    padding: calc(var(--spacer-xl) * 1);
  }

  [class~=pt-1-1],
:root [xl~=pt-1-1] {
    padding-top: calc(36px * 1);
    padding-top: calc(var(--spacer-xl) * 1);
  }

  [class~=pb-1-1],
:root [xl~=pb-1-1] {
    padding-bottom: calc(36px * 1);
    padding-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=pl-1-1],
:root [xl~=pl-1-1] {
    padding-left: calc(36px * 1);
    padding-left: calc(var(--spacer-xl) * 1);
  }

  [class~=pr-1-1],
:root [xl~=pr-1-1] {
    padding-right: calc(36px * 1);
    padding-right: calc(var(--spacer-xl) * 1);
  }

  [class~=px-1-1],
:root [xl~=px-1-1] {
    padding-left: calc(36px * 1);
    padding-left: calc(var(--spacer-xl) * 1);
    padding-right: calc(36px * 1);
    padding-right: calc(var(--spacer-xl) * 1);
  }

  [class~=py-1-1],
:root [xl~=py-1-1] {
    padding-top: calc(36px * 1);
    padding-top: calc(var(--spacer-xl) * 1);
    padding-bottom: calc(36px * 1);
    padding-bottom: calc(var(--spacer-xl) * 1);
  }

  [class~=h-1-1],
:root [xl~=h-1-1] {
    height: calc(36px * 1);
    height: calc(var(--spacer-xl) * 1);
  }

  [class~=w-1-1],
:root [xl~=w-1-1] {
    width: calc(36px * 1);
    width: calc(var(--spacer-xl) * 1);
  }

  [class~=m-2-1],
:root [xl~=m-2-1] {
    margin: calc(36px * 2);
    margin: calc(var(--spacer-xl) * 2);
  }

  [class~=mt-2-1],
:root [xl~=mt-2-1] {
    margin-top: calc(36px * 2);
    margin-top: calc(var(--spacer-xl) * 2);
  }

  [class~=mb-2-1],
:root [xl~=mb-2-1] {
    margin-bottom: calc(36px * 2);
    margin-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=ml-2-1],
:root [xl~=ml-2-1] {
    margin-left: calc(36px * 2);
    margin-left: calc(var(--spacer-xl) * 2);
  }

  [class~=mr-2-1],
:root [xl~=mr-2-1] {
    margin-right: calc(36px * 2);
    margin-right: calc(var(--spacer-xl) * 2);
  }

  [class~=mx-2-1],
:root [xl~=mx-2-1] {
    margin-left: calc(36px * 2);
    margin-left: calc(var(--spacer-xl) * 2);
    margin-right: calc(36px * 2);
    margin-right: calc(var(--spacer-xl) * 2);
  }

  [class~=my-2-1],
:root [xl~=my-2-1] {
    margin-top: calc(36px * 2);
    margin-top: calc(var(--spacer-xl) * 2);
    margin-bottom: calc(36px * 2);
    margin-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=p-2-1],
:root [xl~=p-2-1] {
    padding: calc(36px * 2);
    padding: calc(var(--spacer-xl) * 2);
  }

  [class~=pt-2-1],
:root [xl~=pt-2-1] {
    padding-top: calc(36px * 2);
    padding-top: calc(var(--spacer-xl) * 2);
  }

  [class~=pb-2-1],
:root [xl~=pb-2-1] {
    padding-bottom: calc(36px * 2);
    padding-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=pl-2-1],
:root [xl~=pl-2-1] {
    padding-left: calc(36px * 2);
    padding-left: calc(var(--spacer-xl) * 2);
  }

  [class~=pr-2-1],
:root [xl~=pr-2-1] {
    padding-right: calc(36px * 2);
    padding-right: calc(var(--spacer-xl) * 2);
  }

  [class~=px-2-1],
:root [xl~=px-2-1] {
    padding-left: calc(36px * 2);
    padding-left: calc(var(--spacer-xl) * 2);
    padding-right: calc(36px * 2);
    padding-right: calc(var(--spacer-xl) * 2);
  }

  [class~=py-2-1],
:root [xl~=py-2-1] {
    padding-top: calc(36px * 2);
    padding-top: calc(var(--spacer-xl) * 2);
    padding-bottom: calc(36px * 2);
    padding-bottom: calc(var(--spacer-xl) * 2);
  }

  [class~=h-2-1],
:root [xl~=h-2-1] {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
  }

  [class~=w-2-1],
:root [xl~=w-2-1] {
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
  }

  [class~=m-3-1],
:root [xl~=m-3-1] {
    margin: calc(36px * 3);
    margin: calc(var(--spacer-xl) * 3);
  }

  [class~=mt-3-1],
:root [xl~=mt-3-1] {
    margin-top: calc(36px * 3);
    margin-top: calc(var(--spacer-xl) * 3);
  }

  [class~=mb-3-1],
:root [xl~=mb-3-1] {
    margin-bottom: calc(36px * 3);
    margin-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=ml-3-1],
:root [xl~=ml-3-1] {
    margin-left: calc(36px * 3);
    margin-left: calc(var(--spacer-xl) * 3);
  }

  [class~=mr-3-1],
:root [xl~=mr-3-1] {
    margin-right: calc(36px * 3);
    margin-right: calc(var(--spacer-xl) * 3);
  }

  [class~=mx-3-1],
:root [xl~=mx-3-1] {
    margin-left: calc(36px * 3);
    margin-left: calc(var(--spacer-xl) * 3);
    margin-right: calc(36px * 3);
    margin-right: calc(var(--spacer-xl) * 3);
  }

  [class~=my-3-1],
:root [xl~=my-3-1] {
    margin-top: calc(36px * 3);
    margin-top: calc(var(--spacer-xl) * 3);
    margin-bottom: calc(36px * 3);
    margin-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=p-3-1],
:root [xl~=p-3-1] {
    padding: calc(36px * 3);
    padding: calc(var(--spacer-xl) * 3);
  }

  [class~=pt-3-1],
:root [xl~=pt-3-1] {
    padding-top: calc(36px * 3);
    padding-top: calc(var(--spacer-xl) * 3);
  }

  [class~=pb-3-1],
:root [xl~=pb-3-1] {
    padding-bottom: calc(36px * 3);
    padding-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=pl-3-1],
:root [xl~=pl-3-1] {
    padding-left: calc(36px * 3);
    padding-left: calc(var(--spacer-xl) * 3);
  }

  [class~=pr-3-1],
:root [xl~=pr-3-1] {
    padding-right: calc(36px * 3);
    padding-right: calc(var(--spacer-xl) * 3);
  }

  [class~=px-3-1],
:root [xl~=px-3-1] {
    padding-left: calc(36px * 3);
    padding-left: calc(var(--spacer-xl) * 3);
    padding-right: calc(36px * 3);
    padding-right: calc(var(--spacer-xl) * 3);
  }

  [class~=py-3-1],
:root [xl~=py-3-1] {
    padding-top: calc(36px * 3);
    padding-top: calc(var(--spacer-xl) * 3);
    padding-bottom: calc(36px * 3);
    padding-bottom: calc(var(--spacer-xl) * 3);
  }

  [class~=h-3-1],
:root [xl~=h-3-1] {
    height: calc(36px * 3);
    height: calc(var(--spacer-xl) * 3);
  }

  [class~=w-3-1],
:root [xl~=w-3-1] {
    width: calc(36px * 3);
    width: calc(var(--spacer-xl) * 3);
  }

  [class~=m-4-1],
:root [xl~=m-4-1] {
    margin: calc(36px * 4);
    margin: calc(var(--spacer-xl) * 4);
  }

  [class~=mt-4-1],
:root [xl~=mt-4-1] {
    margin-top: calc(36px * 4);
    margin-top: calc(var(--spacer-xl) * 4);
  }

  [class~=mb-4-1],
:root [xl~=mb-4-1] {
    margin-bottom: calc(36px * 4);
    margin-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=ml-4-1],
:root [xl~=ml-4-1] {
    margin-left: calc(36px * 4);
    margin-left: calc(var(--spacer-xl) * 4);
  }

  [class~=mr-4-1],
:root [xl~=mr-4-1] {
    margin-right: calc(36px * 4);
    margin-right: calc(var(--spacer-xl) * 4);
  }

  [class~=mx-4-1],
:root [xl~=mx-4-1] {
    margin-left: calc(36px * 4);
    margin-left: calc(var(--spacer-xl) * 4);
    margin-right: calc(36px * 4);
    margin-right: calc(var(--spacer-xl) * 4);
  }

  [class~=my-4-1],
:root [xl~=my-4-1] {
    margin-top: calc(36px * 4);
    margin-top: calc(var(--spacer-xl) * 4);
    margin-bottom: calc(36px * 4);
    margin-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=p-4-1],
:root [xl~=p-4-1] {
    padding: calc(36px * 4);
    padding: calc(var(--spacer-xl) * 4);
  }

  [class~=pt-4-1],
:root [xl~=pt-4-1] {
    padding-top: calc(36px * 4);
    padding-top: calc(var(--spacer-xl) * 4);
  }

  [class~=pb-4-1],
:root [xl~=pb-4-1] {
    padding-bottom: calc(36px * 4);
    padding-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=pl-4-1],
:root [xl~=pl-4-1] {
    padding-left: calc(36px * 4);
    padding-left: calc(var(--spacer-xl) * 4);
  }

  [class~=pr-4-1],
:root [xl~=pr-4-1] {
    padding-right: calc(36px * 4);
    padding-right: calc(var(--spacer-xl) * 4);
  }

  [class~=px-4-1],
:root [xl~=px-4-1] {
    padding-left: calc(36px * 4);
    padding-left: calc(var(--spacer-xl) * 4);
    padding-right: calc(36px * 4);
    padding-right: calc(var(--spacer-xl) * 4);
  }

  [class~=py-4-1],
:root [xl~=py-4-1] {
    padding-top: calc(36px * 4);
    padding-top: calc(var(--spacer-xl) * 4);
    padding-bottom: calc(36px * 4);
    padding-bottom: calc(var(--spacer-xl) * 4);
  }

  [class~=h-4-1],
:root [xl~=h-4-1] {
    height: calc(36px * 4);
    height: calc(var(--spacer-xl) * 4);
  }

  [class~=w-4-1],
:root [xl~=w-4-1] {
    width: calc(36px * 4);
    width: calc(var(--spacer-xl) * 4);
  }

  [class~=m-5-1],
:root [xl~=m-5-1] {
    margin: calc(36px * 5);
    margin: calc(var(--spacer-xl) * 5);
  }

  [class~=mt-5-1],
:root [xl~=mt-5-1] {
    margin-top: calc(36px * 5);
    margin-top: calc(var(--spacer-xl) * 5);
  }

  [class~=mb-5-1],
:root [xl~=mb-5-1] {
    margin-bottom: calc(36px * 5);
    margin-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=ml-5-1],
:root [xl~=ml-5-1] {
    margin-left: calc(36px * 5);
    margin-left: calc(var(--spacer-xl) * 5);
  }

  [class~=mr-5-1],
:root [xl~=mr-5-1] {
    margin-right: calc(36px * 5);
    margin-right: calc(var(--spacer-xl) * 5);
  }

  [class~=mx-5-1],
:root [xl~=mx-5-1] {
    margin-left: calc(36px * 5);
    margin-left: calc(var(--spacer-xl) * 5);
    margin-right: calc(36px * 5);
    margin-right: calc(var(--spacer-xl) * 5);
  }

  [class~=my-5-1],
:root [xl~=my-5-1] {
    margin-top: calc(36px * 5);
    margin-top: calc(var(--spacer-xl) * 5);
    margin-bottom: calc(36px * 5);
    margin-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=p-5-1],
:root [xl~=p-5-1] {
    padding: calc(36px * 5);
    padding: calc(var(--spacer-xl) * 5);
  }

  [class~=pt-5-1],
:root [xl~=pt-5-1] {
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
  }

  [class~=pb-5-1],
:root [xl~=pb-5-1] {
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=pl-5-1],
:root [xl~=pl-5-1] {
    padding-left: calc(36px * 5);
    padding-left: calc(var(--spacer-xl) * 5);
  }

  [class~=pr-5-1],
:root [xl~=pr-5-1] {
    padding-right: calc(36px * 5);
    padding-right: calc(var(--spacer-xl) * 5);
  }

  [class~=px-5-1],
:root [xl~=px-5-1] {
    padding-left: calc(36px * 5);
    padding-left: calc(var(--spacer-xl) * 5);
    padding-right: calc(36px * 5);
    padding-right: calc(var(--spacer-xl) * 5);
  }

  [class~=py-5-1],
:root [xl~=py-5-1] {
    padding-top: calc(36px * 5);
    padding-top: calc(var(--spacer-xl) * 5);
    padding-bottom: calc(36px * 5);
    padding-bottom: calc(var(--spacer-xl) * 5);
  }

  [class~=h-5-1],
:root [xl~=h-5-1] {
    height: calc(36px * 5);
    height: calc(var(--spacer-xl) * 5);
  }

  [class~=w-5-1],
:root [xl~=w-5-1] {
    width: calc(36px * 5);
    width: calc(var(--spacer-xl) * 5);
  }

  [class~=m-6-1],
:root [xl~=m-6-1] {
    margin: calc(36px * 6);
    margin: calc(var(--spacer-xl) * 6);
  }

  [class~=mt-6-1],
:root [xl~=mt-6-1] {
    margin-top: calc(36px * 6);
    margin-top: calc(var(--spacer-xl) * 6);
  }

  [class~=mb-6-1],
:root [xl~=mb-6-1] {
    margin-bottom: calc(36px * 6);
    margin-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=ml-6-1],
:root [xl~=ml-6-1] {
    margin-left: calc(36px * 6);
    margin-left: calc(var(--spacer-xl) * 6);
  }

  [class~=mr-6-1],
:root [xl~=mr-6-1] {
    margin-right: calc(36px * 6);
    margin-right: calc(var(--spacer-xl) * 6);
  }

  [class~=mx-6-1],
:root [xl~=mx-6-1] {
    margin-left: calc(36px * 6);
    margin-left: calc(var(--spacer-xl) * 6);
    margin-right: calc(36px * 6);
    margin-right: calc(var(--spacer-xl) * 6);
  }

  [class~=my-6-1],
:root [xl~=my-6-1] {
    margin-top: calc(36px * 6);
    margin-top: calc(var(--spacer-xl) * 6);
    margin-bottom: calc(36px * 6);
    margin-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=p-6-1],
:root [xl~=p-6-1] {
    padding: calc(36px * 6);
    padding: calc(var(--spacer-xl) * 6);
  }

  [class~=pt-6-1],
:root [xl~=pt-6-1] {
    padding-top: calc(36px * 6);
    padding-top: calc(var(--spacer-xl) * 6);
  }

  [class~=pb-6-1],
:root [xl~=pb-6-1] {
    padding-bottom: calc(36px * 6);
    padding-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=pl-6-1],
:root [xl~=pl-6-1] {
    padding-left: calc(36px * 6);
    padding-left: calc(var(--spacer-xl) * 6);
  }

  [class~=pr-6-1],
:root [xl~=pr-6-1] {
    padding-right: calc(36px * 6);
    padding-right: calc(var(--spacer-xl) * 6);
  }

  [class~=px-6-1],
:root [xl~=px-6-1] {
    padding-left: calc(36px * 6);
    padding-left: calc(var(--spacer-xl) * 6);
    padding-right: calc(36px * 6);
    padding-right: calc(var(--spacer-xl) * 6);
  }

  [class~=py-6-1],
:root [xl~=py-6-1] {
    padding-top: calc(36px * 6);
    padding-top: calc(var(--spacer-xl) * 6);
    padding-bottom: calc(36px * 6);
    padding-bottom: calc(var(--spacer-xl) * 6);
  }

  [class~=h-6-1],
:root [xl~=h-6-1] {
    height: calc(36px * 6);
    height: calc(var(--spacer-xl) * 6);
  }

  [class~=w-6-1],
:root [xl~=w-6-1] {
    width: calc(36px * 6);
    width: calc(var(--spacer-xl) * 6);
  }

  [class~=m-7-1],
:root [xl~=m-7-1] {
    margin: calc(36px * 7);
    margin: calc(var(--spacer-xl) * 7);
  }

  [class~=mt-7-1],
:root [xl~=mt-7-1] {
    margin-top: calc(36px * 7);
    margin-top: calc(var(--spacer-xl) * 7);
  }

  [class~=mb-7-1],
:root [xl~=mb-7-1] {
    margin-bottom: calc(36px * 7);
    margin-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=ml-7-1],
:root [xl~=ml-7-1] {
    margin-left: calc(36px * 7);
    margin-left: calc(var(--spacer-xl) * 7);
  }

  [class~=mr-7-1],
:root [xl~=mr-7-1] {
    margin-right: calc(36px * 7);
    margin-right: calc(var(--spacer-xl) * 7);
  }

  [class~=mx-7-1],
:root [xl~=mx-7-1] {
    margin-left: calc(36px * 7);
    margin-left: calc(var(--spacer-xl) * 7);
    margin-right: calc(36px * 7);
    margin-right: calc(var(--spacer-xl) * 7);
  }

  [class~=my-7-1],
:root [xl~=my-7-1] {
    margin-top: calc(36px * 7);
    margin-top: calc(var(--spacer-xl) * 7);
    margin-bottom: calc(36px * 7);
    margin-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=p-7-1],
:root [xl~=p-7-1] {
    padding: calc(36px * 7);
    padding: calc(var(--spacer-xl) * 7);
  }

  [class~=pt-7-1],
:root [xl~=pt-7-1] {
    padding-top: calc(36px * 7);
    padding-top: calc(var(--spacer-xl) * 7);
  }

  [class~=pb-7-1],
:root [xl~=pb-7-1] {
    padding-bottom: calc(36px * 7);
    padding-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=pl-7-1],
:root [xl~=pl-7-1] {
    padding-left: calc(36px * 7);
    padding-left: calc(var(--spacer-xl) * 7);
  }

  [class~=pr-7-1],
:root [xl~=pr-7-1] {
    padding-right: calc(36px * 7);
    padding-right: calc(var(--spacer-xl) * 7);
  }

  [class~=px-7-1],
:root [xl~=px-7-1] {
    padding-left: calc(36px * 7);
    padding-left: calc(var(--spacer-xl) * 7);
    padding-right: calc(36px * 7);
    padding-right: calc(var(--spacer-xl) * 7);
  }

  [class~=py-7-1],
:root [xl~=py-7-1] {
    padding-top: calc(36px * 7);
    padding-top: calc(var(--spacer-xl) * 7);
    padding-bottom: calc(36px * 7);
    padding-bottom: calc(var(--spacer-xl) * 7);
  }

  [class~=h-7-1],
:root [xl~=h-7-1] {
    height: calc(36px * 7);
    height: calc(var(--spacer-xl) * 7);
  }

  [class~=w-7-1],
:root [xl~=w-7-1] {
    width: calc(36px * 7);
    width: calc(var(--spacer-xl) * 7);
  }

  [class~=m-8-1],
:root [xl~=m-8-1] {
    margin: calc(36px * 8);
    margin: calc(var(--spacer-xl) * 8);
  }

  [class~=mt-8-1],
:root [xl~=mt-8-1] {
    margin-top: calc(36px * 8);
    margin-top: calc(var(--spacer-xl) * 8);
  }

  [class~=mb-8-1],
:root [xl~=mb-8-1] {
    margin-bottom: calc(36px * 8);
    margin-bottom: calc(var(--spacer-xl) * 8);
  }

  [class~=ml-8-1],
:root [xl~=ml-8-1] {
    margin-left: calc(36px * 8);
    margin-left: calc(var(--spacer-xl) * 8);
  }

  [class~=mr-8-1],
:root [xl~=mr-8-1] {
    margin-right: calc(36px * 8);
    margin-right: calc(var(--spacer-xl) * 8);
  }

  [class~=mx-8-1],
:root [xl~=mx-8-1] {
    margin-left: calc(36px * 8);
    margin-left: calc(var(--spacer-xl) * 8);
    margin-right: calc(36px * 8);
    margin-right: calc(var(--spacer-xl) * 8);
  }

  [class~=my-8-1],
:root [xl~=my-8-1] {
    margin-top: calc(36px * 8);
    margin-top: calc(var(--spacer-xl) * 8);
    margin-bottom: calc(36px * 8);
    margin-bottom: calc(var(--spacer-xl) * 8);
  }

  [class~=p-8-1],
:root [xl~=p-8-1] {
    padding: calc(36px * 8);
    padding: calc(var(--spacer-xl) * 8);
  }

  [class~=pt-8-1],
:root [xl~=pt-8-1] {
    padding-top: calc(36px * 8);
    padding-top: calc(var(--spacer-xl) * 8);
  }

  [class~=pb-8-1],
:root [xl~=pb-8-1] {
    padding-bottom: calc(36px * 8);
    padding-bottom: calc(var(--spacer-xl) * 8);
  }

  [class~=pl-8-1],
:root [xl~=pl-8-1] {
    padding-left: calc(36px * 8);
    padding-left: calc(var(--spacer-xl) * 8);
  }

  [class~=pr-8-1],
:root [xl~=pr-8-1] {
    padding-right: calc(36px * 8);
    padding-right: calc(var(--spacer-xl) * 8);
  }

  [class~=px-8-1],
:root [xl~=px-8-1] {
    padding-left: calc(36px * 8);
    padding-left: calc(var(--spacer-xl) * 8);
    padding-right: calc(36px * 8);
    padding-right: calc(var(--spacer-xl) * 8);
  }

  [class~=py-8-1],
:root [xl~=py-8-1] {
    padding-top: calc(36px * 8);
    padding-top: calc(var(--spacer-xl) * 8);
    padding-bottom: calc(36px * 8);
    padding-bottom: calc(var(--spacer-xl) * 8);
  }

  [class~=h-8-1],
:root [xl~=h-8-1] {
    height: calc(36px * 8);
    height: calc(var(--spacer-xl) * 8);
  }

  [class~=w-8-1],
:root [xl~=w-8-1] {
    width: calc(36px * 8);
    width: calc(var(--spacer-xl) * 8);
  }

  [class~=m-1-2],
:root [xl~=m-1-2] {
    margin: calc(36px / 2);
    margin: calc(var(--spacer-xl) / 2);
  }

  [class~=mt-1-2],
:root [xl~=mt-1-2] {
    margin-top: calc(36px / 2);
    margin-top: calc(var(--spacer-xl) / 2);
  }

  [class~=mb-1-2],
:root [xl~=mb-1-2] {
    margin-bottom: calc(36px / 2);
    margin-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=ml-1-2],
:root [xl~=ml-1-2] {
    margin-left: calc(36px / 2);
    margin-left: calc(var(--spacer-xl) / 2);
  }

  [class~=mr-1-2],
:root [xl~=mr-1-2] {
    margin-right: calc(36px / 2);
    margin-right: calc(var(--spacer-xl) / 2);
  }

  [class~=mx-1-2],
:root [xl~=mx-1-2] {
    margin-left: calc(36px / 2);
    margin-left: calc(var(--spacer-xl) / 2);
    margin-right: calc(36px / 2);
    margin-right: calc(var(--spacer-xl) / 2);
  }

  [class~=my-1-2],
:root [xl~=my-1-2] {
    margin-top: calc(36px / 2);
    margin-top: calc(var(--spacer-xl) / 2);
    margin-bottom: calc(36px / 2);
    margin-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=p-1-2],
:root [xl~=p-1-2] {
    padding: calc(36px / 2);
    padding: calc(var(--spacer-xl) / 2);
  }

  [class~=pt-1-2],
:root [xl~=pt-1-2] {
    padding-top: calc(36px / 2);
    padding-top: calc(var(--spacer-xl) / 2);
  }

  [class~=pb-1-2],
:root [xl~=pb-1-2] {
    padding-bottom: calc(36px / 2);
    padding-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=pl-1-2],
:root [xl~=pl-1-2] {
    padding-left: calc(36px / 2);
    padding-left: calc(var(--spacer-xl) / 2);
  }

  [class~=pr-1-2],
:root [xl~=pr-1-2] {
    padding-right: calc(36px / 2);
    padding-right: calc(var(--spacer-xl) / 2);
  }

  [class~=px-1-2],
:root [xl~=px-1-2] {
    padding-left: calc(36px / 2);
    padding-left: calc(var(--spacer-xl) / 2);
    padding-right: calc(36px / 2);
    padding-right: calc(var(--spacer-xl) / 2);
  }

  [class~=py-1-2],
:root [xl~=py-1-2] {
    padding-top: calc(36px / 2);
    padding-top: calc(var(--spacer-xl) / 2);
    padding-bottom: calc(36px / 2);
    padding-bottom: calc(var(--spacer-xl) / 2);
  }

  [class~=h-1-2],
:root [xl~=h-1-2] {
    height: calc(36px / 2);
    height: calc(var(--spacer-xl) / 2);
  }

  [class~=w-1-2],
:root [xl~=w-1-2] {
    width: calc(36px / 2);
    width: calc(var(--spacer-xl) / 2);
  }

  [class~=m-1-3],
:root [xl~=m-1-3] {
    margin: calc(36px / 3);
    margin: calc(var(--spacer-xl) / 3);
  }

  [class~=mt-1-3],
:root [xl~=mt-1-3] {
    margin-top: calc(36px / 3);
    margin-top: calc(var(--spacer-xl) / 3);
  }

  [class~=mb-1-3],
:root [xl~=mb-1-3] {
    margin-bottom: calc(36px / 3);
    margin-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=ml-1-3],
:root [xl~=ml-1-3] {
    margin-left: calc(36px / 3);
    margin-left: calc(var(--spacer-xl) / 3);
  }

  [class~=mr-1-3],
:root [xl~=mr-1-3] {
    margin-right: calc(36px / 3);
    margin-right: calc(var(--spacer-xl) / 3);
  }

  [class~=mx-1-3],
:root [xl~=mx-1-3] {
    margin-left: calc(36px / 3);
    margin-left: calc(var(--spacer-xl) / 3);
    margin-right: calc(36px / 3);
    margin-right: calc(var(--spacer-xl) / 3);
  }

  [class~=my-1-3],
:root [xl~=my-1-3] {
    margin-top: calc(36px / 3);
    margin-top: calc(var(--spacer-xl) / 3);
    margin-bottom: calc(36px / 3);
    margin-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=p-1-3],
:root [xl~=p-1-3] {
    padding: calc(36px / 3);
    padding: calc(var(--spacer-xl) / 3);
  }

  [class~=pt-1-3],
:root [xl~=pt-1-3] {
    padding-top: calc(36px / 3);
    padding-top: calc(var(--spacer-xl) / 3);
  }

  [class~=pb-1-3],
:root [xl~=pb-1-3] {
    padding-bottom: calc(36px / 3);
    padding-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=pl-1-3],
:root [xl~=pl-1-3] {
    padding-left: calc(36px / 3);
    padding-left: calc(var(--spacer-xl) / 3);
  }

  [class~=pr-1-3],
:root [xl~=pr-1-3] {
    padding-right: calc(36px / 3);
    padding-right: calc(var(--spacer-xl) / 3);
  }

  [class~=px-1-3],
:root [xl~=px-1-3] {
    padding-left: calc(36px / 3);
    padding-left: calc(var(--spacer-xl) / 3);
    padding-right: calc(36px / 3);
    padding-right: calc(var(--spacer-xl) / 3);
  }

  [class~=py-1-3],
:root [xl~=py-1-3] {
    padding-top: calc(36px / 3);
    padding-top: calc(var(--spacer-xl) / 3);
    padding-bottom: calc(36px / 3);
    padding-bottom: calc(var(--spacer-xl) / 3);
  }

  [class~=h-1-3],
:root [xl~=h-1-3] {
    height: calc(36px / 3);
    height: calc(var(--spacer-xl) / 3);
  }

  [class~=w-1-3],
:root [xl~=w-1-3] {
    width: calc(36px / 3);
    width: calc(var(--spacer-xl) / 3);
  }

  [class~=m-1-4],
:root [xl~=m-1-4] {
    margin: calc(36px / 4);
    margin: calc(var(--spacer-xl) / 4);
  }

  [class~=mt-1-4],
:root [xl~=mt-1-4] {
    margin-top: calc(36px / 4);
    margin-top: calc(var(--spacer-xl) / 4);
  }

  [class~=mb-1-4],
:root [xl~=mb-1-4] {
    margin-bottom: calc(36px / 4);
    margin-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=ml-1-4],
:root [xl~=ml-1-4] {
    margin-left: calc(36px / 4);
    margin-left: calc(var(--spacer-xl) / 4);
  }

  [class~=mr-1-4],
:root [xl~=mr-1-4] {
    margin-right: calc(36px / 4);
    margin-right: calc(var(--spacer-xl) / 4);
  }

  [class~=mx-1-4],
:root [xl~=mx-1-4] {
    margin-left: calc(36px / 4);
    margin-left: calc(var(--spacer-xl) / 4);
    margin-right: calc(36px / 4);
    margin-right: calc(var(--spacer-xl) / 4);
  }

  [class~=my-1-4],
:root [xl~=my-1-4] {
    margin-top: calc(36px / 4);
    margin-top: calc(var(--spacer-xl) / 4);
    margin-bottom: calc(36px / 4);
    margin-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=p-1-4],
:root [xl~=p-1-4] {
    padding: calc(36px / 4);
    padding: calc(var(--spacer-xl) / 4);
  }

  [class~=pt-1-4],
:root [xl~=pt-1-4] {
    padding-top: calc(36px / 4);
    padding-top: calc(var(--spacer-xl) / 4);
  }

  [class~=pb-1-4],
:root [xl~=pb-1-4] {
    padding-bottom: calc(36px / 4);
    padding-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=pl-1-4],
:root [xl~=pl-1-4] {
    padding-left: calc(36px / 4);
    padding-left: calc(var(--spacer-xl) / 4);
  }

  [class~=pr-1-4],
:root [xl~=pr-1-4] {
    padding-right: calc(36px / 4);
    padding-right: calc(var(--spacer-xl) / 4);
  }

  [class~=px-1-4],
:root [xl~=px-1-4] {
    padding-left: calc(36px / 4);
    padding-left: calc(var(--spacer-xl) / 4);
    padding-right: calc(36px / 4);
    padding-right: calc(var(--spacer-xl) / 4);
  }

  [class~=py-1-4],
:root [xl~=py-1-4] {
    padding-top: calc(36px / 4);
    padding-top: calc(var(--spacer-xl) / 4);
    padding-bottom: calc(36px / 4);
    padding-bottom: calc(var(--spacer-xl) / 4);
  }

  [class~=h-1-4],
:root [xl~=h-1-4] {
    height: calc(36px / 4);
    height: calc(var(--spacer-xl) / 4);
  }

  [class~=w-1-4],
:root [xl~=w-1-4] {
    width: calc(36px / 4);
    width: calc(var(--spacer-xl) / 4);
  }

  [class~=m-1-5],
:root [xl~=m-1-5] {
    margin: calc(36px / 5);
    margin: calc(var(--spacer-xl) / 5);
  }

  [class~=mt-1-5],
:root [xl~=mt-1-5] {
    margin-top: calc(36px / 5);
    margin-top: calc(var(--spacer-xl) / 5);
  }

  [class~=mb-1-5],
:root [xl~=mb-1-5] {
    margin-bottom: calc(36px / 5);
    margin-bottom: calc(var(--spacer-xl) / 5);
  }

  [class~=ml-1-5],
:root [xl~=ml-1-5] {
    margin-left: calc(36px / 5);
    margin-left: calc(var(--spacer-xl) / 5);
  }

  [class~=mr-1-5],
:root [xl~=mr-1-5] {
    margin-right: calc(36px / 5);
    margin-right: calc(var(--spacer-xl) / 5);
  }

  [class~=mx-1-5],
:root [xl~=mx-1-5] {
    margin-left: calc(36px / 5);
    margin-left: calc(var(--spacer-xl) / 5);
    margin-right: calc(36px / 5);
    margin-right: calc(var(--spacer-xl) / 5);
  }

  [class~=my-1-5],
:root [xl~=my-1-5] {
    margin-top: calc(36px / 5);
    margin-top: calc(var(--spacer-xl) / 5);
    margin-bottom: calc(36px / 5);
    margin-bottom: calc(var(--spacer-xl) / 5);
  }

  [class~=p-1-5],
:root [xl~=p-1-5] {
    padding: calc(36px / 5);
    padding: calc(var(--spacer-xl) / 5);
  }

  [class~=pt-1-5],
:root [xl~=pt-1-5] {
    padding-top: calc(36px / 5);
    padding-top: calc(var(--spacer-xl) / 5);
  }

  [class~=pb-1-5],
:root [xl~=pb-1-5] {
    padding-bottom: calc(36px / 5);
    padding-bottom: calc(var(--spacer-xl) / 5);
  }

  [class~=pl-1-5],
:root [xl~=pl-1-5] {
    padding-left: calc(36px / 5);
    padding-left: calc(var(--spacer-xl) / 5);
  }

  [class~=pr-1-5],
:root [xl~=pr-1-5] {
    padding-right: calc(36px / 5);
    padding-right: calc(var(--spacer-xl) / 5);
  }

  [class~=px-1-5],
:root [xl~=px-1-5] {
    padding-left: calc(36px / 5);
    padding-left: calc(var(--spacer-xl) / 5);
    padding-right: calc(36px / 5);
    padding-right: calc(var(--spacer-xl) / 5);
  }

  [class~=py-1-5],
:root [xl~=py-1-5] {
    padding-top: calc(36px / 5);
    padding-top: calc(var(--spacer-xl) / 5);
    padding-bottom: calc(36px / 5);
    padding-bottom: calc(var(--spacer-xl) / 5);
  }

  [class~=h-1-5],
:root [xl~=h-1-5] {
    height: calc(36px / 5);
    height: calc(var(--spacer-xl) / 5);
  }

  [class~=w-1-5],
:root [xl~=w-1-5] {
    width: calc(36px / 5);
    width: calc(var(--spacer-xl) / 5);
  }

  [class~=m-1-6],
:root [xl~=m-1-6] {
    margin: calc(36px / 6);
    margin: calc(var(--spacer-xl) / 6);
  }

  [class~=mt-1-6],
:root [xl~=mt-1-6] {
    margin-top: calc(36px / 6);
    margin-top: calc(var(--spacer-xl) / 6);
  }

  [class~=mb-1-6],
:root [xl~=mb-1-6] {
    margin-bottom: calc(36px / 6);
    margin-bottom: calc(var(--spacer-xl) / 6);
  }

  [class~=ml-1-6],
:root [xl~=ml-1-6] {
    margin-left: calc(36px / 6);
    margin-left: calc(var(--spacer-xl) / 6);
  }

  [class~=mr-1-6],
:root [xl~=mr-1-6] {
    margin-right: calc(36px / 6);
    margin-right: calc(var(--spacer-xl) / 6);
  }

  [class~=mx-1-6],
:root [xl~=mx-1-6] {
    margin-left: calc(36px / 6);
    margin-left: calc(var(--spacer-xl) / 6);
    margin-right: calc(36px / 6);
    margin-right: calc(var(--spacer-xl) / 6);
  }

  [class~=my-1-6],
:root [xl~=my-1-6] {
    margin-top: calc(36px / 6);
    margin-top: calc(var(--spacer-xl) / 6);
    margin-bottom: calc(36px / 6);
    margin-bottom: calc(var(--spacer-xl) / 6);
  }

  [class~=p-1-6],
:root [xl~=p-1-6] {
    padding: calc(36px / 6);
    padding: calc(var(--spacer-xl) / 6);
  }

  [class~=pt-1-6],
:root [xl~=pt-1-6] {
    padding-top: calc(36px / 6);
    padding-top: calc(var(--spacer-xl) / 6);
  }

  [class~=pb-1-6],
:root [xl~=pb-1-6] {
    padding-bottom: calc(36px / 6);
    padding-bottom: calc(var(--spacer-xl) / 6);
  }

  [class~=pl-1-6],
:root [xl~=pl-1-6] {
    padding-left: calc(36px / 6);
    padding-left: calc(var(--spacer-xl) / 6);
  }

  [class~=pr-1-6],
:root [xl~=pr-1-6] {
    padding-right: calc(36px / 6);
    padding-right: calc(var(--spacer-xl) / 6);
  }

  [class~=px-1-6],
:root [xl~=px-1-6] {
    padding-left: calc(36px / 6);
    padding-left: calc(var(--spacer-xl) / 6);
    padding-right: calc(36px / 6);
    padding-right: calc(var(--spacer-xl) / 6);
  }

  [class~=py-1-6],
:root [xl~=py-1-6] {
    padding-top: calc(36px / 6);
    padding-top: calc(var(--spacer-xl) / 6);
    padding-bottom: calc(36px / 6);
    padding-bottom: calc(var(--spacer-xl) / 6);
  }

  [class~=h-1-6],
:root [xl~=h-1-6] {
    height: calc(36px / 6);
    height: calc(var(--spacer-xl) / 6);
  }

  [class~=w-1-6],
:root [xl~=w-1-6] {
    width: calc(36px / 6);
    width: calc(var(--spacer-xl) / 6);
  }

  [class~=m-1-7],
:root [xl~=m-1-7] {
    margin: calc(36px / 7);
    margin: calc(var(--spacer-xl) / 7);
  }

  [class~=mt-1-7],
:root [xl~=mt-1-7] {
    margin-top: calc(36px / 7);
    margin-top: calc(var(--spacer-xl) / 7);
  }

  [class~=mb-1-7],
:root [xl~=mb-1-7] {
    margin-bottom: calc(36px / 7);
    margin-bottom: calc(var(--spacer-xl) / 7);
  }

  [class~=ml-1-7],
:root [xl~=ml-1-7] {
    margin-left: calc(36px / 7);
    margin-left: calc(var(--spacer-xl) / 7);
  }

  [class~=mr-1-7],
:root [xl~=mr-1-7] {
    margin-right: calc(36px / 7);
    margin-right: calc(var(--spacer-xl) / 7);
  }

  [class~=mx-1-7],
:root [xl~=mx-1-7] {
    margin-left: calc(36px / 7);
    margin-left: calc(var(--spacer-xl) / 7);
    margin-right: calc(36px / 7);
    margin-right: calc(var(--spacer-xl) / 7);
  }

  [class~=my-1-7],
:root [xl~=my-1-7] {
    margin-top: calc(36px / 7);
    margin-top: calc(var(--spacer-xl) / 7);
    margin-bottom: calc(36px / 7);
    margin-bottom: calc(var(--spacer-xl) / 7);
  }

  [class~=p-1-7],
:root [xl~=p-1-7] {
    padding: calc(36px / 7);
    padding: calc(var(--spacer-xl) / 7);
  }

  [class~=pt-1-7],
:root [xl~=pt-1-7] {
    padding-top: calc(36px / 7);
    padding-top: calc(var(--spacer-xl) / 7);
  }

  [class~=pb-1-7],
:root [xl~=pb-1-7] {
    padding-bottom: calc(36px / 7);
    padding-bottom: calc(var(--spacer-xl) / 7);
  }

  [class~=pl-1-7],
:root [xl~=pl-1-7] {
    padding-left: calc(36px / 7);
    padding-left: calc(var(--spacer-xl) / 7);
  }

  [class~=pr-1-7],
:root [xl~=pr-1-7] {
    padding-right: calc(36px / 7);
    padding-right: calc(var(--spacer-xl) / 7);
  }

  [class~=px-1-7],
:root [xl~=px-1-7] {
    padding-left: calc(36px / 7);
    padding-left: calc(var(--spacer-xl) / 7);
    padding-right: calc(36px / 7);
    padding-right: calc(var(--spacer-xl) / 7);
  }

  [class~=py-1-7],
:root [xl~=py-1-7] {
    padding-top: calc(36px / 7);
    padding-top: calc(var(--spacer-xl) / 7);
    padding-bottom: calc(36px / 7);
    padding-bottom: calc(var(--spacer-xl) / 7);
  }

  [class~=h-1-7],
:root [xl~=h-1-7] {
    height: calc(36px / 7);
    height: calc(var(--spacer-xl) / 7);
  }

  [class~=w-1-7],
:root [xl~=w-1-7] {
    width: calc(36px / 7);
    width: calc(var(--spacer-xl) / 7);
  }

  [class~=m-0],
:root [xl~=m-0] {
    margin: 0;
  }

  [class~=mt-0],
:root [xl~=mt-0] {
    margin-top: 0;
  }

  [class~=mb-0],
:root [xl~=mb-0] {
    margin-bottom: 0;
  }

  [class~=ml-0],
:root [xl~=ml-0] {
    margin-left: 0;
  }

  [class~=mr-0],
:root [xl~=mr-0] {
    margin-right: 0;
  }

  [class~=mx-0],
:root [xl~=mx-0] {
    margin-left: 0;
    margin-right: 0;
  }

  [class~=my-0],
:root [xl~=my-0] {
    margin-top: 0;
    margin-bottom: 0;
  }

  [class~=p-0],
:root [xl~=p-0] {
    padding: 0;
  }

  [class~=pt-0],
:root [xl~=pt-0] {
    padding-top: 0;
  }

  [class~=pb-0],
:root [xl~=pb-0] {
    padding-bottom: 0;
  }

  [class~=pl-0],
:root [xl~=pl-0] {
    padding-left: 0;
  }

  [class~=pr-0],
:root [xl~=pr-0] {
    padding-right: 0;
  }

  [class~=px-0],
:root [xl~=px-0] {
    padding-left: 0;
    padding-right: 0;
  }

  [class~=py-0],
:root [xl~=py-0] {
    padding-top: 0;
    padding-bottom: 0;
  }

  [class~=h-0],
:root [xl~=h-0] {
    height: 0;
  }

  [class~=w-0],
:root [xl~=w-0] {
    width: 0;
  }

  [class~=gutter],
:root [xl~=gutter] {
    margin-left: calc(36px * -1);
    margin-left: calc(var(--gutter-xl) * -1);
    margin-right: calc(36px * -1);
    margin-right: calc(var(--gutter-xl) * -1);
  }
  [class~=gutter] > *,
:root [xl~=gutter] > * {
    padding-left: calc(36px * 1);
    padding-left: calc(var(--gutter-xl) * 1);
    padding-right: calc(36px * 1);
    padding-right: calc(var(--gutter-xl) * 1);
  }

  [class~=gutter-1-2],
:root [xl~=gutter-1-2] {
    margin-left: calc(36px * -0.5);
    margin-left: calc(var(--gutter-xl) * -0.5);
    margin-right: calc(36px * -0.5);
    margin-right: calc(var(--gutter-xl) * -0.5);
  }
  [class~=gutter-1-2] > *,
:root [xl~=gutter-1-2] > * {
    padding-left: calc(36px * 0.5);
    padding-left: calc(var(--gutter-xl) * 0.5);
    padding-right: calc(36px * 0.5);
    padding-right: calc(var(--gutter-xl) * 0.5);
  }

  [class~=row-12],
:root [xl~=row-12] {
    min-height: 100vh;
  }

  [class~=row-11],
:root [xl~=row-11] {
    min-height: 91.6666666667vh;
  }

  [class~=row-10],
:root [xl~=row-10] {
    min-height: 83.3333333333vh;
  }

  [class~=row-9],
:root [xl~=row-9] {
    min-height: 75vh;
  }

  [class~=row-8],
:root [xl~=row-8] {
    min-height: 66.6666666667vh;
  }

  [class~=row-7],
:root [xl~=row-7] {
    min-height: 58.3333333333vh;
  }

  [class~=row-6],
:root [xl~=row-6] {
    min-height: 50vh;
  }

  [class~=row-5],
:root [xl~=row-5] {
    min-height: 41.6666666667vh;
  }

  [class~=row-4],
:root [xl~=row-4] {
    min-height: 33.3333333333vh;
  }

  [class~=row-3],
:root [xl~=row-3] {
    min-height: 25vh;
  }

  [class~=row-2],
:root [xl~=row-2] {
    min-height: 16.6666666667vh;
  }

  [class~=row-1],
:root [xl~=row-1] {
    min-height: 8.3333333333vh;
  }

  [class~=col-12],
:root [xl~=col-12] {
    width: 100%;
  }

  [class~=col-11],
:root [xl~=col-11] {
    width: 91.6666666667%;
  }

  [class~=col-10],
:root [xl~=col-10] {
    width: 83.3333333333%;
  }

  [class~=col-9],
:root [xl~=col-9] {
    width: 75%;
  }

  [class~=col-8],
:root [xl~=col-8] {
    width: 66.6666666667%;
  }

  [class~=col-7],
:root [xl~=col-7] {
    width: 58.3333333333%;
  }

  [class~=col-6],
:root [xl~=col-6] {
    width: 50%;
  }

  [class~=col-5],
:root [xl~=col-5] {
    width: 41.6666666667%;
  }

  [class~=col-4],
:root [xl~=col-4] {
    width: 33.3333333333%;
  }

  [class~=col-3],
:root [xl~=col-3] {
    width: 25%;
  }

  [class~=col-2],
:root [xl~=col-2] {
    width: 16.6666666667%;
  }

  [class~=col-1],
:root [xl~=col-1] {
    width: 8.3333333333%;
  }

  [class~=row],
[class~=column],
:root [xl~=row],
:root [xl~=column] {
    display: flex;
    flex-wrap: wrap;
  }
  [class~=row] > *,
[class~=column] > *,
:root [xl~=row] > *,
:root [xl~=column] > * {
    flex-grow: 0;
  }

  [class~=column],
:root [xl~=column] {
    flex-direction: column;
  }

  [class~=row],
:root [xl~=row] {
    flex-direction: row;
  }

  [class~=column-reverse],
:root [xl~=column-reverse] {
    flex-direction: column-reverse;
  }

  [class~=row-reverse],
:root [xl~=row-reverse] {
    flex-direction: row-reverse;
  }

  [class~=row][class~=v-center], [class~=column][class~=h-center],
:root [xl~=row][xl~=v-center], :root [xl~=column][xl~=h-center] {
    align-items: center;
  }

  [class~=row][class~=v-start], [class~=column][class~=h-start],
:root [xl~=row][xl~=v-start], :root [xl~=column][xl~=h-start] {
    align-items: flex-start;
  }

  [class~=row][class~=v-end], [class~=column][class~=h-end],
:root [xl~=row][xl~=v-end], :root [xl~=column][xl~=h-end] {
    align-items: flex-end;
  }

  [class~=row][class~=v-stretch], [class~=column][class~=h-stretch],
:root [xl~=row][xl~=v-stretch], :root [xl~=column][xl~=h-stretch] {
    align-items: stretch;
  }

  [class~=row][class~=h-center], [class~=column][class~=v-center],
:root [xl~=row][xl~=h-center], :root [xl~=column][xl~=v-center] {
    justify-content: center;
  }

  [class~=row][class~=h-start], [class~=column][class~=v-start],
:root [xl~=row][xl~=h-start], :root [xl~=column][xl~=v-start] {
    justify-content: flex-start;
  }

  [class~=row][class~=h-end], [class~=column][class~=v-end],
:root [xl~=row][xl~=h-end], :root [xl~=column][xl~=v-end] {
    justify-content: flex-end;
  }

  [class~=row][class~=h-spacein], [class~=column][class~=v-spacein],
:root [xl~=row][xl~=h-spacein], :root [xl~=column][xl~=v-spacein] {
    justify-content: space-between;
  }

  [class~=row][class~=h-spaceout], [class~=column][class~=v-spaceout],
:root [xl~=row][xl~=h-spaceout], :root [xl~=column][xl~=v-spaceout] {
    justify-content: space-around;
  }

  [class~=row] > [class~=v-self-center], [class~=column] > [class~=h-self-center],
:root [xl~=row] > [xl~=v-self-center], :root [xl~=column] > [xl~=h-self-center] {
    align-self: center;
  }

  [class~=row] > [class~=v-self-start], [class~=column] > [class~=h-self-start],
:root [xl~=row] > [xl~=v-self-start], :root [xl~=column] > [xl~=h-self-start] {
    align-self: flex-start;
  }

  [class~=row] > [class~=v-self-end], [class~=column] > [class~=h-self-end],
:root [xl~=row] > [xl~=v-self-end], :root [xl~=column] > [xl~=h-self-end] {
    align-self: flex-end;
  }

  [class~=row] > [class~=v-self-stretch], [class~=column] > [class~=h-self-stretch],
:root [xl~=row] > [xl~=v-self-stretch], :root [xl~=column] > [xl~=h-self-stretch] {
    align-self: stretch;
  }

  [class~=row] > [class~=v-self-selfstart], [class~=column] > [class~=h-self-selfstart],
:root [xl~=row] > [xl~=v-self-selfstart], :root [xl~=column] > [xl~=h-self-selfstart] {
    align-self: self-start;
  }

  [class~=row] > [class~=v-self-selfend], [class~=column] > [class~=h-self-selfend],
:root [xl~=row] > [xl~=v-self-selfend], :root [xl~=column] > [xl~=h-self-selfend] {
    align-self: self-end;
  }

  [class~=row] > [class~=h-self-center], [class~=column] > [class~=v-self-center],
:root [xl~=row] > [xl~=h-self-center], :root [xl~=column] > [xl~=v-self-center] {
    justify-self: center;
  }

  [class~=row] > [class~=h-self-start], [class~=column] > [class~=v-self-start],
:root [xl~=row] > [xl~=h-self-start], :root [xl~=column] > [xl~=v-self-start] {
    justify-self: flex-start;
  }

  [class~=row] > [class~=h-self-end], [class~=column] > [class~=v-self-end],
:root [xl~=row] > [xl~=h-self-end], :root [xl~=column] > [xl~=v-self-end] {
    justify-self: flex-end;
  }

  [class~=row] > [class~=h-self-stretch], [class~=column] > [class~=v-self-stretch],
:root [xl~=row] > [xl~=h-self-stretch], :root [xl~=column] > [xl~=v-self-stretch] {
    justify-self: stretch;
  }

  [class~=row] > [class~=h-self-selfstart], [class~=column] > [class~=v-self-selfstart],
:root [xl~=row] > [xl~=h-self-selfstart], :root [xl~=column] > [xl~=v-self-selfstart] {
    justify-self: self-start;
  }

  [class~=row] > [class~=h-self-selfend], [class~=column] > [class~=v-self-selfend],
:root [xl~=row] > [xl~=h-self-selfend], :root [xl~=column] > [xl~=v-self-selfend] {
    justify-self: self-end;
  }

  [class~=row] > [class~=h-self-left], [class~=column] > [class~=v-self-left],
:root [xl~=row] > [xl~=h-self-left], :root [xl~=column] > [xl~=v-self-left] {
    justify-self: left;
  }

  [class~=row] > [class~=h-self-right], [class~=column] > [class~=v-self-right],
:root [xl~=row] > [xl~=h-self-right], :root [xl~=column] > [xl~=v-self-right] {
    justify-self: right;
  }

  .flex-grow-xl-1 {
    flex-grow: 1;
  }

  .flex-grow-xl-2 {
    flex-grow: 2;
  }

  .flex-grow-xl-3 {
    flex-grow: 3;
  }

  .flex-grow-xl-4 {
    flex-grow: 4;
  }

  .flex-grow-xl-5 {
    flex-grow: 5;
  }

  .flex-grow-xl-6 {
    flex-grow: 6;
  }

  .flex-grow-xl-7 {
    flex-grow: 7;
  }

  .flex-grow-xl-8 {
    flex-grow: 8;
  }

  .flex-grow-xl-9 {
    flex-grow: 9;
  }

  .flex-grow-xl-10 {
    flex-grow: 10;
  }

  [class*=d-flex],
:root [xl*=d-flex] {
    display: flex;
  }

  [class*=d-inline],
:root [xl*=d-inline] {
    display: inline;
  }

  [class*=d-inline-block],
:root [xl*=d-inline-block] {
    display: inline-block;
  }

  [class*=d-block],
:root [xl*=d-block] {
    display: block;
  }

  [class*=absolute],
:root [xl*=absolute] {
    position: absolute;
  }

  [class*=fixed],
:root [xl*=fixed] {
    position: fixed;
  }

  [class*=inherit],
:root [xl*=inherit] {
    position: inherit;
  }

  [class*=relative],
:root [xl*=relative] {
    position: relative;
  }

  [class*=sticky],
:root [xl*=sticky] {
    position: -webkit-sticky;
    position: sticky;
  }

  [class*=top-0],
:root [xl*=top-0] {
    top: 0;
  }

  [class*=top-inherit],
:root [xl*=top-inherit] {
    top: inherit;
  }

  [class*=left-0],
:root [xl*=left-0] {
    left: 0;
  }

  [class*=left-inherit],
:root [xl*=left-inherit] {
    left: inherit;
  }

  [class*=right-0],
:root [xl*=right-0] {
    right: 0;
  }

  [class*=right-inherit],
:root [xl*=right-inherit] {
    right: inherit;
  }

  [class*=bottom-0],
:root [xl*=bottom-0] {
    bottom: 0;
  }

  [class*=bottom-inherit],
:root [xl*=bottom-inherit] {
    bottom: inherit;
  }

  [xl*=text-center] {
    text-align: center;
  }

  [xl*=text-left] {
    text-align: left;
  }

  [xl*=text-right] {
    text-align: right;
  }

  [xl*=text-justify] {
    text-align: justify;
  }
}
.modal {
  display: none;
  position: fixed;
  z-index: 2000;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(3, 79, 26, 0.9);
  background: rgba(var(--color-primary-500), 0.9);
  background: linear-gradient(-35deg, rgba(253, 213, 86, 1) 0%, rgba(3, 79, 26, 1) 100%);
  background: linear-gradient(-35deg, rgba(var(--color-secondary-400), 1) 0%, rgba(var(--color-primary-500), 1) 100%);
}
.modal .modal-content {
  background: rgba(var(--color-default-white), 1);
  position: relative;
  max-height: 88vh;
  min-height: 280px;
  max-width: 100vw;
  transition: all 0.5s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(32px * 2);
  padding: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs-l) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-sm) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .modal .modal-content {
    padding: calc(24px * 2);
    padding: calc(var(--spacer-sm-l) * 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-height: 100vh;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .modal .modal-content {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .modal .modal-content {
    padding: calc(32px * 2);
    padding: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .modal .modal-content {
    padding: calc(36px * 2);
    padding: calc(var(--spacer-xl) * 2);
  }
}
.modal .modal-content > .circle-button {
  position: absolute;
  top: 0;
  right: 0;
}

.modal-video {
  background: black;
}
.modal-video.active {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 1;
}
.modal-video.active video {
  width: 100%;
  height: auto;
}
.modal-video .video-close {
  position: absolute;
  z-index: 1;
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
  cursor: pointer;
  line-height: 1;
  transition: all 0.666s ease 0s;
  font-size: 2rem;
  top: calc(32px * 2);
  top: calc(var(--spacer-default) * 2);
  right: calc(32px * 2);
  right: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .modal-video .video-close {
    font-size: 1.5rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-xs) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .modal-video .video-close {
    font-size: 1.4rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-xs-l) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .modal-video .video-close {
    font-size: 1.6rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-sm) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .modal-video .video-close {
    font-size: 1.5rem;
    top: calc(24px * 2);
    top: calc(var(--spacer-sm-l) * 2);
    right: calc(24px * 2);
    right: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .modal-video .video-close {
    font-size: 1.7rem;
    top: calc(28px * 2);
    top: calc(var(--spacer-md) * 2);
    right: calc(28px * 2);
    right: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .modal-video .video-close {
    font-size: 1.8rem;
    top: calc(32px * 2);
    top: calc(var(--spacer-lg) * 2);
    right: calc(32px * 2);
    right: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .modal-video .video-close {
    font-size: 2rem;
    top: calc(36px * 2);
    top: calc(var(--spacer-xl) * 2);
    right: calc(36px * 2);
    right: calc(var(--spacer-xl) * 2);
  }
}
.modal-video .video-close:hover {
  transform: scale(1.5);
  transition: all 0.666s ease 0s;
}
body.modal-header-video-active .modal-video {
  -webkit-animation: fadeIn 1.66s 0s ease forwards 1;
          animation: fadeIn 1.66s 0s ease forwards 1;
}

body.modal-header-video-active #main-header {
  opacity: 0;
  pointer-events: none;
  transition: all 0.66s ease;
}

/*Selection*/
::-moz-selection {
  background: rgba(252, 203, 46, 1);
  background: rgba(var(--color-secondary-500), 1);
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
}
::selection {
  background: rgba(252, 203, 46, 1);
  background: rgba(var(--color-secondary-500), 1);
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
}

nav, button, svg, img {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

/*Scrollbar*/
::-webkit-scrollbar-track {
  border-radius: 0px;
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-900), 1);
}

::-webkit-scrollbar {
  width: 3px;
  background-color: rgba(0, 0, 0, 1);
  background-color: rgba(var(--color-primary-900), 1);
}

::-webkit-scrollbar-thumb {
  border: 3px solid rgb(255, 255, 255);
  border: 3px solid rgb(var(--color-primary-contrast-900));
  border-radius: 0px;
  background-color: rgb(255, 255, 255);
  background-color: rgb(var(--color-primary-contrast-900));
}

/*Common for sections*/
.section {
  min-height: 50vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: calc(32px * 2);
  padding-top: calc(var(--spacer-default) * 2);
  padding-bottom: calc(32px * 2);
  padding-bottom: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .section {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .section {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-xs-l) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .section {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-sm) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .section {
    padding-top: calc(24px * 2);
    padding-top: calc(var(--spacer-sm-l) * 2);
    padding-bottom: calc(24px * 2);
    padding-bottom: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .section {
    padding-top: calc(28px * 2);
    padding-top: calc(var(--spacer-md) * 2);
    padding-bottom: calc(28px * 2);
    padding-bottom: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .section {
    padding-top: calc(32px * 2);
    padding-top: calc(var(--spacer-lg) * 2);
    padding-bottom: calc(32px * 2);
    padding-bottom: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .section {
    padding-top: calc(36px * 2);
    padding-top: calc(var(--spacer-xl) * 2);
    padding-bottom: calc(36px * 2);
    padding-bottom: calc(var(--spacer-xl) * 2);
  }
}
.section > div {
  min-height: 0;
}

.section-title {
  margin-bottom: calc(32px * 2);
  margin-bottom: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .section-title {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs) * 2);
    max-width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .section-title {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .section-title {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-sm) * 2);
    max-width: 80%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .section-title {
    margin-bottom: calc(24px * 2);
    margin-bottom: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .section-title {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-md) * 2);
    max-width: 640px;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .section-title {
    margin-bottom: calc(32px * 2);
    margin-bottom: calc(var(--spacer-lg) * 2);
    max-width: 850px;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .section-title {
    margin-bottom: calc(36px * 2);
    margin-bottom: calc(var(--spacer-xl) * 2);
  }
}
.section-title * {
  margin: 0;
}

.dark-section h2 {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}
.dark-section .h3 {
  color: rgba(var(--color-accent-500), 1);
  margin-bottom: calc(32px * 0.25);
  margin-bottom: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .dark-section .h3 {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .dark-section .h3 {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .dark-section .h3 {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .dark-section .h3 {
    margin-bottom: calc(24px * 0.25);
    margin-bottom: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .dark-section .h3 {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .dark-section .h3 {
    margin-bottom: calc(32px * 0.25);
    margin-bottom: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .dark-section .h3 {
    margin-bottom: calc(36px * 0.25);
    margin-bottom: calc(var(--spacer-xl) * 0.25);
  }
}
.dark-section .h4 {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}

/*img*/
img {
  width: 100%;
  height: auto;
  display: flex;
}

.img-fit-cover {
  height: 100%;
}
.img-fit-cover img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}

.background-image {
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center center !important;
}

/*Cards*/
.card > article {
  border: 1px solid rgba(var(--color-lgray-500), 1);
  height: 100%;
}
.card header a {
  display: block;
  height: 100%;
}
.card header a img {
  display: block;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.card section {
  padding: calc(32px * 1);
  padding: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .card section {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .card section {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .card section {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .card section {
    padding: calc(24px * 1);
    padding: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .card section {
    padding: calc(28px * 1);
    padding: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .card section {
    padding: calc(32px * 1);
    padding: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .card section {
    padding: calc(36px * 1);
    padding: calc(var(--spacer-xl) * 1);
  }
}
.card.big {
  margin-bottom: calc(32px * 2);
  margin-bottom: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .card.big {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .card.big {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .card.big {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .card.big {
    margin-bottom: calc(24px * 2);
    margin-bottom: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .card.big {
    margin-bottom: calc(28px * 2);
    margin-bottom: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .card.big {
    margin-bottom: calc(32px * 2);
    margin-bottom: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .card.big {
    margin-bottom: calc(36px * 2);
    margin-bottom: calc(var(--spacer-xl) * 2);
  }
}
.card.big section {
  padding: calc(32px * 2);
  padding: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .card.big section {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs) * 2);
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .card.big section {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .card.big section {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .card.big section {
    padding: calc(24px * 2);
    padding: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .card.big section {
    padding: calc(28px * 2);
    padding: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .card.big section {
    padding: calc(32px * 2);
    padding: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .card.big section {
    padding: calc(36px * 2);
    padding: calc(var(--spacer-xl) * 2);
  }
}

small {
  font-size: 0.75em;
}

strong, b {
  font-weight: 600;
}

.nowrap {
  flex-wrap: nowrap;
}

h2 strong {
  font-weight: 900;
}

.h5.label {
  color: rgba(var(--color-accent-500), 1) !important;
  text-transform: uppercase;
}

small.h5.label {
  font-size: 0.75em;
}

.circle {
  border-radius: 50%;
}

.italic {
  font-style: italic;
}

.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.img-fluid {
  width: 100%;
  height: auto;
}

.fit-cover {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.fit-contain {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.icon-divider {
  font-size: 32px/8;
  font-size: var(--spacer-default)/8;
}

.video-1-1, .image-1-1 {
  position: relative;
  width: 100%;
  padding-top: 100%;
}

.video-16-9, .image-16-9 {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}

.video-4-3, .image-4-3 {
  position: relative;
  width: 100%;
  padding-top: 75%;
}

.video-16-10, .image-16-10 {
  position: relative;
  width: 100%;
  padding-top: 62.5%;
}

[class*=video-] video {
  position: absolute;
  width: 101%;
  height: 101%;
  top: -0.5%;
  left: -0.5%;
  -o-object-fit: cover;
     object-fit: cover;
}

[class*=video-] {
  overflow: hidden;
}

[class*=video-] {
  border-radius: calc(32px * 0.333);
  border-radius: calc(var(--spacer-default) * 0.333);
}

[class*=image-] img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  -o-object-fit: contain;
     object-fit: contain;
}

.h-default-100 {
  height: 100%;
}

.w-default-100 {
  width: 100%;
}

.hidden-default {
  display: none !important;
}

.visible-default {
  display: block;
}

time {
  font-size: 1.1rem;
}

@media (min-width: 0px) and (max-width: 1200px) {
  .icon-divider {
    font-size: 28px/8;
    font-size: var(--spacer-xs)/8;
  }

  [class*=video-] {
    border-radius: calc(28px * 0.333);
    border-radius: calc(var(--spacer-xs) * 0.333);
  }

  .h-xs-100 {
    height: 100%;
  }

  .w-xs-100 {
    width: 100%;
  }

  .hidden-xs {
    display: none !important;
  }

  .visible-xs {
    display: block;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .icon-divider {
    font-size: 28px/8;
    font-size: var(--spacer-xs-l)/8;
  }

  [class*=video-] {
    border-radius: calc(28px * 0.333);
    border-radius: calc(var(--spacer-xs-l) * 0.333);
  }

  .h-xs-l-100 {
    height: 100%;
  }

  .w-xs-l-100 {
    width: 100%;
  }

  .hidden-xs-l {
    display: none !important;
  }

  .visible-xs-l {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .icon-divider {
    font-size: 28px/8;
    font-size: var(--spacer-sm)/8;
  }

  [class*=video-] {
    border-radius: calc(28px * 0.333);
    border-radius: calc(var(--spacer-sm) * 0.333);
  }

  .h-sm-100 {
    height: 100%;
  }

  .w-sm-100 {
    width: 100%;
  }

  .hidden-sm {
    display: none !important;
  }

  .visible-sm {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .icon-divider {
    font-size: 24px/8;
    font-size: var(--spacer-sm-l)/8;
  }

  [class*=video-] {
    border-radius: calc(24px * 0.333);
    border-radius: calc(var(--spacer-sm-l) * 0.333);
  }

  .h-sm-l-100 {
    height: 100%;
  }

  .w-sm-l-100 {
    width: 100%;
  }

  .hidden-sm-l {
    display: none !important;
  }

  .visible-sm-l {
    display: block;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .icon-divider {
    font-size: 28px/8;
    font-size: var(--spacer-md)/8;
  }

  [class*=video-] {
    border-radius: calc(28px * 0.333);
    border-radius: calc(var(--spacer-md) * 0.333);
  }

  .h-md-100 {
    height: 100%;
  }

  .w-md-100 {
    width: 100%;
  }

  .hidden-md {
    display: none !important;
  }

  .visible-md {
    display: block;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .icon-divider {
    font-size: 32px/8;
    font-size: var(--spacer-lg)/8;
  }

  [class*=video-] {
    border-radius: calc(32px * 0.333);
    border-radius: calc(var(--spacer-lg) * 0.333);
  }

  .h-lg-100 {
    height: 100%;
  }

  .w-lg-100 {
    width: 100%;
  }

  .hidden-lg {
    display: none !important;
  }

  .visible-lg {
    display: block;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .icon-divider {
    font-size: 36px/8;
    font-size: var(--spacer-xl)/8;
  }

  [class*=video-] {
    border-radius: calc(36px * 0.333);
    border-radius: calc(var(--spacer-xl) * 0.333);
  }

  .h-xl-100 {
    height: 100%;
  }

  .w-xl-100 {
    width: 100%;
  }

  .hidden-xl {
    display: none !important;
  }

  .visible-xl {
    display: block;
  }
}
#main-header {
  position: fixed;
  left: 0;
  top: -100%;
  width: 100%;
  z-index: 10;
  -webkit-animation: slidedown 0.666s 0.666s ease 1 forwards;
          animation: slidedown 0.666s 0.666s ease 1 forwards;
}
#main-header:after {
  position: absolute;
  z-index: 1;
  background: rgba(3, 79, 26, 1);
  background: rgba(var(--color-primary-500), 1);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
}
@media (min-width: 0px) and (max-width: 1200px) {
  body.primary-menu-active #main-header {
    display: block;
    z-index: 100;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header {
    display: block;
    z-index: 100;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body.primary-menu-active #main-header {
    display: block;
    z-index: 100;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header {
    display: block;
    z-index: 100;
  }
}
body.admin-bar #main-header {
  top: 32px;
}
@media screen and (max-width: 782px) {
  body.admin-bar #main-header {
    top: 46px !important;
  }
}
#main-header #navigation-main {
  border-bottom: 1px solid rgba(var(--color-lgray-500), 1);
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #navigation-main {
    border-top: 1px solid transparent;
  }
  body.scrolled #main-header #navigation-main {
    border-top: 1px solid rgba(var(--color-lgray-500), 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header #navigation-main {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #navigation-main {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header #navigation-main {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header #navigation-main {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header #navigation-main {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header #navigation-main {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header #navigation-main {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
  }
}
#main-header #navigation-main > div {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: nowrap;
  background: 3, 79, 26;
  background: var(--color-primary-500);
  box-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.1);
  box-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
}
#main-header .logo {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
  height: calc(32px * 2);
  height: calc(var(--spacer-default) * 2);
  padding-left: calc(32px * 0.5);
  padding-left: calc(var(--spacer-default) * 0.5);
}
#main-header .logo img {
  -o-object-fit: contain;
     object-fit: contain;
  height: 50%;
  width: auto;
  transition: all 0.666s ease;
}
@media (max-width: 767px) {
  #main-header .logo img {
    height: 50%;
  }
}
body.scrolled #main-header .logo img, body.primary-menu-active #main-header .logo img {
  height: 50%;
  transition: all 0.666s ease;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .logo {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs) * 2);
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--spacer-xs) * 0.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .logo {
    height: calc(28px * 2);
    height: calc(var(--spacer-xs-l) * 2);
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--spacer-xs-l) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header .logo {
    height: calc(28px * 2);
    height: calc(var(--spacer-sm) * 2);
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--spacer-sm) * 0.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .logo {
    height: calc(24px * 2);
    height: calc(var(--spacer-sm-l) * 2);
    padding-left: calc(24px * 0.5);
    padding-left: calc(var(--spacer-sm-l) * 0.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header .logo {
    height: calc(28px * 2);
    height: calc(var(--spacer-md) * 2);
    padding-left: calc(28px * 0.5);
    padding-left: calc(var(--spacer-md) * 0.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header .logo {
    height: calc(32px * 2);
    height: calc(var(--spacer-lg) * 2);
    padding-left: calc(32px * 0.5);
    padding-left: calc(var(--spacer-lg) * 0.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header .logo {
    height: calc(36px * 2);
    height: calc(var(--spacer-xl) * 2);
    padding-left: calc(36px * 0.5);
    padding-left: calc(var(--spacer-xl) * 0.5);
  }
}
#main-header #home-link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
#main-header .menu-container {
  z-index: 2;
  position: relative;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -100vh;
    pointer-events: none;
    opacity: 1;
    background: #ffffff;
    background: var(--bg-light-default);
    width: 100%;
    left: 0;
    z-index: -1;
    transition: all 0.666s ease 0s;
  }
  body.primary-menu-active #main-header .menu-container {
    pointer-events: all;
    opacity: 1;
    box-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.1);
    box-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
    z-index: -1;
    top: calc(32px * 2);
    top: calc(var(--spacer-default) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(24px * 2);
    top: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 1201px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 1441px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(32px * 2);
    top: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (min-width: 1921px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(36px * 2);
    top: calc(var(--spacer-xl) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -100vh;
    pointer-events: none;
    opacity: 1;
    background: #ffffff;
    background: var(--bg-light-default);
    width: 100%;
    left: 0;
    z-index: -1;
    transition: all 0.666s ease 0s;
  }
  body.primary-menu-active #main-header .menu-container {
    pointer-events: all;
    opacity: 1;
    box-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.1);
    box-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
    z-index: -1;
    top: calc(32px * 2);
    top: calc(var(--spacer-default) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(24px * 2);
    top: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1201px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1441px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(32px * 2);
    top: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1921px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(36px * 2);
    top: calc(var(--spacer-xl) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -100vh;
    pointer-events: none;
    opacity: 1;
    background: #ffffff;
    background: var(--bg-light-default);
    width: 100%;
    left: 0;
    z-index: -1;
    transition: all 0.666s ease 0s;
  }
  body.primary-menu-active #main-header .menu-container {
    pointer-events: all;
    opacity: 1;
    box-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.1);
    box-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
    z-index: -1;
    top: calc(32px * 2);
    top: calc(var(--spacer-default) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(24px * 2);
    top: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 1201px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 1441px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(32px * 2);
    top: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (min-width: 1921px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(36px * 2);
    top: calc(var(--spacer-xl) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -100vh;
    pointer-events: none;
    opacity: 1;
    background: #ffffff;
    background: var(--bg-light-default);
    width: 100%;
    left: 0;
    z-index: -1;
    transition: all 0.666s ease 0s;
  }
  body.primary-menu-active #main-header .menu-container {
    pointer-events: all;
    opacity: 1;
    box-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.1);
    box-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
    z-index: -1;
    top: calc(32px * 2);
    top: calc(var(--spacer-default) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(24px * 2);
    top: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1201px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(28px * 2);
    top: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1441px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(32px * 2);
    top: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) and (min-width: 1921px) and (max-width: 10000px) {
  body.primary-menu-active #main-header .menu-container {
    top: calc(36px * 2);
    top: calc(var(--spacer-xl) * 2);
  }
}
#main-header .menu-container ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  height: 100%;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container ul {
    flex-direction: column;
    width: 100%;
  }
}
#main-header .menu-container ul li.js-modal-cart-trigger {
  display: none;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .menu-container ul li.js-modal-cart-trigger {
    display: block;
  }
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .menu-container ul li {
    width: 100%;
    text-align: center;
    padding: calc(28px * 0.25);
    padding: calc(var(--spacer-xs) * 0.25);
  }
  #main-header .menu-container ul li:not(:last-of-type) {
    border-bottom: 1px solid rgba(var(--color-lgray-500), 1);
  }
  #main-header .menu-container ul li:first-of-type {
    margin-top: calc(28px * 0.25);
    margin-top: calc(var(--spacer-xs) * 0.25);
  }
  #main-header .menu-container ul li:last-of-type {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container ul li {
    width: 100%;
    text-align: center;
    padding: calc(28px * 0.25);
    padding: calc(var(--spacer-xs-l) * 0.25);
  }
  #main-header .menu-container ul li:not(:last-of-type) {
    border-bottom: 1px solid rgba(var(--color-lgray-500), 1);
  }
  #main-header .menu-container ul li:first-of-type {
    margin-top: calc(28px * 0.25);
    margin-top: calc(var(--spacer-xs-l) * 0.25);
  }
  #main-header .menu-container ul li:last-of-type {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header .menu-container ul li {
    width: 100%;
    text-align: center;
    padding: calc(28px * 0.25);
    padding: calc(var(--spacer-sm) * 0.25);
  }
  #main-header .menu-container ul li:not(:last-of-type) {
    border-bottom: 1px solid rgba(var(--color-lgray-500), 1);
  }
  #main-header .menu-container ul li:first-of-type {
    margin-top: calc(28px * 0.25);
    margin-top: calc(var(--spacer-sm) * 0.25);
  }
  #main-header .menu-container ul li:last-of-type {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container ul li {
    width: 100%;
    text-align: center;
    padding: calc(24px * 0.25);
    padding: calc(var(--spacer-sm-l) * 0.25);
  }
  #main-header .menu-container ul li:not(:last-of-type) {
    border-bottom: 1px solid rgba(var(--color-lgray-500), 1);
  }
  #main-header .menu-container ul li:first-of-type {
    margin-top: calc(24px * 0.25);
    margin-top: calc(var(--spacer-sm-l) * 0.25);
  }
  #main-header .menu-container ul li:last-of-type {
    margin-bottom: calc(24px * 0.25);
    margin-bottom: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header .menu-container ul li {
    height: 100%;
  }
}
#main-header .menu-container ul li a {
  display: flex;
  align-items: center;
  color: #ffffff;
  border-bottom: 3px solid transparent;
  text-decoration: none;
  transition: all 0.666s ease 0s;
  margin: 0;
  padding: 0 calc(32px * 1);
  padding: 0 calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-xs) * 1);
    width: 100%;
    text-align: center;
    justify-content: center;
    margin: 0;
    color: #313131;
  }
  body.primary-menu-active #main-header .menu-container ul li a {
    font-size: 1.2rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-xs-l) * 1);
    width: 100%;
    text-align: center;
    justify-content: center;
    margin: 0;
    color: #313131;
  }
  body.primary-menu-active #main-header .menu-container ul li a {
    font-size: 1.12rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-sm) * 1);
    width: 100%;
    text-align: center;
    justify-content: center;
    margin: 0;
    color: #313131;
  }
  body.primary-menu-active #main-header .menu-container ul li a {
    font-size: 1.28rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(24px * 1);
    padding: 0 calc(var(--spacer-sm-l) * 1);
    width: 100%;
    text-align: center;
    justify-content: center;
    margin: 0;
    color: #313131;
  }
  body.primary-menu-active #main-header .menu-container ul li a {
    font-size: 1.2rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-md) * 1);
    height: 100%;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(32px * 1);
    padding: 0 calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header .menu-container ul li a {
    margin: 0;
    padding: 0 calc(36px * 1);
    padding: 0 calc(var(--spacer-xl) * 1);
  }
}
#main-header .menu-container ul li:hover a, #main-header .menu-container ul li.active a {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
  font-weight: 600;
  transition: all 0.666s ease 0s;
}
#main-header .menu-container ul li.btn-menu a {
  color: rgb(49, 49, 49);
  color: rgb(var(--color-secondary-contrast-500));
  background-color: rgba(252, 203, 46, 1);
  background-color: rgba(var(--color-secondary-500), 1);
}
#main-header .menu-container ul li.btn-menu:nth-child(odd) a {
  color: #313131;
  background-color: #ffffff;
}
#main-header button.hamburger-toggle {
  z-index: 1000;
  display: none;
  height: 100%;
  background: none;
  border-radius: 0 !important;
  outline: none;
  border: 0px none !important;
  cursor: pointer;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header button.hamburger-toggle {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #main-header button.hamburger-toggle svg {
    width: 18px;
    height: 18px;
  }
}
#main-header button.hamburger-toggle:hover {
  border: 0px none !important;
}
#main-header button.hamburger-toggle svg line {
  transition: all 0.666s ease;
}
body.scrolled #main-header button.hamburger-toggle svg line, body.dark-theme #main-header button.hamburger-toggle svg line, body.primary-menu-active #main-header button.hamburger-toggle svg line {
  stroke: #ffffff;
}
body.primary-menu-active #main-header button.hamburger-toggle svg #Ligne_201 {
  stroke-width: 0;
  transition: all 0.666s ease;
}
body.primary-menu-active #main-header button.hamburger-toggle svg #Ligne_200 {
  transform: translate(1757.5px, 173.5px) rotate(45deg);
  transform-origin: top left;
  transition: all 0.666s ease;
}
body.primary-menu-active #main-header button.hamburger-toggle svg #Ligne_202 {
  transform: translate(1757.5px, 193.5px) rotate(-45deg);
  transform-origin: top left;
  transition: all 0.666s ease;
}
#main-header .lang-switcher ul {
  display: flex;
  flex-direction: row;
}
#main-header .lang-switcher li {
  text-align: center;
  text-transform: uppercase;
  border-left: 1px solid rgba(var(--color-lgray-500), 1);
  width: calc(32px * 2);
  width: calc(var(--spacer-default) * 2);
  line-height: calc(32px * 2);
  line-height: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-header .lang-switcher li {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .lang-switcher li {
    width: calc(28px * 2);
    width: calc(var(--spacer-xs-l) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-header .lang-switcher li {
    width: calc(28px * 2);
    width: calc(var(--spacer-sm) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-header .lang-switcher li {
    width: calc(24px * 2);
    width: calc(var(--spacer-sm-l) * 2);
    line-height: calc(24px * 2);
    line-height: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-header .lang-switcher li {
    width: calc(28px * 2);
    width: calc(var(--spacer-md) * 2);
    line-height: calc(28px * 2);
    line-height: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-header .lang-switcher li {
    width: calc(32px * 2);
    width: calc(var(--spacer-lg) * 2);
    line-height: calc(32px * 2);
    line-height: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-header .lang-switcher li {
    width: calc(36px * 2);
    width: calc(var(--spacer-xl) * 2);
    line-height: calc(36px * 2);
    line-height: calc(var(--spacer-xl) * 2);
  }
}
#main-header .lang-switcher li.active a {
  color: rgba(3, 79, 26, 1);
  color: rgba(var(--color-primary-500), 1);
  font-weight: 600;
}
#main-header .lang-switcher li a {
  text-decoration: none;
  color: rgba(var(--color-lgray-500), 1);
}
#main-header .lang-switcher li:last-child {
  border-right: 0px solid rgba(var(--color-lgray-500), 1);
}

.scroll-to-top {
  position: fixed;
  bottom: 20%;
  background-color: #ffffff;
  margin-right: -1px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: 0 0 calc(36px * 0.5) rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
  border-radius: 2px 0 0 2px;
  transition: right 0.666s ease !important;
  width: calc(32px * 1.5);
  width: calc(var(--spacer-default) * 1.5);
  height: calc(32px * 1.5);
  height: calc(var(--spacer-default) * 1.5);
  right: calc(32px * -1.5);
  right: calc(var(--spacer-default) * -1.5);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-xs) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-xs) * -1.5);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-xs-l) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-xs-l) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-xs-l) * -1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-sm) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-sm) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-sm) * -1.5);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top {
    width: calc(24px * 1.5);
    width: calc(var(--spacer-sm-l) * 1.5);
    height: calc(24px * 1.5);
    height: calc(var(--spacer-sm-l) * 1.5);
    right: calc(24px * -1.5);
    right: calc(var(--spacer-sm-l) * -1.5);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .scroll-to-top {
    width: calc(28px * 1.5);
    width: calc(var(--spacer-md) * 1.5);
    height: calc(28px * 1.5);
    height: calc(var(--spacer-md) * 1.5);
    right: calc(28px * -1.5);
    right: calc(var(--spacer-md) * -1.5);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .scroll-to-top {
    width: calc(32px * 1.5);
    width: calc(var(--spacer-lg) * 1.5);
    height: calc(32px * 1.5);
    height: calc(var(--spacer-lg) * 1.5);
    right: calc(32px * -1.5);
    right: calc(var(--spacer-lg) * -1.5);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .scroll-to-top {
    width: calc(36px * 1.5);
    width: calc(var(--spacer-xl) * 1.5);
    height: calc(36px * 1.5);
    height: calc(var(--spacer-xl) * 1.5);
    right: calc(36px * -1.5);
    right: calc(var(--spacer-xl) * -1.5);
  }
}
.scroll-to-top [class*=icon-] {
  transform: rotate(180deg);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.scroll-to-top [class*=icon-]:before {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
  font-size: calc(32px * 0.666);
  font-size: calc(var(--spacer-default) * 0.666);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(28px * 0.666);
    font-size: calc(var(--spacer-xs) * 0.666);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(28px * 0.666);
    font-size: calc(var(--spacer-xs-l) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(28px * 0.666);
    font-size: calc(var(--spacer-sm) * 0.666);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(24px * 0.666);
    font-size: calc(var(--spacer-sm-l) * 0.666);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(28px * 0.666);
    font-size: calc(var(--spacer-md) * 0.666);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(32px * 0.666);
    font-size: calc(var(--spacer-lg) * 0.666);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .scroll-to-top [class*=icon-]:before {
    font-size: calc(36px * 0.666);
    font-size: calc(var(--spacer-xl) * 0.666);
  }
}
body.scrolled .scroll-to-top {
  right: 0;
  transition: right 0.666s ease !important;
}

.user-info {
  font-size: 11px;
  border-left: 1px solid rgba(var(--color-lgray-500), 1);
  padding: 0 calc(32px * 1);
  padding: 0 calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .user-info {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .user-info {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .user-info {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .user-info {
    padding: 0 calc(24px * 1);
    padding: 0 calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .user-info {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .user-info {
    padding: 0 calc(32px * 1);
    padding: 0 calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .user-info {
    padding: 0 calc(36px * 1);
    padding: 0 calc(var(--spacer-xl) * 1);
  }
}

.home-links {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
.home-links #home-link {
  text-decoration: none;
  padding: 0 calc(32px * 1);
  padding: 0 calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .home-links #home-link {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .home-links #home-link {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .home-links #home-link {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .home-links #home-link {
    padding: 0 calc(24px * 1);
    padding: 0 calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .home-links #home-link {
    padding: 0 calc(28px * 1);
    padding: 0 calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .home-links #home-link {
    padding: 0 calc(32px * 1);
    padding: 0 calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .home-links #home-link {
    padding: 0 calc(36px * 1);
    padding: 0 calc(var(--spacer-xl) * 1);
  }
}
.home-links #home-link [class*=icon-] {
  margin-right: calc(32px * 0.25);
  margin-right: calc(var(--spacer-default) * 0.25);
}
.home-links #home-link [class*=icon-]:before {
  transform: rotate(180deg);
  display: block;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(24px * 0.25);
    margin-right: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(32px * 0.25);
    margin-right: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .home-links #home-link [class*=icon-] {
    margin-right: calc(36px * 0.25);
    margin-right: calc(var(--spacer-xl) * 0.25);
  }
}

@-webkit-keyframes slidedown {
  0% {
    top: -100%;
  }
  100% {
    top: 0%;
  }
}

@keyframes slidedown {
  0% {
    top: -100%;
  }
  100% {
    top: 0%;
  }
}
.js-thumb {
  cursor: pointer;
  padding: 3px;
  width: 12.5%;
  filter: grayscale(100%);
}
.js-thumb.active, .js-thumb:hover {
  filter: none;
}

.scroll-to-bottom {
  text-decoration: none;
  background-color: rgba(252, 203, 46, 1);
  background-color: rgba(var(--color-secondary-500), 1);
  border-radius: 50%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: calc(32px * 2) 0 0 0;
  margin: calc(var(--spacer-default) * 2) 0 0 0;
  width: calc(32px * 1);
  width: calc(var(--spacer-default) * 1);
  height: calc(32px * 1);
  height: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .scroll-to-bottom {
    margin: calc(28px * 2) 0 0 0;
    margin: calc(var(--spacer-xs) * 2) 0 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-xs) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-bottom {
    margin: calc(28px * 2) 0 0 0;
    margin: calc(var(--spacer-xs-l) * 2) 0 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-xs-l) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .scroll-to-bottom {
    margin: calc(28px * 2) 0 0 0;
    margin: calc(var(--spacer-sm) * 2) 0 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-sm) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .scroll-to-bottom {
    margin: calc(24px * 2) 0 0 0;
    margin: calc(var(--spacer-sm-l) * 2) 0 0 0;
    width: calc(24px * 1);
    width: calc(var(--spacer-sm-l) * 1);
    height: calc(24px * 1);
    height: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .scroll-to-bottom {
    margin: calc(28px * 2) 0 0 0;
    margin: calc(var(--spacer-md) * 2) 0 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-md) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .scroll-to-bottom {
    margin: calc(32px * 2) 0 0 0;
    margin: calc(var(--spacer-lg) * 2) 0 0 0;
    width: calc(32px * 1);
    width: calc(var(--spacer-lg) * 1);
    height: calc(32px * 1);
    height: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .scroll-to-bottom {
    margin: calc(36px * 2) 0 0 0;
    margin: calc(var(--spacer-xl) * 2) 0 0 0;
    width: calc(36px * 1);
    width: calc(var(--spacer-xl) * 1);
    height: calc(36px * 1);
    height: calc(var(--spacer-xl) * 1);
  }
}

.circle-number {
  text-decoration: none;
  background-color: rgba(252, 203, 46, 1);
  background-color: rgba(var(--color-secondary-500), 1);
  border-radius: 50%;
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: 0 calc(32px * 0.125) 0 0;
  margin: 0 calc(var(--spacer-default) * 0.125) 0 0;
  width: calc(32px * 1);
  width: calc(var(--spacer-default) * 1);
  height: calc(32px * 1);
  height: calc(var(--spacer-default) * 1);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .circle-number {
    margin: 0 calc(28px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-xs) * 0.125) 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-xs) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-xs) * 1);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .circle-number {
    margin: 0 calc(28px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-xs-l) * 0.125) 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-xs-l) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-xs-l) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .circle-number {
    margin: 0 calc(28px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-sm) * 0.125) 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-sm) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-sm) * 1);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .circle-number {
    margin: 0 calc(24px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-sm-l) * 0.125) 0 0;
    width: calc(24px * 1);
    width: calc(var(--spacer-sm-l) * 1);
    height: calc(24px * 1);
    height: calc(var(--spacer-sm-l) * 1);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .circle-number {
    margin: 0 calc(28px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-md) * 0.125) 0 0;
    width: calc(28px * 1);
    width: calc(var(--spacer-md) * 1);
    height: calc(28px * 1);
    height: calc(var(--spacer-md) * 1);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .circle-number {
    margin: 0 calc(32px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-lg) * 0.125) 0 0;
    width: calc(32px * 1);
    width: calc(var(--spacer-lg) * 1);
    height: calc(32px * 1);
    height: calc(var(--spacer-lg) * 1);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .circle-number {
    margin: 0 calc(36px * 0.125) 0 0;
    margin: 0 calc(var(--spacer-xl) * 0.125) 0 0;
    width: calc(36px * 1);
    width: calc(var(--spacer-xl) * 1);
    height: calc(36px * 1);
    height: calc(var(--spacer-xl) * 1);
  }
}

.box-shadowed > div {
  box-shadow: 0 calc(36px * 0.5) calc(36px * 0.5) rgba(0, 0, 0, 0.1);
  box-shadow: 0 calc(var(--spacer-xl) * 0.5) calc(var(--spacer-xl) * 0.5) rgba(0, 0, 0, 0.1);
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: calc(32px * 0.25);
  margin-bottom: calc(var(--spacer-default) * 0.25);
  padding: calc(32px * 1);
  padding: calc(var(--spacer-default) * 1);
  border-radius: calc(32px * 0.25);
  border-radius: calc(var(--spacer-default) * 0.25);
  font-size: 1.6rem;
}
@media (min-width: 0px) and (max-width: 1200px) {
  .box-shadowed > div {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs) * 0.25);
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs) * 1);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs) * 0.25);
    font-size: 1.2rem;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .box-shadowed > div {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs-l) * 0.25);
    padding: calc(28px * 1);
    padding: calc(var(--spacer-xs-l) * 1);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-xs-l) * 0.25);
    font-size: 1.12rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .box-shadowed > div {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-sm) * 0.25);
    padding: calc(28px * 1);
    padding: calc(var(--spacer-sm) * 1);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-sm) * 0.25);
    font-size: 1.28rem;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .box-shadowed > div {
    margin-bottom: calc(24px * 0.25);
    margin-bottom: calc(var(--spacer-sm-l) * 0.25);
    padding: calc(24px * 1);
    padding: calc(var(--spacer-sm-l) * 1);
    border-radius: calc(24px * 0.25);
    border-radius: calc(var(--spacer-sm-l) * 0.25);
    font-size: 1.2rem;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .box-shadowed > div {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-md) * 0.25);
    padding: calc(28px * 1);
    padding: calc(var(--spacer-md) * 1);
    border-radius: calc(28px * 0.25);
    border-radius: calc(var(--spacer-md) * 0.25);
    font-size: 1.36rem;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .box-shadowed > div {
    margin-bottom: calc(32px * 0.25);
    margin-bottom: calc(var(--spacer-lg) * 0.25);
    padding: calc(32px * 1);
    padding: calc(var(--spacer-lg) * 1);
    border-radius: calc(32px * 0.25);
    border-radius: calc(var(--spacer-lg) * 0.25);
    font-size: 1.44rem;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .box-shadowed > div {
    margin-bottom: calc(36px * 0.25);
    margin-bottom: calc(var(--spacer-xl) * 0.25);
    padding: calc(36px * 1);
    padding: calc(var(--spacer-xl) * 1);
    border-radius: calc(36px * 0.25);
    border-radius: calc(var(--spacer-xl) * 0.25);
    font-size: 1.6rem;
  }
}
.box-shadowed > div a {
  text-decoration: none;
}
.box-shadowed > div [class*=icon] {
  margin-right: calc(32px * 0.25);
  margin-right: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(24px * 0.25);
    margin-right: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(28px * 0.25);
    margin-right: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(32px * 0.25);
    margin-right: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .box-shadowed > div [class*=icon] {
    margin-right: calc(36px * 0.25);
    margin-right: calc(var(--spacer-xl) * 0.25);
  }
}
.box-shadowed > div [class*=icon]:before {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
  font-size: calc(32px * 2);
  font-size: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(24px * 2);
    font-size: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(32px * 2);
    font-size: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  .box-shadowed > div [class*=icon]:before {
    font-size: calc(36px * 2);
    font-size: calc(var(--spacer-xl) * 2);
  }
}
.box-shadowed > div:last-of-type {
  margin-bottom: 0;
}

#section-social a {
  text-decoration: none !important;
  text-transform: uppercase;
}
#section-social [class*=icon] {
  margin-bottom: calc(32px * 0.25);
  margin-bottom: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #section-social [class*=icon] {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #section-social [class*=icon] {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #section-social [class*=icon] {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #section-social [class*=icon] {
    margin-bottom: calc(24px * 0.25);
    margin-bottom: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #section-social [class*=icon] {
    margin-bottom: calc(28px * 0.25);
    margin-bottom: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #section-social [class*=icon] {
    margin-bottom: calc(32px * 0.25);
    margin-bottom: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #section-social [class*=icon] {
    margin-bottom: calc(36px * 0.25);
    margin-bottom: calc(var(--spacer-xl) * 0.25);
  }
}
#section-social [class*=icon]:before {
  font-size: calc(32px * 2);
  font-size: calc(var(--spacer-default) * 2);
}
@media (min-width: 0px) and (max-width: 1200px) {
  #section-social [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-xs) * 2);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #section-social [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-xs-l) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #section-social [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-sm) * 2);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #section-social [class*=icon]:before {
    font-size: calc(24px * 2);
    font-size: calc(var(--spacer-sm-l) * 2);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #section-social [class*=icon]:before {
    font-size: calc(28px * 2);
    font-size: calc(var(--spacer-md) * 2);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #section-social [class*=icon]:before {
    font-size: calc(32px * 2);
    font-size: calc(var(--spacer-lg) * 2);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #section-social [class*=icon]:before {
    font-size: calc(36px * 2);
    font-size: calc(var(--spacer-xl) * 2);
  }
}

#main-footer .icon-logo:before {
  font-size: 3em;
}
@media (min-width: 0px) and (max-width: 1200px) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  #main-footer .icon-logo:before {
    font-size: 3em;
  }
}

body.error404 {
  background: rgba(3, 79, 26, 1);
  background: rgba(var(--color-primary-500), 1);
}

body.error404 article *:not(input), body.error404 footer *:not(input) {
  color: rgb(255, 255, 255);
  color: rgb(var(--color-primary-contrast-500));
}
body.error404 article h1, body.error404 footer h1 {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
}
body.error404 article h1 *, body.error404 footer h1 * {
  color: rgba(252, 203, 46, 1);
  color: rgba(var(--color-secondary-500), 1);
}
body.error404 article form.container-xs, body.error404 footer form.container-xs {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
  margin-left: calc(32px * 0.25);
  margin-left: calc(var(--spacer-default) * 0.25);
}
@media (min-width: 0px) and (max-width: 1200px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-xs) * 0.25);
  }
}
@media (min-width: 0px) and (max-width: 1200px) and (orientation:landscape) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-xs-l) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-sm) * 0.25);
  }
}
@media (min-width: 768px) and (max-width: 1200px) and (orientation:landscape) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(24px * 0.25);
    margin-left: calc(var(--spacer-sm-l) * 0.25);
  }
}
@media (min-width: 1201px) and (max-width: 10000px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(28px * 0.25);
    margin-left: calc(var(--spacer-md) * 0.25);
  }
}
@media (min-width: 1441px) and (max-width: 10000px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(32px * 0.25);
    margin-left: calc(var(--spacer-lg) * 0.25);
  }
}
@media (min-width: 1921px) and (max-width: 10000px) {
  body.error404 article form.container-xs button, body.error404 footer form.container-xs button {
    margin-left: calc(36px * 0.25);
    margin-left: calc(var(--spacer-xl) * 0.25);
  }
}
/*# sourceMappingURL=style.css.map */