/* Author: Twily 2017 Description: Webkit Scrollbars to go with the Gtk theme "Crux" (Using gtk "Crux" with openbox "Artwiz-boxed") Usage: Use with Stylish extension, create a rule applied to all websites. Sources: https://css-tricks.com/custom-scrollbars-in-webkit/ */ ::-webkit-scrollbar { width: 13px; background: linear-gradient(to right, #5f635b 0%,#5f635b 45%,#858c7e 45%,#858c7e 55%,#5f635b 55%,#5f635b 100%); border: 1px solid #5F635B; box-shadow: inset 0 0 0 4px #eee; } ::-webkit-scrollbar:horizontal { height: 13px; background: linear-gradient(to bottom,#5f635b 0%,#5f635b 45%,#858c7e 45%,#858c7e 55%,#5f635b 55%,#5f635b 100%); } ::-webkit-scrollbar-track:vertical { box-shadow: inset 0 15px 15px -15px #696e65, inset 0 -15px 15px -15px #696e65; } ::-webkit-scrollbar-track:horizontal { box-shadow: inset 15px 0 15px -15px #696e65, inset -15px 0 15px -15px #696e65; } ::-webkit-scrollbar-button { width: 13px; height: 13px; background: linear-gradient(to right, #eaece9 0%,#a8aea3 100%); border: 1px solid #696e65; box-shadow: inset 0 0 1px 0 #eee; } ::-webkit-scrollbar-button:horizontal { width: 13px; height: 13px; background: linear-gradient(to bottom, #eaece9 0%,#a8aea3 100%); } ::-webkit-scrollbar-thumb { background: linear-gradient(to right, #ac7bb3 0%,#6f4c74 100%); border: 1px solid #684a6d; box-shadow: inset 0 0 1px 0 #eee; } ::-webkit-scrollbar-thumb:hover { background: linear-gradient(to right, #c39ac9 0%,#725177 100%); } ::-webkit-scrollbar-thumb:horizontal { background: linear-gradient(to bottom, #ac7bb3 0%,#6f4c74 100%); } ::-webkit-scrollbar-thumb:horizontal:hover { background: linear-gradient(to bottom, #c39ac9 0%,#725177 100%); } ::-webkit-scrollbar-corner { background: linear-gradient(to right bottom, #eaece9 0%,#a8aea3 100%); border: 1px solid #696e65; box-shadow: inset 0 0 1px 0 #eee; }