Your IP : 18.118.7.166
/*region Variables*/
:root {
/*size*/
--ui-btn-size-xs: 26px;
--ui-btn-size-sm: 31px;
--ui-btn-size-md: 39px;
--ui-btn-size-lg: 47px;
/*default param*/
--ui-btn-size-padding: 20px;
--ui-btn-size-min-width: 80px;
--ui-btn-size-height: var(--ui-btn-size-md);
--ui-btn-size-font-size: 12px;
--ui-btn-colors-bg: #868d95;
--ui-btn-colors-bg-hover: #5b6573;
--ui-btn-colors-bg-active: #3b506e;
--ui-btn-colors-bd: #868d95;
--ui-btn-colors-bd-hover: #5b6573;
--ui-btn-colors-bd-active: #3b506e;
--ui-btn-opacity-after: .8;
--ui-btn-colors-after-bg: #fff;
--ui-btn-colors-before-bg: #fff;
--ui-btn-colors-clr: #fff;
--ui-btn-colors-clr-hover: #fff;
--ui-btn-colors-clr-active: #fff;
}
/*endregion*/
/*region Base style*/
.ui-btn-container { margin: 15px 0; }
.ui-btn-container-center { text-align: center; }
.ui-btn,
.ui-btn-main,
.ui-btn-extra {
box-sizing: border-box;
margin: 0;
height: 39px;
height: var(--ui-btn-size-height);
outline: none;
border: 1px solid #868d95;
border: 1px solid var(--ui-btn-colors-bd);
background-color: #868d95;
background-color: var(--ui-btn-colors-bg);
cursor: pointer;
transition: 160ms background-color linear, 160ms color linear, 160ms opacity linear, 160ms border-color linear;
}
.ui-btn,
.ui-btn-main {
position: relative;
display: inline-block;
padding: 0 19px;
padding: 0 var(--ui-btn-size-padding);
color: #fff;
color: var(--ui-btn-colors-clr);
vertical-align: middle;
text-align: center;
text-decoration: none;
text-transform: uppercase;
white-space: nowrap;
font: 600 12px/37px "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font: 600 var(--ui-btn-size-font-size)/calc(var(--ui-btn-size-height) - 2px) "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.ui-btn {
min-width: var(--ui-btn-size-min-width);
border-radius: 2px;
}
.ui-btn-double {
position: relative;
display: inline-block;
padding-right: 30px;
border-radius: 3px;
}
.ui-btn-main {
padding-right: var(--ui-btn-size-padding);
border-right: none !important;
border-radius: 2px 0 0 2px;
}
.ui-btn-extra {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 30px;
border-left: none !important;
border-radius: 0 2px 2px 0;
}
.ui-btn:hover,
a.ui-btn:focus,
.ui-btn.ui-btn-hover,
.ui-btn-main:hover,
.ui-btn-hover .ui-btn-main,
.ui-btn-main-hover .ui-btn-main,
.ui-btn-extra:hover,
.ui-btn-hover .ui-btn-extra,
.ui-btn-extra-hover .ui-btn-extra {
border-color: #5b6573;
border-color: var(--ui-btn-colors-bd-hover);
background-color: #5b6573;
background-color: var(--ui-btn-colors-bg-hover);
color: #fff;
color: var(--ui-btn-colors-clr-hover);
text-decoration: none;
}
.ui-btn:active,
.ui-btn-wait.ui-btn,
.ui-btn-wait.ui-btn:hover,
.ui-btn-wait .ui-btn-main,
.ui-btn-wait .ui-btn-main:hover,
.ui-btn-wait .ui-btn-main:active,
.ui-btn-clock.ui-btn,
.ui-btn-clock.ui-btn:hover,
.ui-btn-clock .ui-btn-main,
.ui-btn-clock .ui-btn-main:hover,
.ui-btn-clock .ui-btn-main:active,
.ui-btn-active.ui-btn,
.ui-btn-active.ui-btn:hover,
.ui-btn-main:active,
.ui-btn-extra:active,
.ui-btn-active .ui-btn-main,
.ui-btn-active .ui-btn-main:hover,
.ui-btn-main-active .ui-btn-main,
.ui-btn-main-active .ui-btn-main:hover,
.ui-btn-active .ui-btn-extra,
.ui-btn-active .ui-btn-extra:hover,
.ui-btn-extra-active .ui-btn-extra,
.ui-btn-extra-active .ui-btn-extra:hover {
outline: none;
border-color: #3b506e;
border-color: var(--ui-btn-colors-bd-active);
background-color: #3b506e;
background-color: var(--ui-btn-colors-bg-active);
color: #fff;
color: var(--ui-btn-colors-clr-active);
}
.ui-btn-extra:after {
position: absolute;
top: 7px;
bottom: 6px;
left: 0;
width: 1px;
background-color: #fff;
background-color: var(--ui-btn-colors-after-bg);
content: '';
opacity: .8;
opacity: var(--ui-btn-opacity-after);
}
.ui-btn-extra:before {
position: absolute;
top: 50%;
left: 50%;
box-sizing: border-box;
margin-top: -2px;
margin-left: -4px;
width: 8px;
border: 4px solid transparent;
border-top-color: #fff;
border-top-color: var(--ui-btn-colors-before-bg);
background: none;
content: '';
transition: 160ms background-color linear, 160ms color linear, 160ms opacity linear, 160ms border-color linear;
}
.ui-btn + .ui-btn,
.ui-btn + .ui-btn-double,
.ui-btn-double + .ui-btn,
.ui-btn-double + .ui-btn-double,
.ui-ctl + .ui-btn,
.ui-ctl + .ui-btn-double { margin-left: 12px; }
/*endregion*/
/*region Size*/
.ui-btn-md {
--ui-btn-size-padding: 19px;
--ui-btn-size-min-width: 80px;
--ui-btn-size-height: var(--ui-btn-size-md);
--ui-btn-size-font-size: 12px;
}
.ui-btn-lg {
--ui-btn-size-padding: 26px;
--ui-btn-size-min-width: 90px;
--ui-btn-size-height: var(--ui-btn-size-lg);
--ui-btn-size-font-size: 12px;
}
.ui-btn-sm {
--ui-btn-size-padding: 17px;
--ui-btn-size-min-width: 70px;
--ui-btn-size-height: var(--ui-btn-size-sm);
--ui-btn-size-font-size: 12px;
}
.ui-btn-xs {
--ui-btn-size-padding: 15px;
--ui-btn-size-min-width: 66px;
--ui-btn-size-height: var(--ui-btn-size-xs);
--ui-btn-size-font-size: 11px;
}
.ui-btn-double.ui-btn-lg { padding-right: 33px; }
.ui-btn-lg .ui-btn-main { border-radius: 3px 0 0 3px; }
.ui-btn-lg .ui-btn-extra {
width: 33px;
border-radius: 0 3px 3px 0;
}
.ui-btn-lg .ui-btn-extra:before { margin-top: -3px; }
.ui-btn-lg .ui-btn-extra:after {
top: 11px;
bottom: 10px;
}
/* region Fix for IE*/
.bx-ie .ui-btn.ui-btn-md { min-width: 80px; }
.bx-ie .ui-btn.ui-btn-md,
.bx-ie .ui-btn-md .ui-btn-main { padding: 0 19px; }
.bx-ie .ui-btn.ui-btn-md,
.bx-ie .ui-btn-md .ui-btn-main,
.bx-ie .ui-btn-md .ui-btn-extra {
height: 39px;
font-size: 12px;
line-height: 39px;
}
.bx-ie .ui-btn.ui-btn-lg { min-width: 90px; }
.bx-ie .ui-btn.ui-btn-lg,
.bx-ie .ui-btn-lg .ui-btn-main { padding: 0 26px; }
.bx-ie .ui-btn.ui-btn-lg,
.bx-ie .ui-btn-lg .ui-btn-main,
.bx-ie .ui-btn-lg .ui-btn-extra {
height: 47px;
font-size: 12px;
line-height: 47px;
}
.bx-ie .ui-btn.ui-btn-sm { min-width: 70px; }
.bx-ie .ui-btn.ui-btn-sm,
.bx-ie .ui-btn-sm .ui-btn-main { padding: 0 17px; }
.bx-ie .ui-btn.ui-btn-sm,
.bx-ie .ui-btn-sm .ui-btn-main,
.bx-ie .ui-btn-sm .ui-btn-extra {
height: 31px;
font-size: 12px;
line-height: 31px;
}
.bx-ie .ui-btn.ui-btn-xs { min-width: 66px; }
.bx-ie .ui-btn.ui-btn-xs,
.bx-ie .ui-btn-xs .ui-btn-main { padding: 0 15px; }
.bx-ie .ui-btn.ui-btn-xs,
.bx-ie .ui-btn-xs .ui-btn-main,
.bx-ie .ui-btn-xs .ui-btn-extra {
height: 26px;
font-size: 11px;
line-height: 26px;
}
/*endregion*/
/*endregion*/
/*region Colors*/
/*region Color Variables*/
.ui-btn-default { /* default variables */ }
.ui-btn-success {
--ui-btn-colors-bg: #bbed21;
--ui-btn-colors-bg-hover: #d2f95f;
--ui-btn-colors-bg-active: #b2e232;
--ui-btn-colors-bd: #bbed21;
--ui-btn-colors-bd-hover: #d2f95f;
--ui-btn-colors-bd-active: #b2e232;
--ui-btn-opacity-after: .2;
--ui-btn-colors-after-bg: #535c69;
--ui-btn-colors-before-bg: #535c69;
--ui-btn-colors-clr: #535c69;
--ui-btn-colors-clr-hover: #535c69;
--ui-btn-colors-clr-active: #535c69;
}
.ui-btn-success-light {
--ui-btn-colors-bg: #e1f0b1;
--ui-btn-colors-bg-hover: #eaf5c5;
--ui-btn-colors-bg-active: #d3e59a;
--ui-btn-colors-bd: #e1f0b1;
--ui-btn-colors-bd-hover: #eaf5c5;
--ui-btn-colors-bd-active: #d3e59a;
--ui-btn-opacity-after: .2;
--ui-btn-colors-after-bg: #333;
--ui-btn-colors-before-bg: #a3bf63;
--ui-btn-colors-clr: #668d13;
--ui-btn-colors-clr-hover: #668d13;
--ui-btn-colors-clr-active: #668d13;
}
.ui-btn-danger {
--ui-btn-colors-bg: #f1361a;
--ui-btn-colors-bg-hover: #cc1c00;
--ui-btn-colors-bg-active: #d24430;
--ui-btn-colors-bd: #f1361a;
--ui-btn-colors-bd-hover: #cc1c00;
--ui-btn-colors-bd-active: #d24430;
--ui-btn-colors-clr: #fff;
--ui-btn-colors-clr-hover: #fff;
--ui-btn-colors-clr-active: #fff;
}
.ui-btn-danger-dark {
--ui-btn-colors-bg: #a21529;
--ui-btn-colors-bg-hover: #c53e51;
--ui-btn-colors-bg-active: #c53e51;
--ui-btn-colors-bd: #a21529;
--ui-btn-colors-bd-hover: #c53e51;
--ui-btn-colors-bd-active: #c53e51;
--ui-btn-colors-clr: #fff;
--ui-btn-colors-clr-hover: #fff;
--ui-btn-colors-clr-active: #fff;
}
.ui-btn-danger-light {
--ui-btn-colors-bg: #ffccca;
--ui-btn-colors-bg-hover: #ffdcdb;
--ui-btn-colors-bg-active: #f2b6b3;
--ui-btn-colors-bd: #ffccca;
--ui-btn-colors-bd-hover: #ffdcdb;
--ui-btn-colors-bd-active: #f2b6b3;
--ui-btn-opacity-after: .2;
--ui-btn-colors-after-bg: #333;
--ui-btn-colors-before-bg: #eb8783;
--ui-btn-colors-clr: #d7413c;
--ui-btn-colors-clr-hover: #d7413c;
--ui-btn-colors-clr-active: #d7413c;
}
.ui-btn-primary {
--ui-btn-colors-bg: #3bc8f5;
--ui-btn-colors-bg-hover: #3eddff;
--ui-btn-colors-bg-active: #12b1e3;
--ui-btn-colors-bd: #3bc8f5;
--ui-btn-colors-bd-hover: #3eddff;
--ui-btn-colors-bd-active: #12b1e3;
--ui-btn-colors-clr: #fff;
--ui-btn-colors-clr-hover: #fff;
--ui-btn-colors-clr-active: #fff;
}
.ui-btn-primary-dark {
--ui-btn-colors-bg: #3a9fc2;
--ui-btn-colors-bg-hover: #38aed5;
--ui-btn-colors-bg-active: #38aed5;
--ui-btn-colors-bd: #3a9fc2;
--ui-btn-colors-bd-hover: #38aed5;
--ui-btn-colors-bd-active: #38aed5;
--ui-btn-colors-clr: #fff;
--ui-btn-colors-clr-hover: #fff;
--ui-btn-colors-clr-active: #fff;
}
.ui-btn-secondary {
--ui-btn-colors-bg: #c5e7f4;
--ui-btn-colors-bg-hover: #d1eef9;
--ui-btn-colors-bg-active: #aee0f2;
--ui-btn-colors-bd: #aee0f2;
--ui-btn-colors-bd-hover: #aee0f2;
--ui-btn-colors-bd-active: #aee0f2;
--ui-btn-colors-after-bg: #535c69;
--ui-btn-colors-before-bg: #535c69;
--ui-btn-colors-clr: #535c69;
--ui-btn-colors-clr-hover: #535c69;
--ui-btn-colors-clr-active: #535c69;
}
.ui-btn-link {
--ui-btn-colors-bg: transparent;
--ui-btn-colors-bg-hover: transparent;
--ui-btn-colors-bg-active: transparent;
--ui-btn-colors-bd: transparent;
--ui-btn-colors-bd-hover: transparent;
--ui-btn-colors-bd-active: transparent;
--ui-btn-opacity-after: .5;
--ui-btn-colors-after-bg: #535c69;
--ui-btn-colors-before-bg: #535c69;
--ui-btn-colors-clr: #000;
--ui-btn-colors-clr-hover: #000;
--ui-btn-colors-clr-active: #000;
}
.ui-btn-light {
--ui-btn-colors-bg: transparent;
--ui-btn-colors-bg-hover: #f6f8f9;
--ui-btn-colors-bg-active: #d6f1fb;
--ui-btn-colors-bd: transparent;
--ui-btn-colors-bd-hover: #f6f8f9;
--ui-btn-colors-bd-active: #d6f1fb;
--ui-btn-opacity-after: .5;
--ui-btn-colors-after-bg: #535c69;
--ui-btn-colors-before-bg: #535c69;
--ui-btn-colors-clr: #535c69;
--ui-btn-colors-clr-hover: #333;
--ui-btn-colors-clr-active: #000;
}
.ui-btn-light-border {
--ui-btn-colors-bg: transparent;
--ui-btn-colors-bg-hover: #f6f8f9;
--ui-btn-colors-bg-active: #d6f1fb;
--ui-btn-colors-bd: #c4cace;
--ui-btn-colors-bd-hover: #9fa4ab;
--ui-btn-colors-bd-active: #9fa4ab;
--ui-btn-opacity-after: .5;
--ui-btn-colors-after-bg: #535c69;
--ui-btn-colors-before-bg: #535c69;
--ui-btn-colors-clr: #535b69;
--ui-btn-colors-clr-hover: #535b69;
--ui-btn-colors-clr-active: #535b69;
}
/*endregion*/
/*region Button Color*/
/* region Default Fix for IE*/
.bx-ie .ui-btn-default.ui-btn,
.bx-ie .ui-btn-default.ui-btn-double .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-double .ui-btn-extra { background-color: #868d95; }
.bx-ie .ui-btn-default.ui-btn,
.bx-ie a.ui-btn-default.ui-btn:focus,
.bx-ie .ui-btn-default.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-default.ui-btn-double .ui-btn-main:hover,
.bx-ie .ui-btn-default.ui-btn-double .ui-btn-extra:hover,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-extra-hover .ui-btn-extra { background-color: #5b6573; }
.bx-ie .ui-btn-default.ui-btn:active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-default.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-default.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-default.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-default.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-default.ui-btn-double .ui-btn-main:active,
.bx-ie .ui-btn-default.ui-btn-double .ui-btn-extra:active,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-double.ui-btn-extra-active .ui-btn-extra { background-color: #3b506e; }
/*endregion*/
/*region Default button Fix for IE*/
.bx-ie .ui-btn-default.ui-btn,
.bx-ie .ui-btn-default .ui-btn-main,
.bx-ie .ui-btn-default .ui-btn-extra {
border-color: #868d95;
background-color: #868d95;
color: #fff;
}
.bx-ie .ui-btn-default.ui-btn:not(.ui-btn-disabled),
.bx-ie a.ui-btn-default.ui-btn:focus,
.bx-ie .ui-btn-default.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-default .ui-btn-main:hover,
.bx-ie .ui-btn-default .ui-btn-extra:hover,
.bx-ie .ui-btn-default.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-default.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-extra-hover .ui-btn-extra {
border-color: #5b6573;
background-color: #5b6573;
color: #fff;
}
.bx-ie .ui-btn-default.ui-btn:active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-default.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-default.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-default.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-default.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-active,
.bx-ie .ui-btn-default.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-default .ui-btn-main:active,
.bx-ie .ui-btn-default .ui-btn-extra:active,
.bx-ie .ui-btn-default.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-default.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-extra-active .ui-btn-extra {
border-color: #3b506e;
background-color: #3b506e;
color: #fff;
}
.bx-ie .ui-btn-success .ui-btn-extra:after { background-color: #fff; }
.bx-ie .ui-btn-success .ui-btn-extra:before { border-top-color: #fff; }
/*endregion*/
/*region Success button Fix for IE*/
.bx-ie .ui-btn-success.ui-btn,
.bx-ie .ui-btn-success .ui-btn-main,
.bx-ie .ui-btn-success .ui-btn-extra {
border-color: #bbed21;
background-color: #bbed21;
color: #535c69;
}
.bx-ie .ui-btn-success.ui-btn:not(.ui-btn-disabled),
.bx-ie a.ui-btn-success.ui-btn:focus,
.bx-ie .ui-btn-success.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-success .ui-btn-main:hover,
.bx-ie .ui-btn-success .ui-btn-extra:hover,
.bx-ie .ui-btn-success.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-success.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-success.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-success.ui-btn-extra-hover .ui-btn-extra {
border-color: #d2f95f;
background-color: #d2f95f;
color: #535c69;
}
.bx-ie .ui-btn-success.ui-btn:active,
.bx-ie .ui-btn-success.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-success.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-success.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-success.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-success.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-success.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-success.ui-btn.ui-btn-active,
.bx-ie .ui-btn-success.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-success .ui-btn-main:active,
.bx-ie .ui-btn-success .ui-btn-extra:active,
.bx-ie .ui-btn-success.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-success.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-success.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-success.ui-btn-extra-active .ui-btn-extra {
border-color: #b2e232;
background-color: #b2e232;
color: #535c69;
}
.bx-ie .ui-btn-success .ui-btn-extra:after { background-color: #535c69; }
.bx-ie .ui-btn-success .ui-btn-extra:before { border-top-color: #535c69; }
/*endregion*/
/*region Success Light button Fix for IE*/
.bx-ie .ui-btn-success-light.ui-btn,
.bx-ie .ui-btn-success-light .ui-btn-main,
.bx-ie .ui-btn-success-light .ui-btn-extra {
border-color: #e1f0b1;
background-color: #e1f0b1;
color: #668d13;
}
.bx-ie .ui-btn-success-light.ui-btn:hover,
.bx-ie a.ui-btn-success-light.ui-btn:focus,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-success-light .ui-btn-main:hover,
.bx-ie .ui-btn-success-light .ui-btn-extra:hover,
.bx-ie .ui-btn-success-light.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-success-light.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-success-light.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-success-light.ui-btn-extra-hover .ui-btn-extra {
border-color: #eaf5c5;
background-color: #eaf5c5;
color: #668d13;
}
.bx-ie .ui-btn-success-light.ui-btn:active,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-active,
.bx-ie .ui-btn-success-light.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-success-light .ui-btn-main:active,
.bx-ie .ui-btn-success-light .ui-btn-extra:active,
.bx-ie .ui-btn-success-light.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-success-light.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-success-light.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-success-light.ui-btn-extra-active .ui-btn-extra {
border-color: #d3e59a;
background-color: #d3e59a;
color: #668d13;
}
.bx-ie .ui-btn-success-light .ui-btn-extra:after { background-color: #668d13; }
.bx-ie .ui-btn-success-light .ui-btn-extra:before { border-top-color: #668d13; }
/*endregion*/
/*region Danger button Fix for IE*/
.bx-ie .ui-btn-danger.ui-btn,
.bx-ie .ui-btn-danger .ui-btn-main,
.bx-ie .ui-btn-danger .ui-btn-extra {
border-color: #f1361a;
background-color: #f1361a;
color: #fff;
}
.bx-ie .ui-btn-danger.ui-btn:hover,
.bx-ie a.ui-btn-danger.ui-btn:focus,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-danger .ui-btn-main:hover,
.bx-ie .ui-btn-danger .ui-btn-extra:hover,
.bx-ie .ui-btn-danger.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-danger.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-danger.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-danger.ui-btn-extra-hover .ui-btn-extra {
border-color: #cc1c00;
background-color: #cc1c00;
color: #fff;
}
.bx-ie .ui-btn-danger.ui-btn:active,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-active,
.bx-ie .ui-btn-danger.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-danger .ui-btn-main:active,
.bx-ie .ui-btn-danger .ui-btn-extra:active,
.bx-ie .ui-btn-danger.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-danger.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-danger.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-danger.ui-btn-extra-active .ui-btn-extra {
border-color: #d24430;
background-color: #d24430;
color: #fff;
}
.bx-ie .ui-btn-danger .ui-btn-extra:after { background-color: #fff; }
.bx-ie .ui-btn-danger .ui-btn-extra:before { border-top-color: #fff; }
/*endregion*/
/*region Danger Dark button Fix for IE*/
.bx-ie .ui-btn-danger-dark.ui-btn,
.bx-ie .ui-btn-danger-dark .ui-btn-main,
.bx-ie .ui-btn-danger-dark .ui-btn-extra {
border-color: #a21529;
background-color: #a21529;
color: #fff;
}
.bx-ie .ui-btn-danger-dark.ui-btn:hover,
.bx-ie a.ui-btn-danger-dark.ui-btn:focus,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-danger-dark .ui-btn-main:hover,
.bx-ie .ui-btn-danger-dark .ui-btn-extra:hover,
.bx-ie .ui-btn-danger-dark.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-danger-dark.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-danger-dark.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-danger-dark.ui-btn-extra-hover .ui-btn-extra {
border-color: #c53e51;
background-color: #c53e51;
color: #fff;
}
.bx-ie .ui-btn-danger-dark.ui-btn:active,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-active,
.bx-ie .ui-btn-danger-dark.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-danger-dark .ui-btn-main:active,
.bx-ie .ui-btn-danger-dark .ui-btn-extra:active,
.bx-ie .ui-btn-danger-dark.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-danger-dark.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-danger-dark.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-danger-dark.ui-btn-extra-active .ui-btn-extra {
border-color: #c53e51;
background-color: #c53e51;
color: #fff;
}
.bx-ie .ui-btn-danger-dark .ui-btn-extra:after { background-color: #fff; }
.bx-ie .ui-btn-danger-dark .ui-btn-extra:before { border-top-color: #fff; }
/*endregion*/
/*region Danger Light button Fix for IE*/
.bx-ie .ui-btn-danger-light.ui-btn,
.bx-ie .ui-btn-danger-light .ui-btn-main,
.bx-ie .ui-btn-danger-light .ui-btn-extra {
border-color: #ffccca;
background-color: #ffccca;
color: #d7413c;
}
.bx-ie .ui-btn-danger-light.ui-btn:hover,
.bx-ie a.ui-btn-danger-light.ui-btn:focus,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-danger-light .ui-btn-main:hover,
.bx-ie .ui-btn-danger-light .ui-btn-extra:hover,
.bx-ie .ui-btn-danger-light.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-danger-light.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-danger-light.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-danger-light.ui-btn-extra-hover .ui-btn-extra {
border-color: #ffdcdb;
background-color: #ffdcdb;
color: #d7413c;
}
.bx-ie .ui-btn-danger-light.ui-btn:active,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-active,
.bx-ie .ui-btn-danger-light.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-danger-light .ui-btn-main:active,
.bx-ie .ui-btn-danger-light .ui-btn-extra:active,
.bx-ie .ui-btn-danger-light.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-danger-light.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-danger-light.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-danger-light.ui-btn-extra-active .ui-btn-extra {
border-color: #f2b6b3;
background-color: #f2b6b3;
color: #d7413c;
}
.bx-ie .ui-btn-danger-light .ui-btn-extra:after { background-color: #d7413c; }
.bx-ie .ui-btn-danger-light .ui-btn-extra:before { border-top-color: #d7413c; }
/*endregion*/
/*region Primary button Fix for IE*/
.bx-ie .ui-btn-primary.ui-btn,
.bx-ie .ui-btn-primary .ui-btn-main,
.bx-ie .ui-btn-primary .ui-btn-extra {
border-color: #3bc8f5;
background-color: #3bc8f5;
color: #fff;
}
.bx-ie .ui-btn-primary.ui-btn:hover,
.bx-ie a.ui-btn-primary.ui-btn:focus,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-primary .ui-btn-main:hover,
.bx-ie .ui-btn-primary .ui-btn-extra:hover,
.bx-ie .ui-btn-primary.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-primary.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-primary.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-primary.ui-btn-extra-hover .ui-btn-extra {
border-color: #3eddff;
background-color: #3eddff;
color: #fff;
}
.bx-ie .ui-btn-primary.ui-btn:active,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-active,
.bx-ie .ui-btn-primary.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-primary .ui-btn-main:active,
.bx-ie .ui-btn-primary .ui-btn-extra:active,
.bx-ie .ui-btn-primary.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-primary.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-primary.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-primary.ui-btn-extra-active .ui-btn-extra {
border-color: #12b1e3;
background-color: #12b1e3;
color: #fff;
}
.bx-ie .ui-btn-primary .ui-btn-extra:after { background-color: #fff; }
.bx-ie .ui-btn-primary .ui-btn-extra:before { border-top-color: #fff; }
/*endregion*/
/*region Primary Dark button Fix for IE*/
.bx-ie .ui-btn-primary-dark.ui-btn,
.bx-ie .ui-btn-primary-dark .ui-btn-main,
.bx-ie .ui-btn-primary-dark .ui-btn-extra {
border-color: #3a9fc2;
background-color: #3a9fc2;
color: #fff;
}
.bx-ie .ui-btn-primary-dark.ui-btn:hover,
.bx-ie a.ui-btn-primary-dark.ui-btn:focus,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-primary-dark .ui-btn-main:hover,
.bx-ie .ui-btn-primary-dark .ui-btn-extra:hover,
.bx-ie .ui-btn-primary-dark.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-primary-dark.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-primary-dark.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-primary-dark.ui-btn-extra-hover .ui-btn-extra {
border-color: #38aed5;
background-color: #38aed5;
color: #fff;
}
.bx-ie .ui-btn-primary-dark.ui-btn:active,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-active,
.bx-ie .ui-btn-primary-dark.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-primary-dark .ui-btn-main:active,
.bx-ie .ui-btn-primary-dark .ui-btn-extra:active,
.bx-ie .ui-btn-primary-dark.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-primary-dark.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-primary-dark.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-primary-dark.ui-btn-extra-active .ui-btn-extra {
border-color: #38aed5;
background-color: #38aed5;
color: #fff;
}
.bx-ie .ui-btn-primary-dark .ui-btn-extra:after { background-color: #fff; }
.bx-ie .ui-btn-primary-dark .ui-btn-extra:before { border-top-color: #fff; }
/*endregion*/
/*region Secondary button Fix for IE*/
.bx-ie .ui-btn-secondary.ui-btn,
.bx-ie .ui-btn-secondary .ui-btn-main,
.bx-ie .ui-btn-secondary .ui-btn-extra {
border-color: #c5e7f4;
background-color: #c5e7f4;
color: #535c69;
}
.bx-ie .ui-btn-secondary.ui-btn:hover,
.bx-ie a.ui-btn-secondary.ui-btn:focus,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-secondary .ui-btn-main:hover,
.bx-ie .ui-btn-secondary .ui-btn-extra:hover,
.bx-ie .ui-btn-secondary.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-secondary.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-secondary.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-secondary.ui-btn-extra-hover .ui-btn-extra {
border-color: #d1eef9;
background-color: #d1eef9;
color: #535c69;
}
.bx-ie .ui-btn-secondary.ui-btn:active,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-active,
.bx-ie .ui-btn-secondary.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-secondary .ui-btn-main:active,
.bx-ie .ui-btn-secondary .ui-btn-extra:active,
.bx-ie .ui-btn-secondary.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-secondary.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-secondary.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-secondary.ui-btn-extra-active .ui-btn-extra {
border-color: #aee0f2;
background-color: #aee0f2;
color: #535c69;
}
.bx-ie .ui-btn-secondary .ui-btn-extra:after { background-color: #535c69; }
.bx-ie .ui-btn-secondary .ui-btn-extra:before { border-top-color: #535c69; }
/*endregion*/
/*region Link button*/
.ui-btn-link.ui-btn {
padding-right: 0;
padding-left: 0;
}
.ui-btn-link .ui-btn-main { padding-left: 0; }
/*region Link button Fix for IE*/
.bx-ie .ui-btn-link.ui-btn,
.bx-ie .ui-btn-link .ui-btn-main,
.bx-ie .ui-btn-link .ui-btn-extra {
border-color: transparent;
background-color: transparent;
color: #000;
}
.bx-ie .ui-btn-link.ui-btn:hover,
.bx-ie a.ui-btn-link.ui-btn:focus,
.bx-ie .ui-btn-link.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-link .ui-btn-main:hover,
.bx-ie .ui-btn-link .ui-btn-extra:hover,
.bx-ie .ui-btn-link.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-link.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-link.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-link.ui-btn-extra-hover .ui-btn-extra {
border-color: transparent;
background-color: transparent;
color: #000;
}
.bx-ie .ui-btn-link.ui-btn:active,
.bx-ie .ui-btn-link.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-link.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-link.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-link.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-link.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-link.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-link.ui-btn.ui-btn-active,
.bx-ie .ui-btn-link.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-link .ui-btn-main:active,
.bx-ie .ui-btn-link .ui-btn-extra:active,
.bx-ie .ui-btn-link.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-link.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-link.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-link.ui-btn-extra-active .ui-btn-extra {
border-color: transparent;
background-color: transparent;
color: #000;
}
.bx-ie .ui-btn-link .ui-btn-extra:after { background-color: #535c69; }
.bx-ie .ui-btn-link .ui-btn-extra:before { border-top-color: #535c69; }
/*endregion*/
/*endregion*/
/*region Light button Fix for IE*/
.bx-ie .ui-btn-light.ui-btn,
.bx-ie .ui-btn-light .ui-btn-main,
.bx-ie .ui-btn-light .ui-btn-extra {
border-color: transparent;
background-color: transparent;
color: #535c69;
}
.bx-ie .ui-btn-light.ui-btn:hover,
.bx-ie a.ui-btn-light.ui-btn:focus,
.bx-ie .ui-btn-light.ui-btn.ui-btn-hover,
.bx-ie .ui-btn-light .ui-btn-main:hover,
.bx-ie .ui-btn-light .ui-btn-extra:hover,
.bx-ie .ui-btn-light.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-light.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-light.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-light.ui-btn-extra-hover .ui-btn-extra {
border-color: #f6f8f9;
background-color: #f6f8f9;
color: #333;
}
.bx-ie .ui-btn-light.ui-btn:active,
.bx-ie .ui-btn-light.ui-btn.ui-btn-wait,
.bx-ie .ui-btn-light.ui-btn.ui-btn-wait:hover,
.bx-ie .ui-btn-light.ui-btn.ui-btn-wait:active,
.bx-ie .ui-btn-light.ui-btn.ui-btn-clock,
.bx-ie .ui-btn-light.ui-btn.ui-btn-clock:hover,
.bx-ie .ui-btn-light.ui-btn.ui-btn-clock:active,
.bx-ie .ui-btn-light.ui-btn.ui-btn-active,
.bx-ie .ui-btn-light.ui-btn.ui-btn-active:hover,
.bx-ie .ui-btn-light .ui-btn-main:active,
.bx-ie .ui-btn-light .ui-btn-extra:active,
.bx-ie .ui-btn-light.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-light.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-light.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-light.ui-btn-extra-active .ui-btn-extra {
border-color: #d6f1fb;
background-color: #d6f1fb;
color: #000;
}
.bx-ie .ui-btn-light .ui-btn-extra:after { background-color: #535c69; }
.bx-ie .ui-btn-light .ui-btn-extra:before { border-top-color: #535c69; }
/*endregion*/
/*region Light-border button*/
/*region Fix for Themes*/
.bitrix24-light-theme .ui-btn-themes.ui-btn-light,
.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border {
background-color: rgba(255, 255, 255, .15);
color: #fff;
}
.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border { border-color: rgba(255, 255, 255, .4); }
.bitrix24-light-theme .ui-btn-themes.ui-btn-light:hover,
.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border:hover { background-color: rgba(255, 255, 255, .3); }
.bitrix24-light-theme .ui-btn-themes.ui-btn-light:active,
.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border:active { background-color: rgba(255, 255, 255, .4); }
.bitrix24-light-theme .ui-btn-themes.ui-btn-light.ui-btn-dropdown:before,
.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border.ui-btn-dropdown:before { border-color: #fff; }
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light,
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border {
background-color: rgba(0, 0, 0, .07);
color: rgba(51, 51, 51, .8);
}
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border { border-color: rgba(0, 0, 0, .06); }
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light:hover,
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border:hover { background-color: rgba(0, 0, 0, .1); }
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light:active,
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border:active { background-color: rgba(0, 0, 0, .15); }
.bitrix24-dark-theme .ui-btn-themes.ui-btn-link.ui-btn-dropdown:before,
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light.ui-btn-dropdown:before,
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border.ui-btn-dropdown:before { border-color: rgba(51, 51, 51, .8); }
/*endregion*/
/* region Fix for IE*/
.bx-ie .ui-btn-light-border.ui-btn,
.bx-ie .ui-btn-light-border .ui-btn-main,
.bx-ie .ui-btn-light-border .ui-btn-extra {
border-color: #c4cace;
background-color: transparent;
color: #535b69;
}
.bx-ie .ui-btn-light-border.ui-btn:hover,
.bx-ie a.ui-btn-light-border.ui-btn:focus,
.bx-ie .ui-btn-light-border.ui-btn-hover,
.bx-ie .ui-btn-light-border .ui-btn-main:hover,
.bx-ie .ui-btn-light-border .ui-btn-extra:hover,
.bx-ie .ui-btn-light-border.ui-btn-hover .ui-btn-main,
.bx-ie .ui-btn-light-border.ui-btn-hover .ui-btn-extra,
.bx-ie .ui-btn-light-border.ui-btn-main-hover .ui-btn-main,
.bx-ie .ui-btn-light-border.ui-btn-extra-hover .ui-btn-extra {
border-color: #9fa4ab;
background-color: #f6f8f9;
color: #535b69;
}
.bx-ie .ui-btn-light-border.ui-btn:active,
.bx-ie .ui-btn-light-border.ui-btn-wait,
.bx-ie .ui-btn-light-border.ui-btn-wait:hover,
.bx-ie .ui-btn-light-border.ui-btn-wait:active,
.bx-ie .ui-btn-light-border.ui-btn-clock,
.bx-ie .ui-btn-light-border.ui-btn-clock:hover,
.bx-ie .ui-btn-light-border.ui-btn-clock:active,
.bx-ie .ui-btn-light-border.ui-btn-active,
.bx-ie .ui-btn-light-border.ui-btn-active:hover,
.bx-ie .ui-btn-light-border .ui-btn-main:active,
.bx-ie .ui-btn-light-border .ui-btn-extra:active,
.bx-ie .ui-btn-light-border.ui-btn-active .ui-btn-main,
.bx-ie .ui-btn-light-border.ui-btn-active .ui-btn-extra,
.bx-ie .ui-btn-light-border.ui-btn-main-active .ui-btn-main,
.bx-ie .ui-btn-light-border.ui-btn-extra-active .ui-btn-extra {
border-color: #9fa4ab;
background-color: #d6f1fb;
color: #535b69;
}
.bx-ie .ui-btn-light-border .ui-btn-extra:after { background-color: #535c69; }
.bx-ie .ui-btn-light-border .ui-btn-extra:before { border-top-color: #535c69; }
/*endregion*/
/*endregion*/
/*endregion*/
/*endregion*/
/*region Others*/
.ui-btn-round { border-radius: calc(var(--ui-btn-size-height) / 2); }
/*region Border radius Fix for IE*/
.bx-ie .ui-btn-round,
.bx-ie .ui-btn-round.ui-btn-md { border-radius: 19.5px; }
.bx-ie .ui-btn-round.ui-btn-lg { border-radius: 23.5px; }
.bx-ie .ui-btn-round.ui-btn-sm { border-radius: 16.5px; }
.bx-ie .ui-btn-round.ui-btn-xs { border-radius: 13px; }
/*endregion*/
.ui-btn-no-caps,
.ui-btn-no-caps .ui-btn-main {
text-transform: none;
font-weight: 400;
}
/*region Counter*/
.ui-btn-counter {
display: inline-block;
margin-top: -2px;
padding: 0 8px;
border-radius: 10px;
background-color: #f34829;
color: #fff;
vertical-align: middle;
font: 11px/19px "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
}
.ui-btn-xs .ui-btn-counter { margin-top: -4px; }
/*endregion*/
/*region Dropdown*/
.ui-btn.ui-btn-dropdown,
.ui-btn-dropdown .ui-btn-main { padding-right: 29px; }
.ui-btn.ui-btn-dropdown:before,
.ui-btn-dropdown .ui-btn-main:before {
position: absolute;
top: 50%;
right: 13px;
display: block;
box-sizing: border-box;
margin-top: -2.5px;
width: 8px;
height: 8px;
border-bottom: 2px solid;
border-left: 2px solid;
content: '';
transform: translateY(-50%) rotate(-45deg);
}
.ui-btn.ui-btn-dropdown:before,
.ui-btn-dropdown .ui-btn-main:before { border-color: var(--ui-btn-colors-clr); }
/*region Fix for IE */
.bx-ie .ui-btn.ui-btn-link.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-secondary.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-light.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-success.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-light-border.ui-btn-dropdown:before,
.bx-ie .ui-btn-link.ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-secondary.ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-light.ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-success.ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-light-border.ui-btn-dropdown .ui-btn-main:before { border-color: #535c69; }
.bx-ie .ui-btn.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-danger.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-primary.ui-btn-dropdown:before,
.bx-ie .ui-btn.ui-btn-default.ui-btn-dropdown:before,
.bx-ie .ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-danger.ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-primary.ui-btn-dropdown .ui-btn-main:before,
.bx-ie .ui-btn-default.ui-btn-dropdown .ui-btn-main:before { border-color: #fff; }
/*endregion*/
/*endregion*/
/*region Disabled*/
.ui-btn.ui-btn-disabled,
.ui-btn.ui-btn-disabled:hover,
.ui-btn.ui-btn-disabled:active,
.ui-btn-disabled .ui-btn-main,
.ui-btn-disabled .ui-btn-main:hover,
.ui-btn-disabled .ui-btn-main:active,
.ui-btn-disabled .ui-btn-extra,
.ui-btn-disabled .ui-btn-extra:hover,
.ui-btn-disabled .ui-btn-extra:active,
.ui-btn-main-disabled .ui-btn-main,
.ui-btn-main-disabled .ui-btn-main:hover,
.ui-btn-main-disabled .ui-btn-main:active,
.ui-btn-extra-disabled .ui-btn-extra,
.ui-btn-extra-disabled .ui-btn-extra:hover,
.ui-btn-extra-disabled .ui-btn-extra:active {
border-color: #3b506e;
border-color: var(--ui-btn-colors-bd) !important;
background-color: #3b506e;
background-color: var(--ui-btn-colors-bg) !important;
color: #fff;
color: var(--ui-btn-colors-clr) !important;
opacity: .4;
cursor: not-allowed;
}
/*endregion*/
/*region Wait*/
.ui-btn.ui-btn-wait,
.ui-btn-wait .ui-btn-main {
background-position: center;
background-repeat: no-repeat;
color: transparent !important;
}
.ui-btn.ui-btn-wait:after,
.ui-btn-wait .ui-btn-main:after { opacity: 0; }
.ui-btn-wait,
.ui-btn-wait.ui-btn-danger,
.ui-btn-wait.ui-btn-primary,
.ui-btn-wait.ui-btn-default { --ui-btn-wait-loader: url(images/ui-loader-wait-white.min.svg); }
.ui-btn-wait.ui-btn-link,
.ui-btn-wait.ui-btn-secondary,
.ui-btn-wait.ui-btn-light,
.ui-btn-wait.ui-btn-success,
.ui-btn-wait.ui-btn-light-border,
.ui-btn-wait.ui-btn-link { --ui-btn-wait-loader: url(images/ui-loader-wait-black.min.svg); }
.ui-btn.ui-btn-wait,
.ui-btn-wait .ui-btn-main {
background-image: url(images/ui-loader-wait-white.min.svg);
background-image: var(--ui-btn-wait-loader);
}
/*region Fix for IE*/
.bx-ie .ui-btn.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-danger.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-primary.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-default.ui-btn-wait,
.bx-ie .ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-danger.ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-primary.ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-wait .ui-btn-main { background-image: url(images/ui-loader-wait-white.min.svg); }
.bx-ie .ui-btn.ui-btn-link.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-secondary.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-light.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-success.ui-btn-wait,
.bx-ie .ui-btn.ui-btn-light-border.ui-btn-wait,
.bx-ie .ui-btn-link.ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-secondary.ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-light.ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-success.ui-btn-wait .ui-btn-main,
.bx-ie .ui-btn-light-border.ui-btn-wait .ui-btn-main { background-image: url(images/ui-loader-wait-black.min.svg); }
/*endregion*/
/*endregion*/
/*region Clock*/
.ui-btn.ui-btn-clock,
.ui-btn-double.ui-btn-clock .ui-btn-main {
background-position: center;
background-repeat: no-repeat;
color: transparent !important;
}
.ui-btn.ui-btn-clock:after,
.ui-btn-double.ui-btn-clock .ui-btn-main:after { opacity: 0; }
.ui-btn-clock,
.ui-btn-clock.ui-btn-danger,
.ui-btn-clock.ui-btn-primary,
.ui-btn-clock.ui-btn-default { --ui-btn-clock-loader: url(images/ui-loader-clock-white.min.svg); }
.ui-btn-clock.ui-btn-link,
.ui-btn-clock.ui-btn-secondary,
.ui-btn-clock.ui-btn-light,
.ui-btn-clock.ui-btn-success,
.ui-btn-clock.ui-btn-light-border,
.ui-btn-clock.ui-btn-link { --ui-btn-clock-loader: url(images/ui-loader-clock-black.min.svg); }
.ui-btn.ui-btn-clock,
.ui-btn-clock .ui-btn-main {
background-image: url(images/ui-loader-clock-white.min.svg);
background-image: var(--ui-btn-clock-loader);
}
/*region Fix for IE*/
.bx-ie .ui-btn.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-danger.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-primary.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-default.ui-btn-clock,
.bx-ie .ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-danger.ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-primary.ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-default.ui-btn-clock .ui-btn-main { background-image: url(images/ui-loader-clock-white.min.svg); }
.bx-ie .ui-btn.ui-btn-link.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-secondary.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-light.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-success.ui-btn-clock,
.bx-ie .ui-btn.ui-btn-light-border.ui-btn-clock,
.bx-ie .ui-btn-link.ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-secondary.ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-light.ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-success.ui-btn-clock .ui-btn-main,
.bx-ie .ui-btn-light-border.ui-btn-clock .ui-btn-main { background-image: url(images/ui-loader-clock-black.min.svg); }
/*endregion*/
/*endregion*/
/*endregion*/