.gradientGenerator{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:64px;background-color:var(--background);min-height:100vh;width:85vw;min-width:85vw;max-width:85vw;margin:0 auto}@media screen and (max-width:425px){.gradientGenerator{width:90vw;min-width:90vw;max-width:90vw}}.gradientGenerator h1{font-size:1.5rem;font-weight:600;margin-bottom:16px;text-align:center;white-space:nowrap}.gradientGenerator .infoContainer{width:85vw;margin-top:48px;margin-bottom:-48px}@media screen and (max-width:768px){.gradientGenerator .infoContainer{margin-top:24px}}.gradientGenerator .infoContainer h1{font-size:3rem;font-weight:700;margin-bottom:24px;text-align:center;line-height:3.5rem}.gradientGenerator .infoContainer h1 span{background:linear-gradient(201deg,#f660a8 -14.35%,#6919ec);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.gradientGenerator .infoContainer p{font-size:1rem;font-weight:400;margin-bottom:16px;text-align:left;line-height:1.25}@media screen and (max-width:768px){.gradientGenerator .infoContainer p{text-align:center}}.gradientGenerator .infoContainer p span{font-weight:700}.gradientGenerator .colours{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:16px;align-items:center;width:100%;height:100%;position:relative;overflow-y:visible}@media screen and (max-width:768px){.gradientGenerator .colours{flex-direction:column;gap:24px}}.gradientGenerator .gradientsContainer{display:grid;grid-template-columns:repeat(4,1fr);justify-content:center;align-items:center;grid-gap:32px;gap:32px;width:100%}