Newer
Older
a.departments { background:url(../images/icons/list_departments.gif) }
a.newDepartment { background:url(../images/icons/new_department.gif) }
a.pages { background:url(../images/icons/pages.gif) }
a.newPage { background:url(../images/icons/new_page.gif) }
a.forms { background:url(../images/icons/icon-form.png); background-size: 16px 16px; }
a.lists { background:url(../images/icons/icon-list.png); background-size: 16px 16px; }
/* Generic CSS based Icons. use=> <tag class="Icon iconname">text</tag> */
.Icon {
width: auto;
padding-left:20px;
background-position: left center;
background-repeat: no-repeat;
min-height: 16px;
display: inline-block;
}
a.Icon { background-repeat: no-repeat;}
a.Icon:hover {
text-decoration: underline;
}
.Icon.newstaff { background:url(../images/icons/new_user.gif) 0 0 no-repeat; }
.Icon.newteam { background:url(../images/icons/new_team.gif) 0 0 no-repeat; }
.Icon.Ticket { background:url(../images/icons/ticket.gif) 0 2px no-repeat; }
.Icon.webTicket { background:url(../images/icons/ticket_source_web.gif) 0 0 no-repeat; }
.Icon.emailTicket { background:url(../images/icons/ticket_source_email.gif) 0 0 no-repeat; }
.Icon.phoneTicket { background:url(../images/icons/ticket_source_phone.gif) 0 0 no-repeat; }
.Icon.apiTicket { background:url(../images/icons/ticket_source_other.gif) 0 0 no-repeat; }
.Icon.otherTicket { background:url(../images/icons/ticket_source_other.gif) 0 0 no-repeat; }
.Icon.overdueTicket { background:url(../images/icons/overdue_ticket.gif) 0 0 no-repeat; }
.Icon.assignedTicket { background:url(../images/icons/assigned_ticket.gif) 0 0 no-repeat; }
.Icon.lockedTicket { background:url(../images/icons/locked_ticket.gif) 0 0 no-repeat; }
.Icon.editTicket { background-image: url(../images/icons/edit_ticket.png); }
.Icon.staffAssigned { background-image: url(../images/icons/user.gif); }
.Icon.teamAssigned { background-image: url(../images/icons/teams.png); }
1048
1049
1050
1051
1052
1053
1054
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066
1067
1068
1069
1070
1071
.Icon.newCategory { background-image: url(../images/icons/new_category.png); }
.Icon.editCategory { background-image: url(../images/icons/edit_category.png); }
.Icon.deleteCategory { background-image: url(../images/icons/delete_category.png); }
.Icon.newFAQ { background-image: url(../images/icons/new_faq.png); }
.Icon.newReply { background-image: url(../images/icons/new_reply.png); }
.Icon.file { background-image: url(../images/icons/file.gif); }
.Icon.refresh { background-image: url(../images/icons/refresh.gif); }
.Icon.note {
font-weight: bold;
font-size: 1em;
background-image: url(../images/icons/note.gif);
}
.Icon.thread {
font-weight: bold;
font-size: 1em;
background-image: url(../images/icons/thread.gif);
}
.Icon.debugLog { background:url(../images/icons/log_debug.gif) 0 2px no-repeat; }
.Icon.alertLog { background:url(../images/icons/log_alert.gif) 0 2px no-repeat; }
.Icon.errorLog { background:url(../images/icons/log_error.gif) 0 2px no-repeat; }
.Icon.form-add { background:url(../images/icons/icon-form-add.png) 0 0 no-repeat; background-size: 16px 16px; }
.Icon.list-add { background:url(../images/icons/icon-list-add.png) 0 0 no-repeat; background-size: 16px 16px; }
#content {
clear:both;
border:1px solid #aaa;
border-top:none;
border-bottom:3px solid #bbb;
padding:10px 10px 20px 10px;
background:#fff;
}
color:#184E81;
}
#footer {
clear:both;
padding:10px;
text-align:center;
1098
1099
1100
1101
1102
1103
1104
1105
1106
1107
1108
1109
1110
1111
1112
1113
1114
1115
1116
1117
1118
1119
1120
}
table.dashboard-stats tbody:first-child th {
border-bottom:1px dashed #ddd;
padding:0 4px 8px;
}
table.dashboard-stats tbody:nth-child(2) tr:nth-child(odd) {
background-color:#f0faff;
}
table.dashboard-stats tbody:nth-child(2) th {
padding:5px 8px;
border-right: 1px solid #ccc;
color:#999;
}
table.dashboard-stats tbody:nth-child(2) td {
padding:5px 4px;
border-right: 1px solid #ccc;
}
table.dashboard-stats tbody:nth-child(2) tr:hover {
background-color:#FFFFDD;
}
table.dashboard-stats tbody:nth-child(2) tr:hover th {
color:#000;
1121
1122
1123
1124
1125
1126
1127
1128
1129
1130
1131
1132
1133
1134
1135
1136
1137
1138
1139
1140
1141
1142
1143
1144
}
table { vertical-align:top; }
table.list {
clear:both;
background:#ccc;
margin: 2px 0;
border-bottom: 1px solid #ccc;
}
table.list caption {
text-align:left;
padding:5px;
background:#929292;
color:#fff;
font-weight:bold;
}
table.list thead th {
background-color:#eee;
color:#000;
text-align:left;
vertical-align:top;
}
table.list th a {
text-decoration:none;
color:#000;
table.list thead th a { padding-right: 15px; display: block; white-space: nowrap; color: #000; background: url('../images/asc_desc.gif') 100% 50% no-repeat; }
table.list thead th a.asc { background: url('../images/asc.gif') 100% 50% no-repeat #cfe6ff; }
table.list thead th a.desc { background: url('../images/desc.gif') 100% 50% no-repeat #cfe6ff; }
table.list tbody td {
background:#fff;
border:1px solid #fff;
padding:1px;
vertical-align:top;
}
table.list tbody td { background: #fff; padding: 4px 3px; vertical-align: top; }
table.list tbody tr:nth-child(2n+1) td { background-color: #f0faff; }
table.list tbody tr:nth-child(2n+1):hover td { background: #ffd; }
/* row highlighting on hover + select */
table.list tbody tr:hover td, table.list tbody tr.highlight td { background: #FFFFDD; }
/* disabled highlighting on nohover */
table.list tbody tr:hover td.nohover, table.list tbody tr.highlight td.nohover {}
padding: 1px;
}
table.list tfoot td {
1182
1183
1184
1185
1186
1187
1188
1189
1190
1191
1192
1193
1194
1195
1196
1197
1198
1199
1200
1201
1202
1203
1204
1205
1206
1207
1208
1209
1210
1211
1212
1213
1214
1215
1216
1217
1218
1219
1220
1221
padding: 2px;
}
a.refresh {
display:block;
float:right;
width:auto;
height:16px;
line-height:16px;
padding:2px 5px 2px 2px;
background-position:2px 50%;
background-repeat:no-repeat;
padding-left:24px;
margin-left:10px;
margin-bottom: 2px;
border:1px solid #aaa;
background-image:url(../images/icons/refresh.gif);
}
a.edit, a.print {
display:block;
float:right;
width:auto;
height:16px;
line-height:16px;
padding:2px 5px 2px 2px;
background-position:2px 50%;
background-repeat:no-repeat;
padding-left:24px;
margin-left:10px;
border:1px solid #aaa;
background-image:url(../images/icons/edit_ticket.png);
}
a.print {
background-image:url(../images/icons/printer.gif);
}
.btn_sm {
padding:2px 5px;
background:url(../images/btn_sm_bg.png) top left repeat-x #f90;
border:1px solid #777;
color:#fff;
font-weight:bold;
}
.search label {
display:block;
line-height:25px;
height:25px;
}
.search input[type=text] {
height:23px;
line-height:23px;
border:1px solid #aaa;
background:#fff;
padding:2px;
}
.table {
width: 100%;
border-collapse: collapse;
margin-top:3px;
}
.table tr.header td,
.table tr.header th,
.table > thead th {
font-weight: 400;
min-height: 24px;
}
.table tbody:not(:first-child) th {
padding-top: 1.4em;
border-bottom:1px dotted #ddd;
}
.table tr.header {
border-bottom: 1px dotted #777;
}
.table td:not(:empty) {
padding: 4px;
background-color:#fff;
}
.table.two-column tbody tr td:first-child {
width: 25%;
}
.table > tbody > tr.header + tr td {
padding-top: 10px;
}
.table td .pull-right {
margin-right: 15px;
}
.form_table {
margin-top:3px;
border-left:1px solid #ddd;
border-right:1px solid #ddd;
}
}
.form_table td:not(:empty) {
table-layout: fixed;
width: 100%;
}
table.fixed > thead > tr > th:not([width]),
table.fixed > thead > tr > td:not([width]),
table.fixed > tbody > tr > td:not([width]),
table.fixed > tr > td:not([width]) {
table.fixed > thead > tr > th + th:not([width]),
table.fixed > thead > tr > td + td:not([width]),
table.fixed > tbody > tr > td + td:not([width]),
table.fixed > tr > td + td:not([width]) {
tr.no_border > td, td.no_border{
border-style:hidden;
}
padding-top: 0.4em;
padding-bottom: 0.4em;
input[type=text], input[type=password], textarea, input {
padding: 3px 5px;
font-size: 0.95em;
font-family: inherit;
border-radius:4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
}
.form_table input[type=radio], .form_table input[type=checkbox] {
margin-left:0;
padding-left:0;
}
.form_table .required {
font-weight:bold;
}
.form_table em {
color:#666;
}
.error {
color:#f00;
}
.form_table .error input {
border:1px solid #f00;
}
.form_table th, div.section-break {
text-align:left;
border:1px solid #ccc;
background:#eee;
padding:0;
padding:5px;
}
div.section-break h3 {
margin: 0;
padding: 0;
margin: -0.3em -0.3em;
.form_table th em:not(:first-child) {
margin-top: 0.6em;
}
1379
1380
1381
1382
1383
1384
1385
1386
1387
1388
1389
1390
1391
1392
1393
1394
1395
1396
1397
1398
1399
1400
1401
1402
1403
1404
.form_table th em {
display:block;
color:#000;
}
.settings_table {
margin-top:2px;
border-left:1px solid #ddd;
border-right:1px solid #ddd;
}
.settings_table td {
border-bottom:1px solid #ddd;
}
.settings_table input[type=radio], .settings_table input[type=checkbox] {
margin-left:0;
padding-left:0;
}
#content .settings_table th h4 a {
display:block;
color:#fff;
}
.settings_table h4 a span {
display:inline-block;
width:14px;
height:14px;
overflow:hidden;
text-align:center;
color:#444;
background:#ccc;
position:relative;
top:2px;
}
h2 {
font-size:1.4em;
h2 i {
font-size:12px;
top:-2px;
position:relative;
color:#0a0;
}
h2 small {
font-size:.8em;
}
/*h2 span { color:#000; }*/
h3 {
margin:10px 0 0 0;
padding:5px 0;
color:#444;
}
h3.title { color: black; line-height: 1.25em; }
h3.title > .sub-title {
font-weight: normal;
font-size: 1.1rem;
}
.tixTitle {
padding:0 5px 0px;
}
.tixTitle h3 {
color:#444;
padding:0;
margin:0;
font-size:1.4em;
font-weight:300;
}
.has_bottom_border {
padding-bottom:5px;
border-bottom:1px solid #ddd;
}
.ticket_info th {
text-align:left;
}
.ticket_info {
background:#F4FAFF;
}
.ticket_info.custom-data thead th {
border-bottom: 2px solid #ccc;
background-color: white;
}
.custom-data th, .custom-data td {
padding: 3px;
}
table.custom-data {
margin-bottom: 1em;
}
1483
1484
1485
1486
1487
1488
1489
1490
1491
1492
1493
1494
1495
1496
1497
1498
1499
1500
1501
1502
1503
1504
1505
1506
1507
.right_align { text-align:right; }
h2 .reload {
display:inline-block;
width:16px;
height:16px;
background:url(../images/icons/refresh.gif) top left no-repeat;
outline:none;
text-indent:-9999px;
}
#assigned_message {
margin:10px 0;
padding:5px 5px 5px 30px;
background:url(../images/icons/assigned_ticket.gif) 5px 50% no-repeat #ffd;
border:1px solid #f90;
}
#ticket_actions {
padding:5px;
background:#eee;
border:1px solid #aaa;
border-bottom:none;
margin:0;
}
/***** top page ticket response buttons *****/
background-color:#fff9e2;
color:#555!IMPORTANT;
margin-bottom: 15px;
z-index: 0;
.thread-entry::after {
content: "";
border-bottom: 2px solid white;
display: block;
.thread-entry::before {
content: "";
display: block;
border-top: 2px solid white;
.thread-entry.avatar {
margin-left: 60px;
.thread-entry.message.avatar {
margin-right: 60px;
margin-left: 0;
.thread-entry > .avatar {
margin-left: -60px;
display:inline-block;
width:48px;
.avatar {
border-radius: 12%;
.thread-entry.message > .avatar {
margin-left: initial;
margin-right: -60px;
img.avatar {
border-radius: inherit;
vertical-align: middle;
margin-right: 5px;
.avatar > img.avatar {
width: auto;
max-width: 100%;
max-height: 100%;
border: 1px solid #ccc;
border-color: rgba(0,0,0,0.2);
border-radius: 5px 5px 0 0;
}
.thread-entry.avatar .header:before {
position: absolute;
top: 7px;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-left: 8px solid #9cadcc;
display: inline-block;
}
.thread-entry.avatar .header:after {
position: absolute;
top: 7px;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
}
.thread-entry.avatar .header {
position: relative;
.thread-entry.message .header {
.thread-entry.avatar.message .header:after {
.thread-entry.response .header {
.thread-entry.avatar.response .header:before,
.thread-entry.avatar.note .header:before {
top: 7px;
right: initial;
border-left: none;
background-color: #f4f4f4;
}
.thread-entry.avatar.response .header:before {
border-right-color: #ccb3af;
}
.thread-entry.avatar.note .header:before {
border-right-color: #ccccb0;
}
.thread-entry.avatar.response .header:after,
.thread-entry.avatar.note .header:after {
top: 7px;
right: initial;
border-left: none;
.thread-entry.avatar.note .header:after {
border-right-color: #FFE;
}
.thread-entry .header .title {
max-width: 500px;
vertical-align: bottom;
display: inline-block;
margin-left: 15px;
}
.thread-entry .header .button {
margin-top: -4px;
}
border: 1px solid #ddd;
border-top: none;
border-bottom:2px solid #aaa;
border-radius: 0 0 5px 5px;
}
.thread-body .attachments {
background-color: #f4faff;
margin: 0 -0.9em;
position: relative;
top: 0.9em;
padding: 0.3em 0.9em;
border-top: 1px dotted #ccc;
border-top-color: rgba(0,0,0,0.2);
border-radius: 0 0 6px 6px;
}
.thread-body .attachments:empty {
display: none;
}
.thread-body .attachments .filesize {
margin-left: 0.5em;
}
.thread-body .attachment-info {
margin-right: 10px;
display: inline-block;
width: 48%;
}
.thread-body .attachment-info .filename {
max-width: 80%;
max-width: calc(100% - 70px);
}
#ticket_notes table td {
padding:5px;
}
#ticket_notes td {
background:#f9f9f9;
}
.thread-entry .info, #ticket_notes .info {
padding:5px;
background:#F4FAFF;
height:16px;
line-height:16px;
}
#ticket_notes .info {
background:#f9f9f9;
}
#response_options > form {
ul.tabs {
padding:4px 0 0 20px;
text-align:left;
height:29px;
border-bottom:1px solid #aaa;
background:#eef3f8;
box-shadow: inset 0 -5px 10px -9px rgba(0,0,0,0.3);
#response_options ul.tabs {
}
ul.tabs li {
background-color: rgba(251, 251, 251, 0.5);
border:1px solid #ccc;
border:1px solid rgba(204, 204, 204, 0.5);
border-bottom:none;
position: relative;
bottom: 1px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
font-size: 95%;
}
ul.tabs li.active {
color:#184E81;
background-color:#f9f9f9;
border:1px solid #aaa;
box-shadow: 4px -1px 6px -3px rgba(0,0,0,0.2);
}
li.error {
border-top: 2px solid rgba(255, 0, 0, 0.3) !important;
}
li.error.active {
border-top-color: rgba(255, 0, 0, 0.7) !important;
}
li.error a:before {
background-color: rgba(255,0,0,0.06);
top: 0;
left: 0;
bottom: 0;
right: 0;
content: "";
position: absolute;
}
ul.tabs li:not(.active) {
box-shadow: inset 0 -5px 10px -9px rgba(0,0,0,0.2);
}
ul.tabs.clean li.active {
background-color: white;
display: block;
outline: none;
padding: 5px 10px;
}
ul.tabs li a:hover {
text-decoration: none;
}
ul.tabs li.empty {
padding: 5px;
border: none !important;
}
ul.tabs.vertical {
display: inline-block;
height: auto;
border-bottom: initial;
border-right: 1px solid #aaa;
padding-left: 0;
padding-bottom: 40px;
padding-top: 10px;
background: transparent;
box-shadow: inset -5px 0 10px -9px rgba(0,0,0,0.3);
}
ul.tabs.vertical li {
border:1px solid #ccc;
border:1px solid rgba(204, 204, 204, 0.5);
border-right: none;
min-width: 0;
display: block;
border-top-right-radius: 0;
border-bottom-left-radius: 5px;
right: 0;
height: auto;
}
ul.tabs.vertical li:not(.active) {
box-shadow: inset -5px 0 10px -9px rgba(0,0,0,0.3);
}
ul.tabs.vertical li + li {
margin-top: 5px;
}
ul.tabs.vertical li.active {
border: 1px solid #aaa;
border-left: 2px solid #81a9d7;
border-right: none;
right: -1px;
box-shadow: -1px 4px 6px -3px rgba(0,0,0,0.3);
}
ul.tabs.vertical.left li {
text-align: right;
}
ul.tabs.vertical li a {
padding: 5px;
background-color:initial;
border-bottom:2px solid #ccc;
border-bottom-color: rgba(0,0,0,0.1);
box-shadow:none;
}
ul.tabs.alt li {
width:auto;
border:none;
min-width:0;
box-shadow:none;
bottom: 1px;
height: auto;
}
ul.tabs.alt li.active {
border:none;
box-shadow:none;
background-color: transparent;
border-bottom:2px solid #81a9d7;
}
#response_options .reply_tab.tell {
color:#a00 !important;
background-image:url(../images/reminder.png);
background-position:12px 50%;
background-repeat:no-repeat;
}
#response_options > form {
padding:10px 5px;
background:#f9f9f9;
border:1px solid #aaa;
border-top:none;
}
#response_options > form > table {
table-layout: fixed;
#response_options > table td {
#response_options input[type=text], #response_options textarea:not(.richtext) {
border-radius:4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
1903
1904
1905
1906
1907
1908
1909
1910
1911
1912
1913
1914
1915
1916
1917
1918
1919
1920
1921
1922
1923
1924
1925
1926
1927
1928
1929
1930
1931
1932
1933
1934
1935
}
.attachments .uploads div {
display:inline-block;
padding-right:20px;
}
.file {
display:inline-block;
padding-left:20px;
margin-right:20px;
background:url(../images/icons/file.gif) 0 50% no-repeat;
}
.expander {
line-height:14px;
display:inline-block;
width:12px;
height:12px;
overflow:hidden;
text-align:center;
color:#aaa;
position:relative;
}
/** Popup Tool Tips and Content **/
.tip_box {
display:block;
height:30px;
position:absolute;
}
.tip_arrow {
display:block;
position:absolute;
top:5px;
.tip_box.right .tip_arrow {
top: 5px;
right: -12px;
left: auto;
}
.flip-x {
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
filter: FlipH;
-ms-filter: "FlipH";
}
.tip_content {
height:auto !important;
height:20px;
min-height:20px;
border:1px solid #666;
background:#fff;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
-moz-box-shadow: 5px 5px 10px -2px rgba(0,0,0,0.5);
-webkit-box-shadow: 5px 5px 10px -2px rgba(0,0,0,0.5);
box-shadow: 5px 5px 10px -2px rgba(0,0,0,0.5);
}
.tip_content .links {
margin-top: 0.7em;
padding-top: 0.4em;
border-top: 1px solid #ddd;
}
.tip_content .links a {
color: #548dd4;