.color-converter-box{max-width:500px;width:100%;padding:5px 10px;margin-inline:auto}.color-input{border:1px solid #d3d3d3;padding:12px 16px;max-width:400px;width:100%;background-color:#fff}.input-head-label{max-width:500px;margin:0 auto}.main-heading-label{font-weight:600;font-size:18px;line-height:24px}.mb-12{margin-bottom:12px}.tool-heading{font-weight:700;font-size:20px}.result-box{margin-top:2rem;min-width:300px;width:100%}.result-heading{font-size:20px;font-weight:700;margin-top:10px}.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.color-varient-box{position:relative;display:flex;max-height:140px;width:100%;height:100%;flex-direction:column;align-items:center;text-align:center;border-radius:5px;overflow:hidden;box-shadow:0 4px 6px rgb(0 0 0 / .1)}.color-varient-box div{width:120px;height:120px}.color-code{position:absolute;bottom:12px;left:70%;transform:translateX(-50%);font-size:14px;font-weight:700;padding:5px;background:rgb(217 217 217 / .8);border-radius:3px}.color-name{font-size:16px;font-weight:500;line-height:20px;width:100%;margin-bottom:0;padding:8px 0}.pickr .pcr-button{width:240px!important;height:140px!important}.output-box{max-width:480px;width:100%;display:flex;justify-content:space-between;align-items:center;padding:12px;background-color:#fff;box-shadow:0 2px 12px 0 #00000014;margin-bottom:1rem}.converted-color{display:flex;gap:1rem;align-items:center}.output-color-box{background-color:red;height:50px;width:50px}.on-change-color{display:flex;justify-content:center;align-items:center;box-shadow:0 2px 12px 0 #00000014;background-color:#fff}.on-change-output-color-box{max-width:480px;width:100%;height:48px;display:flex;justify-content:space-between;align-items:center;padding:12px;background-color:#db2828}.output-color-value{font-weight:700;font-size:18px}.copy-btn{border:1px solid #767676;font-weight:700;padding:6px 12px;cursor:pointer}strong{font-weight:700}.cmyk-grid{display:grid;grid-template-columns:1fr;row-gap:.725rem;margin-bottom:1rem;margin-top:90px}.cmyk-row{display:flex;justify-content:space-between;gap:1rem;padding:6px;align-items:center}.color-range{flex:3;appearance:none;width:100%;cursor:pointer;outline:none;overflow:hidden;border-radius:10px!important;-webkit-appearance:none}.color-range::-webkit-slider-runnable-track{height:15px;background:#eaeaea}.color-range.original::-webkit-slider-runnable-track{background:#3576fa}.color-range::-moz-range-track{height:15px;background:#ccc}.color-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:15px;width:15px;background-color:snow;border-radius:50%;border:1.5px solid #8d8d8d}.color-range::-moz-range-thumb{height:15px;width:15px;background-color:#fff;border-radius:50%;border:1.5px solid #8d8d8d}.color-range.cyan::-webkit-slider-thumb{box-shadow:-407px 0 0 400px cyan}.color-range.cyan::-moz-range-thumb{box-shadow:-407px 0 0 400px cyan}.color-range.magenta::-webkit-slider-thumb{box-shadow:-407px 0 0 400px #f0f}.color-range.magenta::-moz-range-thumb{box-shadow:-407px 0 0 400px #f0f}.color-range.yellow::-webkit-slider-thumb{box-shadow:-407px 0 0 400px #ff0}.color-range.yellow::-moz-range-thumb{box-shadow:-407px 0 0 400px #ff0}.color-range.black::-webkit-slider-thumb{box-shadow:-407px 0 0 400px #000}.color-range.black::-moz-range-thumb{box-shadow:-407px 0 0 400px #000}.color-range.red::-webkit-slider-thumb{box-shadow:-407px 0 0 400px #db2828}.color-range.red::-moz-range-thumb{box-shadow:-407px 0 0 400px #db2828}.color-range.green::-webkit-slider-thumb{box-shadow:-407px 0 0 400px #21ba45}.color-range.green::-moz-range-thumb{box-shadow:-407px 0 0 400px #21ba45}.color-range.blue::-webkit-slider-thumb{box-shadow:-407px 0 0 400px #3576fa}.color-range.blue::-moz-range-thumb{box-shadow:-407px 0 0 400px #3576fa}.abbreviation,.color-value{flex:1;font-weight:500;font-size:16px;line-height:24px;color:#000}.color-value{padding:8px 4px;border:1px solid #d3d3d3;max-width:50px;text-align:center;box-sizing:border-box}.color-value:focus{outline:none}.pantone-conversion-box{display:grid;grid-template-columns:1fr 2fr;gap:1rem}.input-color-box{height:140px;background-color:#dc3636}.color-inputs{display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between}.form-group{flex:1 1 200px;display:flex;flex-direction:column;gap:10px}.form-group label{font-weight:700}.form-group .color-input{box-sizing:border-box}.submit-section{flex:1 1 100%;box-sizing:border-box}.color-input:focus{outline:unset}.content table{margin:0 auto;width:100%}.content table{color:#333;background:#fff;border:1px solid grey;font-size:12pt;border-collapse:collapse}.content table thead th,.content table tfoot th{color:#777;background:rgb(0 0 0 / .1)}.content table caption{padding:.5em}.content table th,.content table td{padding:.5em;border:1px solid lightgrey}.content table td>p{margin:unset}.content table tr:first-child>td{font-weight:700}.submit-section{justify-content:start!important;gap:1rem}.color-display{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:700}.color-box{width:30px;height:30px;border-radius:50%;display:flex;justify-content:center;align-items:center;color:#fff;font-weight:700}.margin-top-left{margin-top:94px;margin-left:20%}.responsive-table-wrapper{overflow-x:auto;width:100%}.input-table{display:flex;flex-direction:column;width:100%;border-collapse:collapse;margin-top:20px}.input-table-label{font-size:18px;font-weight:600;line-height:24px;color:#000;margin-top:20px}.color-table{width:100%;margin-top:16px;border-collapse:collapse;text-align:center}.color-table th,.color-table td{border:1px solid #ddd}.color-table th{background-color:#f4f4f4;font-weight:700}.color-table td:first-child{width:50px;text-align:center}.color-table tbody tr:hover{background-color:#f1f1f1}.color-table.horizontal{overflow-x:auto;display:block;white-space:nowrap}.color-table.horizontal th{text-align:left;background-color:#f4f4f4;padding:4px 28px;vertical-align:top}.color-table.horizontal td{padding:5px 8px;border:1px solid #ddd;vertical-align:top}.responsive-table-wrapper{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.responsive-table-wrapper::-webkit-scrollbar{height:20px}.responsive-table-wrapper::-webkit-scrollbar-thumb{background-color:#999;border-radius:10px}.responsive-table-wrapper::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.color-converter-container{max-width:752px;width:100%;padding:5px 10px;margin-inline:auto}.inner-color-box-container{display:flex;justify-content:space-between;justify-items:center;gap:32px}.source-input{display:flex;flex-direction:column;justify-content:start;gap:10px;width:240px}.span-bold{font-weight:500;font-size:16px;line-height:24px}.input-color{border:1px solid #d3d3d3;padding:12px 16px;max-width:240px;width:100%;color:#757575;background-color:#fff}.input-color:focus{outline:unset}.d-flex{display:flex;flex-direction:row;align-items:center;gap:10px}.rgb-color-display{display:flex;align-items:center;gap:12px}.output-box-container{display:flex;flex-direction:column;gap:12px;max-width:144px;width:100%;display:flex;justify-content:space-between;align-items:center;padding:12px;background-color:#fff;box-shadow:0 2px 12px 0 #00000014;margin-bottom:1rem}.converted-color-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.color-box-main-container{max-width:100%;width:100%;padding:5px 10px;margin-inline:auto}.cmyk-container{display:flex;justify-content:center;gap:20px}.cmyk-color-inputs-container{display:flex;flex-direction:column;gap:10px;max-width:430px;width:430px}.color-box-output{background-color:red;box-shadow:0 2px 12px 0 #00000014;height:240px;width:240px}.cmyk-form-group{display:flex;flex-direction:column;gap:10px;max-width:400px;width:100%}.cmyk-color-input{border:1px solid #d3d3d3;padding:12px 16px;max-width:421px;width:100%;background-color:#fff}@media (max-width:768px){.color-box-main-container{justify-content:center;align-items:center;display:flex;flex-direction:column}.cmyk-container{flex-direction:column;align-items:center}.cmyk-color-input{margin-bottom:20px}}@media (max-width:530px){.color-table th,.color-table td{padding:5px 10px}}@media (max-width:400px){.color-table th,.color-table td{padding:2px 4px}}