.family-color-picker .color-picker span.color-picker-dot{width:60px;height:60px;border:2px solid #000}
.color-picker .color-picker-dot:hover{transform:scale(1.15);outline:1px solid !important}
.color-picker input:checked+label .color-picker-dot{transform:scale(1.15);outline:2px dashed !important}
.color-picker .color-picker-control:checked+label .color-picker-dot::after{font-size:25px;font-weight:700}
.color-picker input+.color-picker-dot-light .color-picker-dot:hover::before,.color-picker input:checked+.color-picker-dot-light .color-picker-dot::before{box-shadow:inset 0 0 0 2px #000}
.family-color-picker.image-stake-item{z-index:99;border-radius:5px}
.family-color-picker .image-stake-item .img-object-cover{border-radius:5px}
.family-color-picker .card-body .display-4{font-size:90px;line-height:120px;font-weight:600;padding:24px 0 45px}
.family-color-picker .card-body .display-4 ~ p{font-size:26px;line-height:36px;font-weight:600}
.family-color-picker .card-body .display-4 ~ .link-group{font-size:20px;font-weight:600;margin-top:25px}
.family-color-picker fieldset label{position:relative;height:100px;padding-right:20px}
.family-color-picker fieldset label .color-picker-label{width:155px !important;top:70px;font-size:16px}
.family-color-picker .color-picker-content .link-group{min-height:2.5rem;margin-top:.5rem}
.family-color-picker .color-picker-animation{opacity:0;transition:2s}
.family-color-picker .animation-active{animation:animationopacity 2s forwards}
@keyframes animationopacity{0{opacity:0}
100%{opacity:1}
}
.family-color-picker .color-picker .color-picker-dot::before{box-shadow:none}
.family-color-picker .color-picker .color-picker-dot:hover{transform:scale(1.15) !important;outline-style:solid !important}
.family-color-picker .color-picker-content .link-group a,.family-color-picker .color-picker-content .badge{margin-top:20px}
html:not([dir=rtl]) .family-color-picker .color-picker input:checked+label .color-picker-label{left:-20px !important}
html[dir=rtl] .family-color-picker .color-picker input:checked+label .color-picker-label{right:-20px !important}
.family-color-picker .color-picker .link-group a:hover,.family-color-picker .color-picker .link-group a:focus{text-decoration:none}
.color-picker input:checked+.color-picker-dot-light .color-picker-dot.dark-button::after{color:#fff !important}
.family-color-picker fieldset label:last-child{padding-right:0 !important}
.family-color-picker fieldset label:last-child span.color-picker-dot{margin-right:0 !important}
@media screen and (min-width:1084px) and (max-width:1200px){.family-color-picker .card-body .display-4{font-size:76px;line-height:90px}
.family-color-picker fieldset label:last-child .color-picker-label{width:110px !important}
}
@media screen and (max-width:1083px){.family-color-picker .image-stake-mob{flex-direction:column-reverse;align-items:center}
.family-color-picker .image-stake-mob .color-picker-content{width:80% !important;left:0;margin-top:-5%}
}
@media screen and (max-width:767px){.family-color-picker .card-offset{flex-direction:column}
.family-color-picker .iconpanel-swatch{padding:20%}
.family-color-picker .card-body .display-4{font-size:50px;line-height:60px}
.family-color-picker .color-picker input:checked+label .color-picker-label{font-size:12px}
html:not([dir=rtl]) .family-color-picker .color-picker input:checked+label:not(:last-child) .color-picker-label{left:-5px !important;padding-top:10px}
html[dir=rtl] .family-color-picker .color-picker input:checked+label .color-picker-label{right:-5px !important;padding-top:10px}
.family-color-picker fieldset label:last-child .color-picker-label{width:110px !important;padding-top:10px}
}
@media screen and (min-width:1084px){.family-color-picker .color-picker{display:flex;margin:0 auto}
.family-color-picker fieldset label{line-height:20px}
}
@media screen and (max-width:539px){.family-color-picker .color-picker span.color-picker-dot{width:48px !important;height:48px !important;margin-right:0 !important;margin-left:0 !important}
.family-color-picker fieldset label .color-picker-label{width:80px !important;margin-top:-10px}
}
.family-color-picker .slider-wrap input.custom-range-input-slider{height:3px;width:41vw;padding:0;margin:0 15%;background:#959595;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.family-color-picker .white-text{color:#fff}
.family-color-picker .slider-wrap input.custom-range-input-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#f2f2f2;border:0;outline:0;cursor:pointer;border-radius:10px;width:100px;height:8px}
.family-color-picker .slider-wrap input.custom-range-input-slider:focus{outline:0}
.family-color-picker .slider-wrap .custom-range-tooltip{display:none}
.family-color-picker .slider-wrap img{width:100% !important;height:190px;object-fit:cover;object-position:0}
.family-color-picker .slider-wrap .slider-image-container{background-size:100%}
.family-color-picker .slider-image .slider-image-container img{z-index:1}
.family-color-picker .slider-image{width:100%}
.family-color-picker .slider-wrap input.custom-range-input-slider:focus::-webkit-slider-thumb{outline:2px dashed #f2f2f2;border:1px solid #000}
@media only screen and (max-width:1083px){.family-color-picker .slider-wrap input.custom-range-input-slider{width:96vw !important}
}
@media only screen and (min-width:2700px){.family-color-picker .slider-wrap input.custom-range-input-slider{width:20vw !important}
}