*,::after,::before{padding:0;margin:0;border:0;font-size:16px;box-sizing:border-box}:root{--main-ui-colour:#212529;--main-border-colour:#ffffff;--main-bg:#343a40;--main-ui-colour-darker:#16181b;--hover-highlight:#FDFFB4;--active-light:#1bfc06}body{font-family:Roboto,sans-serif}footer,nav{padding:1rem 2rem;background-color:var(--main-ui-colour)}nav h1{font-size:2rem;color:#fff}main{background-color:var(--main-bg)}.button-reset{-webkit-appearance:none;border-radius:0;text-align:inherit;background:0 0;box-shadow:none;padding:0;cursor:pointer;border:none;color:inherit;font:inherit}.grid{padding:1rem;width:100%;display:grid;grid-template-rows:repeat(78,25px);grid-template-columns:repeat(75,25px);border-radius:5px}.grid-main-canvas--slider{grid-row:1/27;grid-column:1/32;display:grid;grid-template-rows:repeat(27,25px);grid-template-columns:repeat(32,25px)}.canvas-container{grid-row:1/24;grid-column:1/32;padding:.4rem;border-radius:5px 5px 0 0;background-color:var(--main-ui-colour);display:flex;align-items:center;justify-content:center;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.lightness-container{grid-row:24/27;grid-column:1/32;padding:1rem 2rem;background-color:var(--main-ui-colour);color:var(--main-border-colour);border-radius:0 0 5px 5px;display:flex;justify-content:center;gap:0 2rem;align-items:center;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.lightness-container p{font-size:1.5rem;font-weight:700;flex-basis:10%}.lightness-range{flex-basis:80%;-webkit-appearance:none;height:6px;border-radius:3px;background:#fff;outline:0;opacity:.9;transition:opacity .2s}.lightness-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:#343a40;border:2px solid #efefef;width:25px;height:25px;border-radius:5px;cursor:pointer}canvas{cursor:url("/crosshair.svg") 30 30,crosshair;border:3px solid var(--main-border-colour)}.canvas-too-bright{cursor:url("/dark-crosshair.svg") 30 30,crosshair}.grid-main-colour-selection{grid-row:1/10;grid-column:33/44;display:flex;justify-content:space-around;background-color:var(--main-ui-colour);border-radius:5px 5px 0 0;color:#fff;padding:.6rem;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.selected-container{display:flex;flex-direction:column;row-gap:1rem;justify-content:flex-start;align-items:center;padding-block:1rem}#selected-one-input,#selected-two-input{width:100px;height:30px;background-color:var(--main-bg);padding:.6rem;border-radius:5px;color:#fff}.input-selected{border:2px solid #fff}.error-input{border:2px solid red}.grid-main-colour-history{grid-row:22/27;grid-column:33/60;display:grid;grid-template-rows:repeat(5,25px);grid-template-columns:repeat(27,25px)}.colour-array{display:flex;grid-row:3/6;grid-column:1/28;padding:1rem;gap:1rem;justify-content:center;align-items:center;background-color:var(--main-ui-colour);border-radius:0 5px 5px 5px;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.colour-array-title{display:flex;color:#fff;grid-row:1/3;grid-column:1/8;padding:1rem;justify-content:center;align-items:center;background-color:var(--main-ui-colour);border-radius:5px 5px 0 0;font-weight:700;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.colour-history,.shade-button{width:50px;height:50px;border:2px solid var(--main-border-colour);background-color:#212529;border-radius:5px}.main{border:2px solid var(--active-light)}.colour-history{background-color:var(--main-ui-colour);cursor:pointer}.colour-history:hover,.shade-button:hover{border:2px solid var(--hover-highlight)}.shades-layout{display:flex;justify-content:space-around;align-items:center;background-color:var(--main-ui-colour);box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.shades-headers{background-color:var(--main-ui-colour);color:#fff;border-radius:5px 5px 0 0;display:flex;align-items:center;justify-content:center;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.grid-main-shades{grid-row:28/57;grid-column:1/60;display:grid;grid-template-rows:repeat(39,25px);grid-template-columns:repeat(75,25px)}.complementary-shades{grid-row:4/6;grid-column:1/9}.complementary-shades p{font-weight:700}.shades{grid-row:6/9;grid-column:1/16;border-radius:0 5px 0 0}.c-shades{grid-row:9/12;grid-column:1/16;border-radius:0 0 5px 5px}.analogous-shades{grid-row:4/6;grid-column:18/26}.analogous-shades p{font-weight:700}.shades-ana-pos{grid-row:6/9;grid-column:18/33;border-radius:0 5px 0 0}.shades-ana-main{grid-row:9/12;grid-column:18/33;border-radius:0}.shades-ana-neg{grid-row:12/15;grid-column:18/33;border-radius:0 0 5px 5px}.mono-shades{grid-row:4/6;grid-column:35/44}.mono-shades p{font-weight:700}.shades-mono-pos{grid-row:6/9;grid-column:35/50;border-radius:0 5px 0 0}.shades-mono-main{grid-row:9/12;grid-column:35/50;border-radius:0 0 0 0}.shades-mono-neg{grid-row:12/15;grid-column:35/50;border-radius:0 0 5px 5px}.comp-split-shades{grid-row:16/18;grid-column:1/11}.comp-split-shades p{font-weight:700}.comp-split-main{grid-row:18/21;grid-column:1/16;border-radius:0 5px 0 0}.comp-split-first{grid-row:21/24;grid-column:1/16;border-radius:0}.comp-split-second{grid-row:24/27;grid-column:1/16;border-radius:0 0 5px 5px}.triad-shades{grid-row:16/18;grid-column:18/24}.triad-shades p{font-weight:700}.triad-main{grid-row:18/21;grid-column:18/33;border-radius:0 5px 0 0}.triad-first{grid-row:21/24;grid-column:18/33;border-radius:0}.triad-second{grid-row:24/27;grid-column:18/33;border-radius:0 0 5px 5px}.square-shades{grid-row:16/18;grid-column:35/42}.square-shades p{font-weight:700}.square-main{grid-row:18/21;grid-column:35/50;border-radius:0 5px 0 0}.square-first{grid-row:21/24;grid-column:35/50;border-radius:0}.square-second{grid-row:24/27;grid-column:35/50;border-radius:0}.square-third{grid-row:27/30;grid-column:35/50;border-radius:0 0 5px 5px}.hover-colour{width:30px;height:30px;border-radius:50%;border:2px solid #fff;position:absolute;pointer-events:none}.casvas-too-bright-hover-colour{border:2px solid #000}.colour-display-none{display:none}.box{width:100px;height:100px;min-height:100px;border-radius:5px;border:2px solid var(--main-border-colour)}.box2{width:100px;height:100px;min-height:100px;border-radius:5px;background-color:#efefef;border:2px solid var(--main-border-colour)}.box2:hover,.box:hover{border:5px solid var(--hover-highlight)}.text-button{display:flex;justify-content:space-between;align-items:center;background-color:var(--main-bg);padding:.6rem;border-radius:5px;border:2px solid #fff;margin-top:.4rem;width:85%;color:#fff}.text-button:hover{background-color:var(--main-ui-colour)}.grid-main-colour-selection-text{grid-row:10/21;grid-column:33/44;display:flex;flex-direction:column;align-items:normal;justify-content:center;background-color:var(--main-ui-colour);color:#fff;padding:.8rem .8rem .8rem 1.45rem;gap:.8rem;border-radius:0 0 5px 5px;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.activeSelected{border:5px solid var(--active-light)}.shades-header{background-color:var(--main-ui-colour);color:#fff;grid-row:1/3;grid-column:1/6;font-weight:700;border-radius:5px;display:flex;align-items:center;justify-content:center;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.grid-main-colour-accessibly{background-color:var(--main-ui-colour);color:#fff;grid-row:1/21;grid-column:45/60;border-radius:5px;padding:1.45rem;display:grid;grid-template-rows:repeat(25,1fr);grid-template-columns:repeat(5,1fr);box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.accessibly-header{grid-row:1/2;grid-column:1/6}.accessibly-white-header{grid-row:5/7;grid-column:1/6}.accessibly-black-header{grid-row:12/13;grid-column:1/6}.accessibly-other-header{grid-row:19/21;grid-column:1/6}.white-normal{grid-row:3/4;grid-column:1/3;display:flex;align-items:center;justify-content:center;background-color:var(--main-bg);border:2px solid #fff;border-radius:5px;padding:.4rem}.white-large{grid-row:3/4;grid-column:4/6;display:flex;align-items:center;justify-content:center;background-color:var(--main-bg);border:2px solid #fff;border-radius:5px;padding:.4rem}.accessibly-black-container1,.accessibly-black-container2,.accessibly-other-container1,.accessibly-other-container2,.accessibly-white-container1,.accessibly-white-container2{border-radius:5px;border:2px solid #fff;background-color:var(--main-bg);padding:.4rem;display:flex;flex-flow:column;justify-content:center}.accessibly-white-container1{grid-row:7/11;grid-column:1/3}.accessibly-white-container2{grid-row:7/11;grid-column:4/6}.accessibly-black-container1{grid-row:14/18;grid-column:1/3}.accessibly-black-container2{grid-row:14/18;grid-column:4/6}.accessibly-other-container1{grid-row:21/25;grid-column:1/3}.accessibly-other-container2{grid-row:21/25;grid-column:4/6}.acc-results{display:flex;justify-content:space-between;align-items:center}.colour-range-container{grid-row:58/78;grid-column:1/60;display:grid;grid-template-rows:repeat(20,25px);grid-template-columns:repeat(60,25px)}.colour-hue-header{background-color:var(--main-ui-colour);padding:1rem;color:#fff;grid-row:1/3;grid-column:1/10;text-align:center;font-weight:700;border-radius:5px;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.colour-hue-container{background-color:var(--main-ui-colour);padding:1rem;color:#fff;grid-row:4/21;grid-column:1/16;border-radius:5px;display:grid;grid-template-rows:repeat(17,25px);grid-template-columns:repeat(15,25px);box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.colour-hue-box{grid-row:1/6;grid-column:1/6;border-radius:5px;border:2px solid var(--main-border-colour);background-color:#212529;cursor:pointer}.colour-hue-hsl{grid-row:2/5;grid-column:7/15}.hsl-form{grid-row:7/17;grid-column:1/15;display:flex;flex-flow:column;justify-content:space-around}.hsl-range-text{width:60px;background-color:var(--main-bg);padding:.4rem;border-radius:5px;color:#fff;border:2px solid #fff}.hsl-flex{display:flex;flex-flow:row;align-items:center;gap:.5rem}.hsl-form .hsl-range{width:75%}.text-button-hsl{display:flex;justify-content:space-between;align-items:center;background-color:var(--main-bg);padding:.6rem;border-radius:5px;border:2px solid #fff;margin-top:.4rem;width:100%;color:#fff}.colour-grad-header{background-color:var(--main-ui-colour);padding:1rem;color:#fff;grid-row:1/3;grid-column:20/29;text-align:center;font-weight:700;border-radius:5px;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.colour-grad-display-container{background-color:var(--main-ui-colour);padding:2.2rem 1rem 1.5rem 1rem;color:#fff;grid-row:4/21;grid-column:20/35;text-align:center;font-weight:700;border-radius:5px 0 0 5px;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px;display:flex;flex-flow:column;align-items:center;justify-content:flex-start;row-gap:.5rem}.colour-grad-display{width:95%;height:78%;background:linear-gradient(0deg,#e5af9b 10%,#9bd1e5 100%);border:2px solid #fff;border-radius:5px}.copy-grad{width:95%;display:flex;align-items:center;justify-content:center;height:67px;border:2px solid #fff;border-radius:5px;gap:1rem;background-color:var(--main-bg)}.copy-grad:hover{background-color:var(--main-ui-colour)}.colour-grad-form-container{background-color:var(--main-ui-colour);padding:1rem;color:#fff;grid-row:4/21;grid-column:35/50;text-align:center;font-weight:700;border-radius:0 5px 5px 0;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.grad-form-main{display:flex;padding:1rem 1rem 1.5rem 0;justify-content:flex-start;align-items:center;gap:1rem}.grad-form-radio{display:flex;gap:1rem}.grad-type-radio{display:flex;align-items:center;justify-content:center;flex-flow:column;width:80px;padding:.2rem;background-color:var(--main-bg);border-radius:5px;gap:.4rem}.grad-type{appearance:none;width:16px;height:16px;border:3px solid #fff;border-radius:5px;display:inline-block;position:relative;cursor:pointer}.grad-type:checked{background-color:#3a9bdc;padding:.2rem}.grad-deg-container{display:flex;flex-flow:column;align-items:center;justify-content:center;width:80px;padding:.2rem;border-radius:5px;gap:.2rem}.grad-deg{width:70%;color:#fff;background-color:var(--main-bg);border:2px solid #fff;border-radius:5px;padding:.1rem .2rem}.grad-colour-style-list-container{display:flex;flex-flow:column;gap:.4rem}.grad-colour-style-container{display:flex;background-color:var(--main-bg);padding:1rem;gap:.2rem .8rem;border-radius:5px}.grad-colour-type{width:120px;height:35px;padding:.6rem;background-color:var(--main-bg);color:#fff;border:2px solid #fff;border-radius:5px}.grad-colour-type-display{width:35px;height:35px;background-color:#672277;border:2px solid #fff;border-radius:5px}.display-1{background-color:#e5af9b}.display-2{background-color:#9bd1e5}.grad-colour-type-stop{width:65px;height:35px;padding:.6rem;background-color:var(--main-bg);color:#fff;border:2px solid #fff;border-radius:5px}.grad-colour-type-remove{border-radius:5px;border:2px solid var(--main-bg);display:flex;justify-content:center;align-items:center;margin-left:1rem}.grad-colour-type-remove img{pointer-events:none}.grad-colour-type-remove:hover{border-radius:5px;border:2px solid #fff}.add-grad-colour-style{width:343px;height:67px;display:flex;align-items:center;justify-content:center;background-color:var(--main-bg);border-radius:5px}#palette-amount{margin-bottom:.1rem;background-color:var(--main-bg);color:#fff;border-radius:5px}.palettes-section{padding:1rem;display:flex;width:100%;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:25px}.palettes-header{width:225px;height:50px;background-color:var(--main-ui-colour);color:#fff;font-weight:700;border-radius:5px;display:flex;align-items:center;justify-content:center;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.error-input{border:2px solid red}.palettes-container{width:90%;background-color:var(--main-ui-colour);border-radius:5px;display:flex;flex-wrap:wrap;align-content:start;justify-content:start;padding:1rem;column-gap:2rem;row-gap:1rem;box-shadow:rgba(26,29,32,.78) .95px 1.95px 2.6px}.palette{position:relative;width:412px;column-gap:.6rem;height:120px;background-color:var(--main-ui-colour-darker);display:flex;justify-content:center;border-radius:5px;padding:.4rem}.pal-xs{width:85px}.pal-s{width:165px}.pal-m{width:245px}.pal-l{width:325px}.pal-xl{width:415px}.custom-palette-edit-button{position:absolute;top:7px;right:7px;background-color:var(--main-bg);border-radius:5px;padding:.2rem}.custom-palette-edit-button:hover{background-color:var(--main-ui-colour-darker)}.custom-palette-edit-button img{pointer-events:none}.palette-colour-container{flex-basis:65px;color:#fff;display:flex;align-items:center;justify-content:center;flex-flow:column;font-weight:700;row-gap:.4rem}.palette-colour-container p{background-color:var(--main-bg);padding:.4rem;border-radius:5px;width:100%;text-align:center;overflow:hidden;text-overflow:ellipsis;width:8ch}.tab{top:10px;left:50%;transform:translate(-50%,0);position:fixed;background-color:#54ce70;border-radius:5px;padding:1rem;font-weight:700}.colour-pal{width:70px;height:70px;border-radius:5px}.custom-palettes-add-button{height:120px;background-color:var(--main-bg);border-radius:5px;width:120px;display:flex;align-items:center;justify-content:center}.custom-palette-form{width:400px;height:120px;background-color:var(--main-ui-colour-darker);border-radius:5px;display:grid;grid-template-columns:1fr;grid-template-rows:1fr 3fr;padding-block:0.4rem;padding-inline:0.5rem}.custom-palette-bg{display:flex;justify-content:flex-start;align-items:center;column-gap:.5rem}.custom-palette-colour{width:70px;height:70px;background-color:#343a40;border-radius:5px;display:flex;align-items:end;justify-content:center}.custom-palette-colour form{display:flex;flex-flow:column;width:100%}.custom-palette-colour form input{border:2px solid #fff;border-radius:2px;background-color:#212529;color:#fff;padding-inline:0.5rem}.custom-form-container{display:flex;justify-content:space-between;align-content:center}.form-flex-buttons{display:flex;column-gap:1rem}.custom-form-delete{background-color:var(--main-bg);border-radius:5px;display:flex;align-items:center;justify-content:center;padding:.2rem .1rem}.custom-form-accept{background-color:var(--main-bg);border-radius:5px;display:flex;align-items:center;justify-content:center;padding:.2rem .1rem}footer{display:flex;justify-content:space-between;align-items:center;color:#fff}footer a{color:#fff}@media (min-width:1800px){.grid{padding:1.2rem;margin:auto;width:80%;display:grid;grid-template-rows:repeat(60,25px);grid-template-columns:repeat(60,25px)}.palettes-section{width:80%;margin:auto}}@media (max-width:1300px){.grid{padding:1.2rem;width:80%;margin:auto;display:grid;grid-template-rows:repeat(139,25px);grid-template-columns:repeat(60,25px)}.grid-main-canvas--slider{grid-row:1/28;grid-column:1/32;grid-template-rows:repeat(27,25px);grid-template-columns:repeat(32,25px)}.grid-main-colour-selection{grid-row:34/43;grid-column:3/14}.grid-main-colour-selection-text{grid-row:43/54;grid-column:3/14}.grid-main-colour-accessibly{grid-row:34/54;grid-column:15/30;grid-template-rows:repeat(25,1fr);grid-template-columns:repeat(5,1fr)}.grid-main-colour-history{grid-row:28/33;grid-column:3/30;grid-template-rows:repeat(5,25px);grid-template-columns:repeat(27,25px)}.grid-main-shades{grid-row:55/97;grid-column:1/32;grid-template-rows:repeat(42,25px);grid-template-columns:repeat(75,25px)}.analogous-shades{grid-column:17/25}.shades-ana-pos{grid-column:17/32}.shades-ana-main{grid-column:17/32}.shades-ana-neg{grid-column:17/32}.mono-shades{grid-row:16/18;grid-column:1/9}.shades-mono-pos{grid-row:18/21;grid-column:1/16}.shades-mono-main{grid-row:21/24;grid-column:1/16}.shades-mono-neg{grid-row:24/27;grid-column:1/16}.comp-split-shades{grid-row:16/18;grid-column:17/27}.comp-split-main{grid-row:18/21;grid-column:17/32;border-radius:0 5px 0 0}.comp-split-first{grid-row:21/24;grid-column:17/32;border-radius:0}.comp-split-second{grid-row:24/27;grid-column:17/32;border-radius:0 0 5px 5px}.triad-shades{grid-row:28/30;grid-column:1/6}.triad-main{grid-row:30/33;grid-column:1/16;border-radius:0 5px 0 0}.triad-first{grid-row:33/36;grid-column:1/16;border-radius:0}.triad-second{grid-row:36/39;grid-column:1/16;border-radius:0 0 5px 5px}.square-shades{grid-row:28/30;grid-column:17/24}.square-main{grid-row:30/33;grid-column:17/32;border-radius:0 5px 0 0}.square-first{grid-row:33/36;grid-column:17/32;border-radius:0}.square-second{grid-row:36/39;grid-column:17/32;border-radius:0}.square-third{grid-row:39/42;grid-column:17/32;border-radius:0 0 5px 5px}.colour-range-container{grid-row:98/139;grid-column:1/32;grid-template-rows:repeat(41,25px);grid-template-columns:repeat(32,25px)}.colour-grad-header{grid-row:22/24;grid-column:1/9}.colour-grad-display-container{grid-row:25/42;grid-column:1/15}.colour-grad-form-container{grid-row:25/42;grid-column:15/30}.colour-hue-header{grid-column:1/6}.colour-hue-container{grid-column:1/16}.palettes-section{padding:1rem;width:55%;margin:auto}.palettes-container{width:100%;align-self:center;justify-content:center}}@media (max-width:950px){.grid{padding:1.2rem;width:100%;display:grid;grid-template-rows:repeat(120,25px);grid-template-columns:repeat(60,25px)}}@media (max-width:768px){.grid{padding:1.2rem;width:54%;margin:auto;grid-template-rows:repeat(200,25px);grid-template-columns:repeat(16,25px);border-radius:5px}.grid-main-canvas--slider{grid-row:1/12;grid-column:1/16;grid-template-rows:repeat(11,25px);grid-template-columns:repeat(15,25px)}.canvas-container{grid-row:1/12;grid-column:1/16}.lightness-container{grid-column:1/16;padding:1rem 2rem}.grid-main-colour-history{grid-row:15/23;grid-column:1/16;grid-template-rows:repeat(8,25px);grid-template-columns:repeat(15,25px)}.colour-array{flex-wrap:wrap;grid-row:3/9;grid-column:1/16}.grid-main-colour-selection{grid-row:24/33;grid-column:1/16}.grid-main-colour-selection-text{grid-row:33/44;grid-column:1/16}.grid-main-colour-accessibly{grid-row:45/65;grid-column:1/16}.grid-main-shades{grid-row:66/141;grid-column:1/16;grid-template-rows:repeat(75,25px);grid-template-columns:repeat(16,25px)}.complementary-shades{grid-row:4/6;grid-column:1/9}.shades{grid-row:6/9;grid-column:1/16}.c-shades{grid-row:9/12;grid-column:1/16}.analogous-shades{grid-row:13/15;grid-column:1/9}.shades-ana-pos{grid-row:15/18;grid-column:1/16}.shades-ana-main{grid-row:18/21;grid-column:1/16}.shades-ana-neg{grid-row:21/24;grid-column:1/16}.mono-shades{grid-row:25/27;grid-column:1/9}.shades-mono-pos{grid-row:27/30;grid-column:1/16}.shades-mono-main{grid-row:30/33;grid-column:1/16}.shades-mono-neg{grid-row:33/36;grid-column:1/16}.comp-split-shades{grid-row:37/39;grid-column:1/11}.comp-split-main{grid-row:39/42;grid-column:1/16;border-radius:0 5px 0 0}.comp-split-first{grid-row:42/45;grid-column:1/16;border-radius:0}.comp-split-second{grid-row:45/48;grid-column:1/16;border-radius:0 0 5px 5px}.triad-shades{grid-row:49/51;grid-column:1/6}.triad-main{grid-row:51/54;grid-column:1/16;border-radius:0 5px 0 0}.triad-first{grid-row:54/57;grid-column:1/16;border-radius:0}.triad-second{grid-row:57/60;grid-column:1/16;border-radius:0 0 5px 5px}.square-shades{grid-row:61/63;grid-column:1/8}.square-main{grid-row:63/66;grid-column:1/16;border-radius:0 5px 0 0}.square-first{grid-row:66/69;grid-column:1/16;border-radius:0}.square-second{grid-row:69/72;grid-column:1/16;border-radius:0}.square-third{grid-row:72/75;grid-column:1/16;border-radius:0 0 5px 5px}.colour-range-container{padding:0;grid-row:141/200;grid-column:1/16;grid-template-rows:repeat(59,25px);grid-template-columns:repeat(16,25px)}.colour-grad-display-container{border-radius:5px 5px 0 0;grid-column:1/16}.colour-grad-form-container{grid-row:42/59;grid-column:1/16;border-radius:0 0 5px 5px}.grad-colour-type-remove{margin-left:0}.colour-hue-header{grid-column:1/10}.colour-hue-container{grid-column:1/16}.palettes-section{width:54%}.palettes-container{width:100%}.custom-palette-form{padding-inline:0}.custom-form-container{padding-inline:0.2rem}.palette{width:400px;column-gap:.2rem;height:120px;padding:0}.pal-xs{width:85px}.pal-s{width:165px}.pal-m{width:245px}.pal-l{width:325px}.pal-xl{width:415px}.palette-colour-container{flex-basis:60px;justify-content:center;align-items:center;row-gap:0}.colour-pal{width:70px;height:70px}}@media (max-width:600px){.grid{padding:1.2rem;width:100%;grid-template-rows:repeat(161,25px);grid-template-columns:repeat(15,25px);border-radius:5px}.palettes-section{width:100%}}@media (max-width:400px){.grid{padding:2rem .2rem;width:100%;grid-template-rows:repeat(161,25px);grid-template-columns:repeat(15,25px);border-radius:5px}.palettes-container{width:100%;padding:.2rem}.palettes-section{padding:0;width:100%}}