.color-picker{position:fixed;bottom:-155px;transition:bottom .5s;-webkit-transition:bottom .5s;-moz-transition:bottom .5s;-ms-transition:bottom .5s;-o-transition:bottom .5s;padding:1rem 1rem 2rem;width:200px;left:50%;z-index:2;filter:drop-shadow(0 0 15px var(--principal-color));-webkit-filter:drop-shadow(0 0 15px var(--principal-color));transform:translate(-50%,-50%);& hr{border:1px solid var(--white)}}@media (min-width:576px){.color-picker{left:calc(50% + 205px / 2)}.color-picker-margin{left:calc(50% + .5rem)}}.color-picker input[type='radio']:after{width:20px;height:20px;border-radius:20px;top:-3px;left:0;position:relative;content:'';display:inline-block;visibility:visible;border:3px solid gray;cursor:pointer;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px}input[type='color']{cursor:pointer;width:20px;height:20px;border:3px solid gray;border:none;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px}input[value='default-color']:after{background-color:#ff5b02}input[value='dodgerblue']:after{background-color:dodgerblue}input[value='mediumorchid']:after{background-color:mediumorchid}input[value='goldenrod']:after{background-color:goldenrod}input[value='deeppink']:after{background-color:deeppink}input[type='radio']:checked:after{border:3px solid white}