/*! CSS-GRADIENT.COM - Do not use without permission */
.buttons-colors{cursor:pointer;position:relative}.buttons-colors a{border-radius:32px;width:32px;height:32px;margin-top:4px;margin-left:0;margin-right:8px;line-height:1.75rem;display:inline-block}.buttons-colors a#red{background-color:#ed2939}.buttons-colors a#orange{background-color:#ef7215}.buttons-colors a#yellow{background-color:#ffd300}.buttons-colors a#green{background-color:#50c878}.buttons-colors a#azure{background-color:#bdffff}.buttons-colors a#blue{background-color:#008ecc}.buttons-colors a#purple{background-color:purple}.buttons-colors a#pink{background-color:#fe7f9c}.buttons-colors a#monochrome{background-color:#dcdcdc}.buttons-type{cursor:pointer;position:relative}.buttons-type a{border:2px solid var(--color3);text-align:center;border-radius:8px;width:80px;height:32px;margin-top:4px;margin-left:8px;font-size:.8125rem;font-weight:500;line-height:1.75rem;text-decoration:none;display:inline-block}.buttons-type a:first-child{margin-left:0}.buttons-type a:nth-child(4){margin-left:0}.buttons-type a:hover{background:var(--color3)}.section-pages{width:50%;color:var(--color1-90);margin:92px auto 0;font-size:.875rem;font-weight:400;line-height:1.5;display:block}.section-pages-header{flex-flow:row;margin-bottom:54px;display:flex}.breadcrumb{margin-bottom:24px;font-size:.8125rem;display:block}.breadcrumb a{color:var(--color1-90)}.breadcrumb-sep{color:var(--color1-25);margin:0 6px}.breadcrumb-current{color:var(--color1-25)}h2#colors{text-transform:uppercase;color:var(--color1);flex:60%;font-size:.9375rem;font-weight:600;display:inline-block}a#gimmemore{cursor:pointer;border:2px solid var(--color3);height:32px;color:var(--color1);text-align:center;border-radius:8px;flex:0 0 100px;margin-top:-5px;margin-right:8px;font-size:.8125rem;font-weight:500;line-height:1.75rem;text-decoration:none;display:inline-block}a#createnew{cursor:pointer;border:2px solid var(--color3);height:32px;color:var(--color1);text-align:center;border-radius:6px;flex:0 0 130px;margin-top:-5px;font-size:.8125rem;font-weight:500;line-height:1.75rem;text-decoration:none;display:inline-block}a#createnew:hover{background:var(--color3)}a#gimmemore:hover{background:var(--color3)}.section-colors{flex-flow:wrap;align-content:flex-start;justify-content:center;align-items:flex-start;margin:0 -10px;display:flex}.section-colors>div{flex:0 50%;padding:10px}@media (max-width:992px){.section-colors>div{flex:0 100%}}.bkg,.color{cursor:pointer;border-radius:12px;justify-content:center;align-items:center;height:160px;display:flex}.color{height:120px}.bkg:hover{transition:box-shadow .2s;box-shadow:0 2px 10px rgba(0,0,0,.25)}.color:hover{transition:box-shadow .2s;box-shadow:0 2px 10px rgba(0,0,0,.25)}.bkg a,.color a{color:#fff;text-align:center;width:100%;height:100%;line-height:160px;text-decoration:none;display:none}.color a{line-height:120px}.bkg:hover a{display:block}.color:hover a{display:block}p.section-color-names-intro{color:var(--color1);margin-bottom:70px}div.section-color-names-table{width:100%;margin-bottom:100px;overflow-x:auto}.section-color-names h3{text-transform:uppercase;color:var(--color1);margin-top:32px;margin-bottom:10px;font-size:.9375rem}.section-color-names table,.section-color-names thead,.section-color-names tbody,.section-color-names tfoot,.section-color-names tr,.section-color-names th,.section-color-names td{text-align:left;-webkit-user-select:text;user-select:text;background:0 0;height:0;margin:0;padding:0}.section-color-names table{border-collapse:collapse;width:100%;min-width:450px}.section-color-names table thead tr{border-bottom:1px solid var(--color3);height:50px;color:var(--color1-90)}.section-color-names table thead tr th{text-transform:uppercase;font-size:90%;font-weight:600}.section-color-names table thead tr th,.section-color-names table tbody tr td{padding-right:10px}.section-color-names table thead tr th:last-of-type{padding-right:0}.section-color-names table tbody tr td:last-of-type{padding-right:0}.section-color-names table tbody tr td{border-bottom:1px solid var(--color3);height:70px;color:var(--color1)}.section-color-names table tbody tr td#color-names-color{width:90px}.section-color-names table tbody tr td div#color-names-color-get{cursor:pointer;border-radius:35px;width:35px;height:35px;display:block}.section-color-names table tbody tr td div#color-names-color-get.copied{text-align:center;width:70px;background-color:var(--color1)!important}.section-color-names table tbody tr td div#color-names-color-get.copied:after{content:"Copied!";color:var(--color3);font-size:90%;line-height:35px}.section-color-names table tbody tr td#color-names-name a{text-decoration:none}.section-color-converter{width:100%;font-size:.9375rem}.section-color-converter .input-fields{flex-flow:wrap;justify-content:space-between;width:100%;margin-bottom:54px;display:flex}.section-color-converter .input-fields div.input-r,.section-color-converter .input-fields div.input-g,.section-color-converter .input-fields div.input-b{flex:0 0 25%}.section-color-converter .input-fields div.input-rgb{flex:0 0 45px}.section-color-converter .input-fields div.input-rgb span{border:1px solid var(--color1);float:right;border-radius:4px;width:45px;height:45px;display:block}.section-color-converter .input-fields div.input-r label,.section-color-converter .input-fields div.input-g label,.section-color-converter .input-fields div.input-b label{width:20px;color:var(--color1);font-weight:600;display:inline-block}.section-color-converter .input-fields div input{border:1px solid var(--color1);text-align:center;-webkit-appearance:none;-moz-appearance:textfield;border-radius:4px;outline:0;width:calc(100% - 20px);margin:0;padding:10px 20px;font-weight:600;display:inline-block}.section-color-converter .input-fields div input::placeholder{opacity:.25}div.output-fields{width:100%;margin-bottom:100px;overflow-x:auto}@media (max-width:1100px){.section-color-converter .input-fields div.input-r,.section-color-converter .input-fields div.input-g,.section-color-converter .input-fields div.input-b{flex:0 0 100%;margin-bottom:20px}.section-color-converter .input-fields div.input-r label,.section-color-converter .input-fields div.input-g label,.section-color-converter .input-fields div.input-b label{width:50px}.section-color-converter .input-fields div input{width:calc(100% - 50px)}.section-color-converter .input-fields div.input-rgb{flex:0 0 100%}.section-color-converter .input-fields div.input-rgb span{float:right}}.section-color-converter .input-fields div.input-hex{flex:0 0 320px}.section-color-converter .input-fields div.input-hex-color{flex:0 0 45px}.section-color-converter .input-fields div.input-hex-color span{border:1px solid var(--color1);float:right;border-radius:4px;width:45px;height:45px;display:block}.section-color-converter .input-fields div.input-hex label{width:50px;color:var(--color1);font-weight:600;display:inline-block}.section-color-converter .input-fields div input#hex{border:1px solid var(--color1);text-align:center;-webkit-appearance:none;-moz-appearance:textfield;border-radius:4px;outline:0;width:calc(100% - 50px);margin:0;padding:10px 20px;font-weight:600;display:inline-block}@media (max-width:1100px){.section-color-converter .input-fields div.input-hex{flex:0 0 100%;margin-bottom:20px;padding-right:0}.section-color-converter .input-fields div.input-hex-color{flex:0 0 100%}.section-color-converter .input-fields div.input-hex label{width:50px}.section-color-converter .input-fields div input#hex{width:calc(100% - 50px)}}.output-fields table,.output-fields thead,.output-fields tbody,.output-fields tfoot,.output-fields tr,.output-fields th,.output-fields td{text-align:left;-webkit-user-select:text;user-select:text;background:0 0;height:0;margin:0;padding:0}.output-fields table{table-layout:fixed;border-collapse:collapse;width:100%;min-width:350px;font-size:.9375rem}.output-fields table thead tr{border-bottom:1px solid var(--color3);height:50px}.output-fields table thead tr th{color:var(--color1-90);text-transform:uppercase;font-size:90%;font-weight:600}.output-fields table tbody tr td{border-bottom:1px solid var(--color3);height:70px;color:var(--color1);font-weight:600}.output-fields #hex-value,.output-fields #rgb-value,.output-fields #hsv-value,.output-fields #hsl-value,.output-fields #name-value{font-family:monospace}h2#color-name{text-transform:uppercase;color:var(--color1);font-size:.9375rem;font-weight:600;display:inline-block}h3#color-name-text{text-transform:uppercase;color:var(--color1);margin-bottom:20px;font-size:.875rem;font-weight:600;display:block}h3#color-name-text.section-cta-heading{margin-top:60px}div.color-name-box{border-radius:5px;width:100%;height:200px;margin-bottom:60px;display:block}div.format-swatch{border-radius:5px;width:100%;height:80px;margin:16px 0 32px;display:block}a.color-gradient-cta{border:2px solid var(--color3);border-radius:10px;margin-bottom:30px;padding:15px;text-decoration:none;display:block}div.color-gradient-preview{border-radius:5px;width:100%;height:80px;margin-bottom:12px;display:block}span.color-gradient-cta-label{color:var(--color1);font-size:.875rem;font-weight:400;display:block}div.color-name-css{box-sizing:border-box;width:100%;color:var(--color1);border-radius:5px;margin-bottom:60px;padding:20px;display:block;background-color:var(--color3)!important}div.color-name-css pre{white-space:pre-wrap;word-break:break-word;-webkit-user-select:text;user-select:text;max-width:100%;margin:8px 0 0}div.color-name-information{width:100%;color:var(--color1);margin-bottom:80px}.preset-hero{border-radius:5px;width:100%;height:200px;margin-bottom:20px;display:block}.preset-description{width:100%;color:var(--color1);margin-bottom:40px}.preset-stops{flex-wrap:wrap;gap:10px;margin-bottom:60px;display:flex}.preset-stops .preset-stop{cursor:pointer}.color-name-shades>div{cursor:pointer}.color-name-tints>div{cursor:pointer}.color-name-tones>div{cursor:pointer}.color-name-monochromatic>div{cursor:pointer}.color-name-similars>div{cursor:pointer}.preset-stop{border-radius:5px;flex:100px;justify-content:center;align-items:flex-end;height:70px;padding-bottom:8px;display:flex}.preset-stop span{color:#fff;background:rgba(0,0,0,.35);border-radius:4px;padding:2px 6px;font-size:.75rem}.code-block-label{text-transform:uppercase;color:var(--color1);justify-content:space-between;align-items:center;margin-top:16px;font-size:.75rem;font-weight:600;display:flex}.code-block-label:first-child{margin-top:0}.code-block-label a.code-copy-btn{cursor:pointer;text-transform:none;font-weight:400}.preset-related{flex-wrap:wrap;gap:12px;margin-bottom:60px;display:flex}.preset-related-card{flex:140px;text-decoration:none;display:block}.preset-related-swatch{border-radius:5px;width:100%;height:70px;margin-bottom:6px}.preset-related-name{color:var(--color1);font-size:.8125rem}.section-presets{margin-top:0}.preset-filter{border:2px solid var(--color3);border-radius:12px;flex-wrap:wrap;gap:2px;width:-webkit-fit-content;width:fit-content;max-width:100%;margin-bottom:20px;padding:4px;display:flex}.preset-filter-pill{height:32px;color:var(--color1);cursor:pointer;background:0 0;border:none;border-radius:8px;padding:0 16px;font-family:inherit;font-size:.8125rem;font-weight:500}.preset-card[hidden]{display:none}.preset-filter-pill.selected{background:var(--color3)}.palette-hero{border-radius:5px;width:100%;height:200px;margin-bottom:20px;display:flex;overflow:hidden}.palette-hero span{flex:1 1 0;display:block}.palette-related-swatch{border-radius:5px;width:100%;height:70px;margin-bottom:6px;display:flex;overflow:hidden}.palette-related-swatch span{flex:1 1 0;display:block}.palette-contrast{width:100%;margin-bottom:8px;overflow-x:auto}.palette-contrast-table,.palette-contrast-table thead,.palette-contrast-table tbody,.palette-contrast-table tr,.palette-contrast-table th,.palette-contrast-table td{text-align:left;background:0 0;height:0;margin:0;padding:0}.palette-contrast-table{border-collapse:collapse;width:100%;min-width:420px}.palette-contrast-table thead tr{border-bottom:1px solid var(--color3);height:44px;color:var(--color1-90)}.palette-contrast-table thead tr th{text-transform:uppercase;font-size:90%;font-weight:600}.palette-contrast-table th,.palette-contrast-table td{padding-right:10px}.palette-contrast-table th:last-of-type{padding-right:0}.palette-contrast-table td:last-of-type{padding-right:0}.palette-contrast-table tbody tr td{border-bottom:1px solid var(--color3);height:56px;color:var(--color1)}.palette-contrast-swatch{border-radius:35px;width:35px;height:35px;display:block}.palette-contrast-hex{font-size:.8125rem;font-weight:600}.palette-contrast-check{align-items:center;gap:6px;display:flex}.palette-contrast-link-icon{color:currentColor;opacity:.7;flex-shrink:0}.palette-contrast-badge:hover .palette-contrast-link-icon{opacity:1}.palette-contrast-circle{border:.5px solid rgba(0,0,0,.25);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:35px;height:35px;font-size:.9375rem;font-weight:700;display:flex}.palette-contrast-badge{color:var(--color1);cursor:pointer;background:rgba(128,128,128,.3);border-radius:8px;align-items:center;gap:4px;margin-left:4px;padding:4px 8px;font-size:.6875rem;font-weight:700;text-decoration:none;display:inline-flex}.palette-contrast-badge.pass{color:#fff;background:#1a7f37}.palette-contrast-badge.fail{color:#fff;background:#cf222e}.palette-contrast-note{color:var(--color1);opacity:.7;margin-bottom:60px;font-size:.75rem}.guide-cards{flex-wrap:wrap;gap:20px;margin:32px 0 70px;display:flex}.guide-card{border:1px solid var(--color1-25);border-radius:8px;flex:260px;padding:24px;text-decoration:none;display:block}.guide-card:hover{background:var(--color3)}.guide-card-title{color:var(--color1);margin-bottom:8px;font-size:1rem;font-weight:700;display:block}.guide-card-desc{color:var(--color1-90);font-size:.8125rem;line-height:1.5;display:block}div.color-name-details-table{width:100%;margin-bottom:100px;overflow-x:auto}.color-name-details table,.color-name-details thead,.color-name-details tbody,.color-name-details tfoot,.color-name-details tr,.color-name-details th,.color-name-details td{text-align:left;-webkit-user-select:text;user-select:text;background:0 0;height:0;margin:0;padding:0}.color-name-details table{table-layout:fixed;border-collapse:collapse;width:100%;min-width:450px}.color-name-details table tbody tr td{padding-right:10px}.color-name-details table tbody tr td:last-of-type{padding-right:0}.color-name-details table tbody tr td{border-bottom:1px solid var(--color3);height:70px;color:var(--color1)}.color-name-details table tbody tr td#color-name-details-format{font-weight:700}.color-name-details table tbody tr td#color-name-details-value{font-family:monospace}.color-name-shades,.color-name-tints,.color-name-tones,.color-name-monochromatic,.color-name-similars{text-align:center;width:100%;margin-bottom:60px;display:block}.color-name-shades div,.color-name-tints div,.color-name-tones div,.color-name-monochromatic div,.color-name-similars div{text-align:center;cursor:pointer;border-radius:50px;width:100px;height:100px;margin:5px;display:inline-block}.color-name-shades div span,.color-name-tints div span,.color-name-tones div span,.color-name-monochromatic div span,.color-name-similars div span{color:var(--color1);opacity:0;font-size:90%;line-height:100px;display:block}.color-name-shades div:hover{background-color:var(--color3)!important}.color-name-tints div:hover{background-color:var(--color3)!important}.color-name-tones div:hover{background-color:var(--color3)!important}.color-name-monochromatic div:hover{background-color:var(--color3)!important}.color-name-similars div:hover{background-color:var(--color3)!important}.color-name-shades div:hover span{opacity:1}.color-name-tints div:hover span{opacity:1}.color-name-tones div:hover span{opacity:1}.color-name-monochromatic div:hover span{opacity:1}.color-name-similars div:hover span{opacity:1}.icp-drop{border:2px dashed var(--color1-25);text-align:center;cursor:pointer;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:6px;height:220px;padding:16px;display:flex}.icp-drop.dragover,.icp-photo.dragover{background:var(--color3);border-color:var(--color1)}.icp-drop:hover{background:var(--color3);border-color:var(--color1)}#icp-file:focus-visible+.icp-drop{outline:2px solid var(--color1);outline-offset:2px}.icp-drop[hidden]{display:none}.icp-workspace[hidden]{display:none}.icp-picked[hidden]{display:none}.icp-marker[hidden]{display:none}.icp-drop-title{color:var(--color1);font-size:.9375rem;font-weight:600}.icp-drop-note,.icp-hint,.icp-status{font-size:.75rem}.icp-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.icp-replace,.icp-button{white-space:nowrap;border:2px solid var(--color3);height:32px;color:var(--color1);cursor:pointer;background:0 0;border-radius:8px;align-items:center;padding:0 12px;font-family:inherit;font-size:.8125rem;font-weight:500;display:inline-flex}.icp-replace:hover{background:var(--color3)}.icp-button:hover:not(:disabled){background:var(--color3)}.icp-button:disabled{cursor:default;opacity:.5}.icp-photo{border-radius:8px;margin:0 auto;display:block;position:relative}.icp-photo canvas{cursor:crosshair;border-radius:8px;display:block}.icp-marker{pointer-events:none;border:2px solid #fff;border-radius:50%;width:18px;height:18px;position:absolute;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);box-shadow:0 0 0 1px rgba(0,0,0,.4),0 2px 6px rgba(0,0,0,.3)}.icp-picked{border:2px solid var(--color3);border-radius:10px;flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px;padding:12px;display:flex}.icp-picked-swatch{border-radius:8px;flex:0 0 44px;height:44px}.icp-picked-values{color:var(--color1);-webkit-user-select:text;user-select:text;flex-direction:column;flex:140px;font-size:.8125rem;display:flex}.icp-picked-hex{font-weight:600}.icp-picked-actions{gap:8px;display:flex}.icp-controls{gap:16px;margin:24px 0 8px;display:flex}.icp-control{flex-direction:column;flex:0 160px;display:flex}.icp-control-label{color:var(--color1);font-size:.75rem;font-weight:600;line-height:1.5rem}#icp-count,#icp-mood{border:2px solid var(--color3);background:var(--color2);height:48px;color:var(--color1);border-radius:8px;outline:none;font-family:inherit;font-size:.8125rem}#icp-count{padding:0 12px}#icp-mood{padding:0 8px}#icp-count:focus-visible{border-color:var(--color1)}#icp-mood:focus-visible{border-color:var(--color1)}.icp-status{min-height:1.125rem;margin-bottom:16px}.icp-palette{grid-template-columns:repeat(auto-fill,minmax(84px,1fr));margin-top:8px;margin-bottom:48px;display:grid}.icp-palette .preset-stop{position:relative}.icp-copy{cursor:pointer}.icp-unpin{color:#fff;cursor:pointer;background:rgba(0,0,0,.35);border:0;border-radius:50%;width:20px;height:20px;padding:0;font-size:14px;line-height:20px;position:absolute;top:4px;right:4px}.icp-unpin:hover{background:rgba(0,0,0,.55)}.icp-samples{margin-top:20px}.icp-samples[hidden]{display:none}.icp-credit[hidden]{display:none}.icp-samples-label{color:var(--color1);margin-bottom:8px;font-size:.75rem;font-weight:600;display:block}.icp-samples-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;display:grid}.icp-sample{cursor:pointer;aspect-ratio:3/2;background:0 0;border:2px solid transparent;border-radius:8px;padding:0;display:block;overflow:hidden}.icp-sample img{object-fit:cover;width:100%;height:100%;display:block}.icp-sample:hover{border-color:var(--color1);outline:none}.icp-sample:focus-visible{border-color:var(--color1);outline:none}.icp-toolbar-actions{gap:8px;display:flex}.icp-credit{text-align:right;margin-top:6px;font-size:.75rem}.icp-credit a{color:inherit}.icp-error{color:var(--color1);margin:12px 0 0;font-size:.8125rem;font-weight:500}.icp-error[hidden]{display:none}.cta-preview{border-radius:8px;height:80px;margin-bottom:16px}a.primary-cta{background:var(--color1);height:48px;color:var(--color2);border-radius:8px;justify-content:center;align-items:center;font-size:.9375rem;font-weight:600;text-decoration:none;display:flex}a.primary-cta:hover{opacity:.9}a.primary-cta:focus-visible{outline:2px solid var(--color1);outline-offset:2px}.primary-cta-note{margin:10px 0 48px;font-size:.75rem}