2 ----------------------------------*/
4 .ui-button { display: inline-block
; position: relative
; padding: 0; margin-right: .1em; text-decoration: none
!important
; cursor: pointer
; text-align: center
; zoom: 1; overflow: visible
; } /* the overflow property removes extra width in IE */
5 .ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */
6 button
.ui-button-icon-only
{ width: 2.4em; } /* button elements seem to need a little more width */
7 .ui-button-icons-only { width: 3.4em; }
8 button
.ui-button-icons-only
{ width: 3.7em; }
10 /*button text element */
11 .ui-button .ui-button-text { display: block
; line-height: 1.4; }
12 .ui-button-text-only .ui-button-text { padding: 0.3em 1em 0.25em 1em; }
13 .ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: 0.3em; text-indent: -9999999px; }
14 .ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: 0.3em 1em 0.25em 2.1em; }
15 .ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: 0.3em 2.1em 0.25em 1em; }
16 .ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; }
18 /* no icon support for input elements, provide padding by default */
19 input
.ui-button
{ padding: 0.3em 1em; }
21 /*button icon element(s) */
22 .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-text-icon .ui-icon, .ui-button-icons-only .ui-icon { position: absolute
; top: 50%; margin-top: -9px; }
23 .ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; }
24 .ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icon .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: 0.5em; }
25 .ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icon .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: 0.5em; }
28 .ui-buttonset { margin-right: 7px; }
29 .ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; }
32 button
.ui-button::-moz-focus-inner
{ border: 0; padding: 0; } /* reset extra padding in Firefox */
35 margin: 0.5em 0 0.5em 0.4em;
36 border: 1px solid
#a6a6a6 !important
;
38 background: #f2f2f2 url
(images
/button-off
.png
) repeat-x scroll
50% 100% !important
;
47 /* This is normally handled in jquery.ui.theme.css, but in our case, the corner
48 styling of our buttons doesn't match our default widget corner styling */
49 .ui-button.ui-corner-all, .ui-button.ui-corner-top, .ui-button.ui-corner-left, .ui-button.ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; }
50 .ui-button.ui-corner-all, .ui-button.ui-corner-top, .ui-button.ui-corner-right, .ui-button.ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; }
51 .ui-button.ui-corner-all, .ui-button.ui-corner-bottom, .ui-button.ui-corner-left, .ui-button.ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; }
52 .ui-button.ui-corner-all, .ui-button.ui-corner-bottom, .ui-button.ui-corner-right, .ui-button.ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; }
54 body
.ui-button:hover
{
55 border-color: #6e7273;
57 background: #e1e1e1 url
(images
/button-over
.png
) repeat-x scroll
50% 100% !important
;
59 body
.ui-button:active
,
60 body
.ui-button:focus
{
61 border-color: #707271;
63 background: #bfbfbf url
(images
/button-down
.png
) repeat-x scroll
50% 100% !important
;
65 body
.ui-button
.disabled
{
67 border-color: #cccccc;
69 background: #f2f2f2 url
(images
/button-disabled
.png
) repeat-x scroll
50% 100% !important
;
71 /* Disables the annoying dashed border Firefox puts on active buttons */
72 body button
.ui-button::-moz-focus-inner
{
75 /* Give large buttons some extra padding */
76 body
.ui-button-large
{
79 /* Use white icons for colored buttons */
80 .ui-button-green .ui-icon, .ui-button-blue .ui-icon, .ui-button-red .ui-icon, .ui-button-orange .ui-icon {
82 background-image: url
(images
/ui-icons_ffffff_256x240
.png
) !important
;
87 body
.ui-button
.ui-button-green
{
88 color: white
!important
;
89 border-color: #97af7e !important
;
91 background: #3cb677 url
(images
/button-green
.png
) repeat-x scroll
50% 100% !important
;
93 body
.ui-button
.ui-button-green:hover
{
94 border-color: #778e61 !important
;
96 background: #339b65 url
(images
/button-green-hover
.png
) repeat-x scroll
50% 100% !important
;
98 body
.ui-button
.ui-button-green
.ui-button-large
{
100 background: #3cb677 url
(images
/button-green-large
.png
) repeat-x scroll
50% 100% !important
;
102 body
.ui-button
.ui-button-green
.ui-button-large:hover
{
104 background: #339b65 url
(images
/button-green-hover-large
.png
) repeat-x scroll
50% 100% !important
;
106 body
.ui-button
.ui-button-green
.disabled
{
107 filter:alpha
(opacity
=50);
109 -khtml-opacity: 0.50;
115 body
.ui-button
.ui-button-blue
{
116 color: white
!important
;
117 border-color: #628acb !important
;
119 background: #3365ba url
(images
/button-blue
.png
) repeat-x scroll
50% 100% !important
;
121 body
.ui-button
.ui-button-blue:hover
{
122 border-color: #5375ad !important
;
124 background: #2b569e url
(images
/button-blue-hover
.png
) repeat-x scroll
50% 100% !important
;
126 body
.ui-button
.ui-button-blue
.ui-button-large
{
128 background: #3365ba url
(images
/button-blue-large
.png
) repeat-x scroll
50% 100% !important
;
130 body
.ui-button
.ui-button-blue
.ui-button-large:hover
{
132 background: #2b569e url
(images
/button-blue-hover-large
.png
) repeat-x scroll
50% 100% !important
;
134 body
.ui-button
.ui-button-blue
.disabled
{
135 filter:alpha
(opacity
=50);
137 -khtml-opacity: 0.50;
143 body
.ui-button
.ui-button-red
{
144 color: white
!important
;
145 border-color: #af977e !important
;
147 background: #cb0000 url
(images
/button-red
.png
) repeat-x scroll
50% 100% !important
;
149 body
.ui-button
.ui-button-red:hover
{
150 border-color: #8e7761 !important
;
152 background: #ad0000 url
(images
/button-red-hover
.png
) repeat-x scroll
50% 100% !important
;
154 body
.ui-button
.ui-button-red
.ui-button-large
{
156 background: #cb0000 url
(images
/button-red
.png
) repeat-x scroll
50% 100% !important
;
158 body
.ui-button
.ui-button-red
.ui-button-large:hover
{
160 background: #ad0000 url
(images
/button-red-hover
.png
) repeat-x scroll
50% 100% !important
;
162 body
.ui-button
.ui-button-red
.disabled
{
163 filter:alpha
(opacity
=50);
165 -khtml-opacity: 0.50;
171 body
.ui-button
.ui-button-orange
{
172 color: white
!important
;
173 border-color: #f3a863 !important
;
175 background: #f07f14 url
(images
/button-orange
.png
) repeat-x scroll
50% 100% !important
;
177 body
.ui-button
.ui-button-orange:hover
{
178 border-color: #ce9055 !important
;
180 background: #cc6c11 url
(images
/button-orange-hover
.png
) repeat-x scroll
50% 100% !important
;
182 body
.ui-button
.ui-button-orange
.ui-button-large
{
184 background: #f07f14 url
(images
/button-orange-large
.png
) repeat-x scroll
50% 100% !important
;
186 body
.ui-button
.ui-button-orange
.ui-button-large:hover
{
188 background: #cc6c11 url
(images
/button-orange-hover-large
.png
) repeat-x scroll
50% 100% !important
;
190 body
.ui-button
.ui-button-orange
.disabled
{
191 filter:alpha
(opacity
=50);
193 -khtml-opacity: 0.50;