новая версия работает исправно, большое вам спасибо.
.sliders .title {
background:linear-gradient(top,#f7f7f7,#e9e7e7);
background:-webkit-linear-gradient(top,#f7f7f7,#e9e7e7);
background:-o-linear-gradient(top,#f7f7f7,#e9e7e7);
background:-moz-linear-gradient(top,#f7f7f7,#e9e7e7);
background:-ms-linear-gradient(top,#f7f7f7,#e9e7e7);
padding: 7px 15px;margin: 0;border: solid 1px #c4c4c4;border-bottom: none;cursor: pointer;
font-family: Verdana, sans-serif; font-size: 12px; text-shadow: 0 1px 0 rgba(255,255,255,.5);
}
.sliders .title:hover {
background:linear-gradient(top,#f7f7f7,#e3e2e2);
background:-webkit-linear-gradient(top,#f7f7f7,#e3e2e2);
background:-o-linear-gradient(top,#f7f7f7,#e3e2e2);
background:-moz-linear-gradient(top,#f7f7f7,#e3e2e2);
background:-ms-linear-gradient(top,#f7f7f7,#e3e2e2);
}
.sliders .title.active {
background:linear-gradient(top,#e9e7e7 0%, #e9e7e7 70%, #f7f7f7 100%);
background:-webkit-linear-gradient(top,#e9e7e7 0%, #e9e7e7 70%, #f7f7f7 100%);
background:-o-linear-gradient(top,#e9e7e7 0%, #e9e7e7 70%, #f7f7f7 100%);
background:-moz-linear-gradient(top,#e9e7e7 0%, #e9e7e7 70%, #f7f7f7 100%);
background:-ms-linear-gradient(top,#e9e7e7 0%, #e9e7e7 70%, #f7f7f7 100%);
}
.sliders .title.active:hover {
background:linear-gradient(top,#e3e2e2 0%, #e3e2e2 70%, #f7f7f7 100%);
background:-webkit-linear-gradient(top,#e3e2e2 0%, #e3e2e2 70%, #f7f7f7 100%);
background:-o-linear-gradient(top,#e3e2e2 0%, #e3e2e2 70%, #f7f7f7 100%);
background:-moz-linear-gradient(top,#e3e2e2 0%, #e3e2e2 70%, #f7f7f7 100%);
background:-ms-linear-gradient(top,#e3e2e2 0%, #e3e2e2 70%, #f7f7f7 100%);
}
куда при этом воткнуть url(../images/arrow-square.gif) no-repeat right -51px - непредставляю себе возможным. вопрос, в общем-то не критичен, можно обойтись и без картинки, но если есть возможность совместить, подскажите решение, пожалуйста.