@define-color bg_color -gtk-win32-color(button, 15); @define-color text_color -gtk-win32-color(button, 18); @define-color base_color #fff; @define-color selected_bg_color -gtk-win32-color(button, 13); @define-color selected_fg_color -gtk-win32-color(button, 14); @define-color info_fg_color rgb (181, 171, 156); @define-color info_bg_color rgb (252, 252, 189); @define-color warning_fg_color rgb (173, 120, 41); @define-color warning_bg_color rgb (250, 173, 61); @define-color question_fg_color rgb (97, 122, 214); @define-color question_bg_color rgb (138, 173, 212); @define-color error_fg_color rgb (166, 38, 38); @define-color error_bg_color rgb (237, 54, 54); GtkWindow, GtkViewport { background-color: @bg_color; } * { color: -gtk-win32-color(button, 18); -GtkWidget-link-color: -gtk-win32-color(button, 26); -GtkWidget-visited-link-color: -gtk-win32-color(button, 26); border-color: shade (@bg_color, 0.6); -GtkScrolledWindow-scrollbars-within-bevel: 1; -GtkScrolledWindow-scrollbars-spacing: 0; } GtkFrame { border-width: 2px; border-style: solid; background-color: transparent; border-image: -gtk-win32-theme-part(button, 4 1) 2 2 2 2 stretch; } *:insensitive { color: -gtk-win32-color(button, 17); } *:selected, *:selected:focus { background-color: @selected_bg_color; color: @selected_fg_color; } .info { background-color: @info_bg_color; color: @info_fg_color; } .warning { background-color: @warning_bg_color; color: @warning_fg_color; } .question { background-color: @question_bg_color; color: @question_fg_color; } .error { background-color: @error_bg_color; color: @error_fg_color; } .highlight { background-color: @selected_bg_color; color: @selected_fg_color; } .light-area-focus { color: #000; } .dark-area-focus { color: #fff; } .notebook > GtkScrolledWindow.frame { border-style: none; } GtkScrolledWindow.frame { border-style: solid; border-width: 2px; border-image: -gtk-win32-theme-part(listview, 5 1) 2 2 2 2 stretch; } .view { border-width: 0; border-radius: 0; background-color: @base_color; color: @text_color; } .view:selected { background-color: shade (@bg_color, 0.9); color: @fg_color; } .view:selected:focused { background-color: @selected_bg_color; color: @selected_fg_color; } .tooltip { background-color: -gtk-win32-color(button, 24); color: -gtk-win32-color(button, 23); border-width: 1px; border-style: solid; } .tooltip * { color: -gtk-win32-color(button, 23); } GtkAssistant .sidebar .highlight { font: bold; color: -gtk-win32-color(button, 9); } /* Buttons */ .button { color: -gtk-win32-color(button, 18); background-color: transparent; background-image: -gtk-win32-theme-part(button, 1 1); border-width: 0; -GtkWidget-focus-line-width: 1; -GtkWidget-focus-padding: 3; -GtkButton-interior-focus: true; padding: 3px; } .button:insensitive { background-image: -gtk-win32-theme-part(button, 1 4); } .button:focused { background-image: -gtk-win32-theme-part(button, 1 5); } .button:prelight, .button:prelight:focused { background-image: -gtk-win32-theme-part(button, 1 2); color: #000000; } .button:active, .button:active:focused, .button:active:focused:prelight { background-image: -gtk-win32-theme-part(button, 1 3); } /* Check buttons */ .check { background-color: transparent; background-image: -gtk-win32-theme-part(button, 3 1); border-width: 0; } .check:insensitive { background-image: -gtk-win32-theme-part(button, 3 4); } /* The GtkButton here is to avoid problems with checkboxes in a listview where all checkboxes in a row gets prelighted whenever the row is prelighted */ GtkButton.check:prelight { background-image: -gtk-win32-theme-part(button, 3 2); } .check:active { background-image: -gtk-win32-theme-part(button, 3 5); } .check:active:insensitive { background-image: -gtk-win32-theme-part(button, 3 8); } GtkButton.check:active:prelight { background-image: -gtk-win32-theme-part(button, 3 6); } .check:inconsistent { background-image: -gtk-win32-theme-part(button, 3 9); } .check:inconsistent:insensitive { background-image: -gtk-win32-theme-part(button, 3 12); } .check:inconsistent:prelight { background-image: -gtk-win32-theme-part(button, 3 10); } /* Radio buttons */ .radio { background-color: transparent; background-image: -gtk-win32-theme-part(button, 2 1); border-width: 0; } .radio:insensitive { background-image: -gtk-win32-theme-part(button, 2 4); } .radio:prelight { background-image: -gtk-win32-theme-part(button, 2 2); } .radio:active { background-image: -gtk-win32-theme-part(button, 2 5); } .radio:active:insensitive { background-image: -gtk-win32-theme-part(button, 2 8); } .radio:active:prelight { background-image: -gtk-win32-theme-part(button, 2 6); } .radio:inconsistent { background-image: -gtk-win32-theme-part(button, 2 1, over (2 5, 0.3)); } .radio:inconsistent:insensitive { background-image: -gtk-win32-theme-part(button, 2 4, over (2 8, 0.3)); } .radio:inconsistent:prelight { background-image: -gtk-win32-theme-part(button, 2 4, over(2 6, 0.3)); } /* Scrollbars */ /* TODO: Win32 has different concept for upper and lower trough, we don't use this atm */ .scrollbar { background-color: transparent; -GtkRange-trough-border: 0; -GtkRange-arrow-scaling: 0.0; -GtkRange-slider-width: -gtk-win32-size(scrollbar, 3); } .scrollbar.vertical { -GtkRange-slider-width: -gtk-win32-size(scrollbar, 2); } .scrollbar.button.bottom { background-image: -gtk-win32-theme-part(scrollbar, 1 5); } .scrollbar.button.bottom:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 6); } .scrollbar.button.bottom:active, .scrollbar.button.bottom:active:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 7); } .scrollbar.button.bottom:insensitive { background-image: -gtk-win32-theme-part(scrollbar, 1 8); } .scrollbar.button.top { background-image: -gtk-win32-theme-part(scrollbar, 1 1); } .scrollbar.button.top:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 2); } .scrollbar.button.top:active, .scrollbar.button.top:active:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 3); } .scrollbar.button.top:insensitive { background-image: -gtk-win32-theme-part(scrollbar, 1 4); } .scrollbar.button.left { background-image: -gtk-win32-theme-part(scrollbar, 1 9); } .scrollbar.button.left:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 10); } .scrollbar.button.left:active, .scrollbar.button.left:active:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 11); } .scrollbar.button.left:insensitive { background-image: -gtk-win32-theme-part(scrollbar, 1 12); } .scrollbar.button.right { background-image: -gtk-win32-theme-part(scrollbar, 1 13); } .scrollbar.button.right:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 14); } .scrollbar.button.right:active, .scrollbar.button.right:active:prelight { background-image: -gtk-win32-theme-part(scrollbar, 1 15); } .scrollbar.button.right:insensitive { background-image: -gtk-win32-theme-part(scrollbar, 1 16); } .scrollbar.trough { border-width: 0; background-image: -gtk-win32-theme-part(scrollbar, 2 1, over (4 1)); } .scrollbar.trough.vertical { border-width: 0; background-image: -gtk-win32-theme-part(scrollbar, 2 1, over (6 1)); } .scrollbar.slider { border-width: 0; background-image: -gtk-win32-theme-part(scrollbar, 2 1, over (8 1)); } .scrollbar.slider:prelight { background-image: -gtk-win32-theme-part(scrollbar, 2 2, over (8 2)); } .scrollbar.slider.vertical { background-image: -gtk-win32-theme-part(scrollbar, 3 1, over (9 1)); } .scrollbar.slider.vertical:prelight { background-image: -gtk-win32-theme-part(scrollbar, 3 2, over (9 2)); } /* Entry */ /* We apply the border as a border combined with the background so that gtk_entry_set_has_frame works */ .entry { border-width: 1px; border-style: solid; border-image: -gtk-win32-theme-part(edit, 6 1) 1 1 1 1 stretch; background-image: -gtk-win32-theme-part(edit, 6 1, margins(-1 -1 -1 -1)); padding: 2px; } .entry:insensitive { border-image: -gtk-win32-theme-part(edit, 6 4) 1 1 1 1 stretch; background-image: -gtk-win32-theme-part(edit, 6 4, margins(-1 -1 -1 -1)); color: #a7aba7; } .entry:prelight { border-image: -gtk-win32-theme-part(edit, 6 2) 1 1 1 1 stretch; background-image: -gtk-win32-theme-part(edit, 6 2, margins(-1 -1 -1 -1)); } .entry:focused { border-image: -gtk-win32-theme-part(edit, 6 3) 1 1 1 1 stretch; background-image: -gtk-win32-theme-part(edit, 6 3, margins(-1 -1 -1 -1)); } /* Spinbuttons */ .spinbutton .button, .spinbutton .button:focused { background-color: transparent; background-image: -gtk-win32-theme-part(spin, 1 1, margins(-1 -1 0 -1)); color: rgba(0, 0, 0, 0); } .spinbutton .button:last-child { background-image: -gtk-win32-theme-part(spin, 1 1, margins(-1 -1 0 -2)); } .spinbutton .button:prelight, .spinbutton .button:prelight:focused { background-image: -gtk-win32-theme-part(spin, 1 2, margins(-1 -1 0 -1)); } .spinbutton .button:active, .spinbutton .button:active:prelight, .spinbutton .button:active:focused, .spinbutton .button:active:prelight:focused { background-image: -gtk-win32-theme-part(spin, 1 3, margins(-1 -1 0 -1)); } .spinbutton .button:insensitive { background-image: -gtk-win32-theme-part(spin, 1 4, margins(-1 -1 0 -1)); } .spinbutton .button:insensitive:last-child { background-image: -gtk-win32-theme-part(spin, 1 4, margins(-1 -1 0 -2)); } .spinbutton .button.bottom, .spinbutton .button.bottom:focused { background-image: -gtk-win32-theme-part(spin, 2 1); } .spinbutton .button.bottom:prelight, .spinbutton .button.bottom:prelight:focused { background-image: -gtk-win32-theme-part(spin, 2 2); } .spinbutton .button.bottom:active, .spinbutton .button.bottom:active:prelight { background-image: -gtk-win32-theme-part(spin, 2 3); } .spinbutton .button.bottom:insensitive { background-image: -gtk-win32-theme-part(spin, 2 4); } /* Ranges */ /* TODO: The trough is not quite right, it covers everything, but in win32 the slider 'sticks out' on the sides of the trough */ .scale { background-color: transparent; -GtkScale-value-spacing: 0; -GtkScale-slider-length: 12; -GtkRange-slider-width: 20; -GtkRange-trough-border: 0; } .scale.trough { border-style: none; border-width: 0; background-image: -gtk-win32-theme-part(trackbar, 1 1, margins (2 0 2 0)); } .scale.trough.vertical { background-image: -gtk-win32-theme-part(trackbar, 1 1, margins (0 2 0 2)); } .scale.slider { background-color: transparent; border-width: 0; color: rgba(0,0,0,0); background-image: -gtk-win32-theme-part(trackbar, 3 1); } .scale.slider:prelight { background-image: -gtk-win32-theme-part(trackbar, 3 2); } .scale.slider:active, .scale.slider:prelight:active { background-image: -gtk-win32-theme-part(trackbar, 3 3); } .scale.slider:focus { background-image: -gtk-win32-theme-part(trackbar, 3 4); } .scale.slider:insensitive { background-image: -gtk-win32-theme-part(trackbar, 3 5); } .scale.slider.vertical { background-image: -gtk-win32-theme-part(trackbar, 6 1); } .scale.slider.vertical:prelight { background-image: -gtk-win32-theme-part(trackbar, 6 2); } .scale.slider.vertical:active, .scale.slider.vertical:prelight:active { background-image: -gtk-win32-theme-part(trackbar, 6 3); } .scale.slider.vertical:focus { background-image: -gtk-win32-theme-part(trackbar, 6 4); } .scale.slider.vertical:insensitive { background-image: -gtk-win32-theme-part(trackbar, 6 5); } .scale.slider.scale-has-marks-below { background-image: -gtk-win32-theme-part(trackbar, 4 1); } .scale.slider.scale-has-marks-below:prelight { background-image: -gtk-win32-theme-part(trackbar, 4 2); } .scale.slider.scale-has-marks-below:active, .scale.slider.scale-has-marks-below:prelight:active { background-image: -gtk-win32-theme-part(trackbar, 4 3); } .scale.slider.scale-has-marks-below:focus { background-image: -gtk-win32-theme-part(trackbar, 4 4); } .scale.slider.scale-has-marks-below:insensitive { background-image: -gtk-win32-theme-part(trackbar, 4 5); } .scale.slider.scale-has-marks-below.vertical { background-image: -gtk-win32-theme-part(trackbar, 8 1); } .scale.slider.scale-has-marks-below.vertical:prelight { background-image: -gtk-win32-theme-part(trackbar, 8 2); } .scale.slider.scale-has-marks-below.vertical:active, .scale.slider.scale-has-marks-below.vertical:prelight:active { background-image: -gtk-win32-theme-part(trackbar, 8 3); } .scale.slider.scale-has-marks-below.vertical:focus { background-image: -gtk-win32-theme-part(trackbar, 8 4); } .scale.slider.scale-has-marks-below.vertical:insensitive { background-image: -gtk-win32-theme-part(trackbar, 8 5); } .scale.slider.scale-has-marks-above { background-image: -gtk-win32-theme-part(trackbar, 5 1); } .scale.slider.scale-has-marks-above:prelight { background-image: -gtk-win32-theme-part(trackbar, 5 2); } .scale.slider.scale-has-marks-above:active, .scale.slider.scale-has-marks-above:prelight:active { background-image: -gtk-win32-theme-part(trackbar, 5 3); } .scale.slider.scale-has-marks-above:focus { background-image: -gtk-win32-theme-part(trackbar, 5 4); } .scale.slider.scale-has-marks-above:insensitive { background-image: -gtk-win32-theme-part(trackbar, 5 5); } .scale.slider.scale-has-marks-above.vertical { background-image: -gtk-win32-theme-part(trackbar, 7 1); } .scale.slider.scale-has-marks-above.vertical:prelight { background-image: -gtk-win32-theme-part(trackbar, 7 2); } .scale.slider.scale-has-marks-above.vertical:active, .scale.slider.scale-has-marks-above.vertical:prelight:active { background-image: -gtk-win32-theme-part(trackbar, 7 3); } .scale.slider.scale-has-marks-above.vertical:focus { background-image: -gtk-win32-theme-part(trackbar, 7 4); } .scale.slider.scale-has-marks-above.vertical:insensitive { background-image: -gtk-win32-theme-part(trackbar, 7 5); } /* Progress bars */ GtkProgressBar { background-color: transparent; padding: 0; } GtkProgressBar.trough { border-width: 0; background-image: -gtk-win32-theme-part(progress, 1 1); } GtkProgressBar.progressbar, GtkEntry.progressbar, GtkEntry.progressbar:focused { border-width: 0; background-image: -gtk-win32-theme-part(progress, 5 1); } GtkProgressBar.progressbar.pulse, GtkEntry.progressbar.pulse, GtkEntry.progressbar.pulse:focused { background-color: transparent; background-image: -gtk-win32-theme-part(progress, 8 1); } GtkProgressBar.trough.vertical { background-image: -gtk-win32-theme-part(progress, 2 1); } .progressbar.vertical { background-image: -gtk-win32-theme-part(progress, 6 1); } .progressbar.pulse.vertical { background-image: -gtk-win32-theme-part(progress, 10 1); } /* Combobox */ GtkComboBox.combobox-entry .button { background-color: transparent; border-width: 0; background-image: -gtk-win32-theme-part(combobox, 1 1); color: rgba(0, 0, 0, 0); } GtkComboBox.combobox-entry .button:prelight, GtkComboBox.combobox-entry .button:focused, GtkComboBox.combobox-entry .button:prelight:focused { background-image: -gtk-win32-theme-part(combobox, 1 2); } GtkComboBox.combobox-entry .button:active, GtkComboBox.combobox-entry .button:active:focused, GtkComboBox.combobox-entry .button:active:prelight, GtkComboBox.combobox-entry .button:active:focused:prelight { background-image: -gtk-win32-theme-part(combobox, 1 3); } GtkComboBox.combobox-entry .button:insensitive { background-image: -gtk-win32-theme-part(combobox, 1 4); } GtkComboBox .separator { /* always disable separators */ -GtkWidget-wide-separators: true; -GtkWidget-horizontal-separator: 0; -GtkWidget-vertical-separator: 0; } /* Notebook */ .notebook { background-color: #ffffff; border-width: 1px 1px 1px 1px; border-style: solid; background-origin: padding-box; background-clip: border-box; background-image: -gtk-win32-theme-part(tab, 9 1, margins(-1 -3 -2 -1)); border-image: -gtk-win32-theme-part(tab, 9 1, margins(0 -2 -1 0)) 1 1 1 1 repeat; -GtkNotebook-tab-overlap: 1; -GtkNotebook-tab-curvature: 0; } .notebook tab { border-width: 0; background-image: -gtk-win32-theme-part(tab, 1 1); padding: 0px 4px 0px 4px; } .notebook tab.left, .notebook tab.right { padding: 4px 0px 4px 0px; } .notebook tab:active { background-image: -gtk-win32-theme-part(tab, 1 3, margins(0 0 -1 0)); } .notebook tab:active.top { padding: 2px 4px 1px 4px; } .notebook tab:active.bottom { padding: 1px 4px 2px 4px; } .notebook tab:active.right { padding: 4px 4px 4px 1px; } .notebook tab:active.left { padding: 4px 1px 4px 4px; } /* Toolbar */ .toolbar { background-color: transparent; border-width: 0; background-image: -gtk-win32-theme-part(rebar, 6 1); } .toolbar .button, .toolbar .button:focused { background-color: transparent; background-image: -gtk-win32-theme-part(toolbar, 1 1); } .toolbar .button:prelight, .toolbar .button:prelight:focused { background-image: -gtk-win32-theme-part(toolbar, 1 2); } .toolbar .button:active { background-image: -gtk-win32-theme-part(toolbar, 1 3); } .toolbar .button:active:prelight { background-image: -gtk-win32-theme-part(toolbar, 1 6); } .toolbar .button:insensitive { background-image: -gtk-win32-theme-part(toolbar, 1 4); } /* Column headers */ column-header .button, column-header .button:focus { background-color: transparent; border-width: 0; background-image: -gtk-win32-theme-part(header, 1 1); } column-header .button:prelight, column-header .button:prelight:focus { background-image: -gtk-win32-theme-part(header, 1 2); } column-header .button:active, column-header .button:active:prelight, column-header .button:active:focus, column-header .button:active:prelight:focus { background-image: -gtk-win32-theme-part(header, 1 3); } GtkSwitch { font: bold condensed 10; color: -gtk-win32-color(button, 18); } GtkSwitch.slider { padding: 4px; background-color: transparent; background-image: -gtk-win32-theme-part(scrollbar, 2 1, over (8 1)); border-width: 0; } GtkSwitch.trough:insensitive { background-image: -gtk-win32-theme-part(button, 1 4); } GtkSwitch.trough { background-image: -gtk-win32-theme-part(button, 1 1); } GtkSwitch.trough:active { background-image: -gtk-win32-theme-part(button, 1 2); } /* Menus */ .menu { background-color: -gtk-win32-color(button, 4); border-color: shade (-gtk-win32-color(button, 4), 0.6); border-style: solid; border-width: 1px; padding: 2px; } .menuitem { color: -gtk-win32-color(button, 7); } .menubar .menuitem *:backdrop { color: mix (-gtk-win32-color(button, 7), white, 0.5); } .menubar > .menuitem { padding: 3px 5px; } /* Assistant */ GtkAssistant .sidebar .highlight { background-color: gray; font: bold; } GtkAssistant .sidebar { padding: 12px; background-color: white; border-image: none; border-width: 0 1px 0 0; border-style: solid; } GtkColorSwatch { border-style: solid; border-width: 1px; } GtkColorSwatch:prelight { border-color: shade (@bg_color, 0.2); } .separator, .separator:prelight { color: shade (@bg_color, 0.6); } GtkStatusbar > GtkFrame { border-width: 1px 1px 1px 1px; border-style: solid; border-image: -gtk-win32-theme-part(status, 0 0, margins (-1 0 0 0)) 2 1 1 1 stretch; background-image: none; } /* This doesn't quite look right with no background (i.e. when not on a statusbar .grip { background-color: transparent; background-image: -gtk-win32-theme-part(status, 3 1); } */ @keyframes spinner { 0% { background-image: none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)); } 0% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)); } 8% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none; } 8% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)); } 16% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)); } 16% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)); } 25% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)); } 25% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)); } 33% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)); } 33% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)); } 41% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)); } 41% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)); } 50% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)); } 50% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)); } 58% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)); } 58% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)); } 66% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)); } 66% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)); } 75% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)); } 75% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)); } 83% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)); } 83% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)); } 91% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)); } 91% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)); } 100% { background-image: none, -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)); } 100% { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)); } } .spinner { background-color: transparent; background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)); background-position: 25.00% 6.70%, 6.70% 25.00%, 0.00% 50.00%, 6.70% 75.00%, 25.00% 93.30%, 50.00% 100.00%, 75.00% 93.30%, 93.30% 75.00%, 100.00% 50.00%, 93.30% 25.00%, 75.00% 6.70%, 50.00% 0.00%; background-size: 20% 20%; background-repeat: no-repeat; transition: background-image 500ms ease-out; } .spinner:active { background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.916667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.75)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.666667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.583333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.5)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.416667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.333333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.25)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.166667)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(alpha(currentColor, 0.0833333)), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(currentColor), to(transparent)); animation: spinner 1s infinite linear; }