/* ------------------------------------------------------------------------ * * CSS2 Stylesheet for customizing the Look & Feel of CM/Help applications. * * You can customize all the provided classes within a so called . * Please refer to the skin documentation for further details. * * (c) 2002 Allez! GmbH & ConSol* Software GmbH * ------------------------------------------------------------------------ */ /* ========== * General * ========== */ /* Style used if not other specified */ body, table, tr, td, p, a, ul, li, select, input, div { font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; } /* Overall background color */ body, .body { background-color: #dddddd; } #cmlogo body {background-image:none !important;} #cmlogo body table {width:400px !important;border:4px solid #000;} /* Default style used for input elements within forms */ input, select, textarea, .form { background-color: #fff; background: #fff; font-size: 11px; } input.append_checkbox { background-color: #fff; background: #fff; font-size: 11px; } /* Links general */ a:link,a:visited,a:active { color: #000000 } a:hover {text-decoration: underline; color: #EA7C10;} /* ========== * Login * ========== */ /* Color of the borders in login page */ .login_border { background-color: #b9b9b9; color: #b9b9b9; } /* Inner login box */ .login_box { background-color: #f4f4f4; } /* Label in login box */ .login_label { text-align: right; } /* Headline in login box */ .login_headline { height: 50px; text-align: center; } /* Input field in login box */ .login_input { font-size: 12px; width: 140px; } /* General properties of all labels */ .label { font-weight: bold; } .subride_label { font-weight: bold; padding:5 0 1 2px; } /* common properties for all button panels */ .buttons { margin-top: 3px; margin-left: 3px; margin-bottom: 3px; margin-right: 3px; } /* =================== * Boxes in workspaces * =================== */ /* The workspace in lower, right frame is divided into so called "tiles" or "boxes" - The overall CSS attributes of these boxes can be defined here */ /* Generic box properties */ table.box { width: 95%; } /* Box-Headlines */ table.box_headline { width: 95%; cell-spacing: 0; padding: 0; border: 0; font-size: 12px; } td.box_headline { background-color: #cacaca; font-size: 12px; } div.box_margin { margin-top: 1px; } div.box_headline { color: #fff; font-weight: bold; font-size: 12px; margin-top: 3px; margin-left: 8px; margin-bottom: 3px; } div.box_content { padding: 3px; margin-left: 2px; margin-top: 5px; margin-bottom: 3px; } /* ==== * Call * ==== */ /* Call-Box */ td.call { background-color: #f0f0f0; align: left; } /* Used for sidebar of a callbox */ td.call_sidebar { padding: 3px; vertical-align: top; } /* Used for rendering a standalone id in a call box */ div.call_id { font-size: 12px; color: #000000; font-weight: bold; margin-top: 5px; margin-bottom: 5px; margin-right: 5px; margin-left: 5px; } /* Subject of a call */ div.call_subject,span.call_subject { font-weight: bold; margin-left: 3px; } input.call_subject { width: 465; height: 20px; } input.customer_attribute_input { width: 300; height: 20px; } input.customer_attribute_input_disabled { width: 300; height: 20px; background-color: #e8e8e8; } /* Labels within a call box */ .call_attribute_label { } .call_attribute_required_label { color: #FF0000; } /* pulldown fields used in call attributes */ select.call_attribute_input { font-size: 10px; width: 200px; height: 16px; } /* pulldown fields used in call attributes for dates */ select.call_attribute_date { font-size: 10px; height: 16px; } /* Read-Only calltext */ td.call_text { font-family: Courier New, Courier; } /* Input text area when editing a call */ textarea.call_text_input { font-family: Courier New, Courier; width: 570px; } /* Call search */ div.call_search_label { padding: 3px; margin-left: 3px; height: 24px; } td.call_search_label { width: 100px; } .call_search_input { width: 210px; background-color: #fff; } .spaceright { padding-right:10px; } .spaceright20 { padding-right:20px; } .spaceleft2 { margin-left:2px; } .call_attribute_input_double { height: 20px; text-align:right; } input.call_date { width: 60px; height: 20px; } input.w200, select.w200, textarea.w200 { background-color: #fff; font-size: 11px; width:200px; } /* Attachment input fields*/ input.attachment_input { width: 325px; } /* input fields during reference create */ input.reference_id { width: 60px; } input.reference_comment { width: 360px; } /* input checkbox for selecting reference call for deletion */ input.reference_checkbox { background-color: none; background: none; } /* view select (in navigation panel) */ select.call_view { font-size: 10px; background-color: #fff; width: 190px; } /* Input field for call id in navigation panel */ .call_id_search_input { font-size: 10px; background-color: #fff; width: 50px; } /* Table frames for tamplate */ table.frame { background-color: #a7a7a7; } table.frame.element{} table.frame.cmopen{} /* Specific style for buttons in call menus * This is are used in addition to the common * buttons properties defined in class 'buttons' */ .call_buttons { } /* ===================================== * Call List * * These styles are used within the list * of assigned and unassigned calls * (shown in the leftmost frame) * * See also the CSS classes, which are * defined in the section "Layout" and * are used within the call layout * configuration * ==================================== */ /* Headline assigned and unassigned Calls */ .call_list_head { color: #FFFFFF; font-weight: bold; font-size: 12px; letter-spacing: 0.1em; } /* Enclosing tables */ table.call_list { background-color: #e7e7e7; border: 0; padding: 0; cell-spacing: 0; } /* Separator rows between calls */ .call_list_sep_light { background-color: #FFFFFF; } .call_list_sep { background-color: #888; } /* Status symbol */ .call_list_status { padding: 5px; } /* Call id in call list */ .call_list_id { color: #000000; font-weight: bold; margin-left: 2px; } /* ======== * Customer * ======== */ /* General customer attributes */ .customer { background-color: #eaeaea; background: #eaeaea; } /* First line of a customer entry in a list of customers */ .customer_list_head { background-color: #e7e7e7; font-weight: bold; margin-left: 4px; margin-top: 2px; width: 160px; } /* Customer list */ .customer_list { background-color: #e7e7e7; } /* Label for a customer form */ .customer_form_label { padding: 3px; margin-left: 3px; height: 24px; } /* Various input field width for customer form: */ input.cust_form_small { width: 120px; height: 20px; } input.cust_form_large { width: 330px; height: 20px; } input.cust_form_date { } input.cust_form_checkbox { background-color: none; background: none; } textarea.cust_form_large { width: 330px; } input.cust_form_xlarge { width: 350px; height: 20px; } /* Label for a required customer attribute */ .customer_form_required_label { padding: 3px; margin-left: 3px; margin-right: 3px; margin-top: 2px; margin-bottom: 2px; height: 16px; background-color: #E0A9B4; } /* =========== * Preferences * =========== */ /* Label for a preferences form */ .pref_label { padding: 3px; font-weight: bold; margin-left: 3px; height: 24px; } /* preferences input fields */ input.pref_input { font-family: Arial; width: 500px; } /* password input fields */ input.password_input { font-family: Courier New, Courier; width: 500px; } select.pref_input { font-size: 10px; width: 500px; } textarea.pref_input { width: 500px; font-family: Arial; } /* ==== * Mail * ==== */ /* Label of headers */ .mail_label { margin-left: 2px; } /* Text input fields for mail headers */ input.mail_input { font-family: Courier New, Courier; font-size: 11px; width: 250px; } /* Text input field for mail subject */ input.mail_subject { font-family: Arial; width: 500px; } /* Input area for mail body */ textarea.mail_body { font-family: Arial; width: 500px; } /* ======== * Messages * ======== * * These are shown on top of the workspace if needed. */ /* Info-Box */ table.info { width: 95%; } td.info { background: #FFFFFF; background-color: #FFFFFF; } div.info { padding: 5px; font-weight: bold; font-size: 12px; } /* Error-Box */ table.error { width: 95%; } td.error { background: #FFFF00; background-color: #FFFF00; } div.error { padding: 5px; font-weight: bold; font-size: 12px; } div.error_internal { padding: 5px; font-size: 12px; } /* headline on error page */ td.error_headline { background: #FFFF00; background-color: #FFFF00; } div.error_headline { font-weight: bold; font-size: 12px; margin-top: 3px; margin-left: 5px; margin-bottom: 3px; } div.error_title { font-weight: bold; font-size: 14px; margin-top: 10px; margin-bottom: 10px; align: center; } div.error_text { margin-top: 5px; margin-left: 5px; margin-bottom: 5px; align: left; } /* Question-Box */ table.question { width: 95%; } td.question { background-color: #e7e7e7; align: left; } /* ==== * Misc * ==== */ /* Welcome Message */ a:link.menu_link {font-size: 12px; text-decoration: none; color: #3b3b3b; font-weight: bold;} a:visited.menu_link {font-size: 12px; text-decoration: none; color: #3b3b3b; font-weight: bold;} a:active.menu_link {font-size: 12px; text-decoration: underline; color: #EA7C10; font-weight: bold;} a:hover.menu_link {font-size: 12px; text-decoration: underline; color: #EA7C10; font-weight: bold;} div.menu_link { padding: 5px; width: 153px; max-width: 143px; overflow: hidden; } .news_head { color: #000000; font-weight: bold; font-size: 12px; } .news_date { color: #1C2B3A; font-weight: bold; } .menu_pos { margin-left: 7px; } .menu_center { margin-left: 25px; } .welcome_msg { font-size: 11px; font-weight: bold; margin-left: 5px; } .welcome_sub { font-size: 11px; margin-left: 5px; } /* Color of checkboxes */ input.checkbox { background-color: #eaeaea; background: #eaeaea; } /* date select boxes */ select.date { font-size: 10px; } .footer { color: #ffffff; font-size: 10px; } /* * =========== * Templates * =========== */ /* label (call template) */ td.tpl_call_label { font-weight: bold; } /* required label (call template) */ td.tpl_call_label_req { font-weight: bold; color: #FF0000; } /* element (call template) */ td.tpl_call_element { background-color: #f4f4f4; } /* input element (call template) */ input.tpl_call { } /* label (call template) */ td.tpl_mail_label { font-weight: bold; } /* element (call template) */ td.tpl_mail_element { } /* input element (call template) */ input.tpl_mail { } /* =========================================== */ /* ======= Layouts ======= Layouts can be used to customize the order of certain elements. Within the definition of layouts, CSS classes can be specified. The following classes are defined in the default layouts and can be customized or you can customize the layout configuration itself Additional classes used in layouts: + call_attribute_label + label */ /* ---------------------- call-layout-config.xml ---------------------- */ /* Property for call attributes rendered read only */ .call_attribute { } /* Property for call attributes rendered read only in call info as table */ .call_attribute_info { width: 200px margin-right: 20px padding-right: 100px } /* Call Subject in call list */ .call_list_subject { padding-left: 2px; font-size: 11px; width: 210px; color: #000000; font-weight: bold; margin-top: 1px; margin-bottom: 2px; margin-left: 2px; } /* Call attributes */ .call_list_attributes { background-color: #f3f3f3; padding-left: 2px; width: 220px; color: #000000; font-size: 11px; margin-top: 1px; margin-bottom: 1px; margin-left: 2px; } /* Customer in call box */ .call_list_customer { width: 210px; padding-left: 2px; color: #000000; font-size: 11px; margin-top: 1px; margin-bottom: 3px; margin-left: 2px; } /* One line in a call layout */ div.call_line_1 { background-color: #f3f3f3; } /* Alternate line in call layout */ div.call_line_2 { } /* -------------------------- customer-layout-config.xml -------------------------- */ /* Style for an customer attribute */ .customer_attribute { color: #1B1B49; } /* Style for an customer's name */ .customer_name { color: #1B1B49; font-weight: bold; } .frame_color { background-color: #a7a7a7; } .no_frame_color { background-color: #FFFFFF; } .background_element { background-color: #efefef; } .info_error { background-color: #ffa800; } .news_color { background-color: #e4e4e4; } .info_color { background-color: #F2F5F8; } .call_box { cellspacing: 1; cellpadding: 1; border: 0; width: 100%; } .about_head { padding-left:25px; padding-top:20px; font-family: Arial, Helvetica, sans-serif; color:#333333; font-size:12px; text-decoration:underline; font-weight:bold; } .about_description { font-family: Arial, Helvetica, sans-serif; color:#333333; padding-left:40px; padding-right:40px; padding-top:5px; font-size:10px; } .about { background-color:#ffffff; } td.element { background-color: #888; } td.element.menu { width: 12px; valign: middle; } td.element.sidebar { width: 12px; valign: middle; } td.element.news{} td.element.append_note{} td.navigation { background-color: #f1f1f1; } table.frame { background-color: #a7a7a7; } table.frame.cmopen{} table.frame.standard{} /* CSCT styling */ #ctp_header { WIDTH: 100%;BORDER-RIGHT: #ffffff 1px solid; BORDER-BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR: #cacaca } #ctp_header_border { WIDTH: 100%; BORDER-RIGHT: #868686 1px solid; BORDER-TOP: #868686 1px solid; BORDER-LEFT: #868686 1px solid; BORDER-BOTTOM: #868686 1px solid } #ctp_header_content { WIDTH: 100%; BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; BACKGROUND-COLOR: #cacaca } #ctp_list{ width:100%;BORDER-RIGHT: #ffffff 1px solid; BORDER-BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR: #dbdbdb } #ctp_list_border{ width:100%;BORDER-RIGHT: #868686 1px solid; BORDER-TOP: #868686 1px solid; BORDER-LEFT: #868686 1px solid; BORDER-BOTTOM: #868686 1px solid } #ctp_list_content { width:100%;BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; BACKGROUND-COLOR: #dbdbdb } TABLE.ctp_list { WIDTH: 100% } TABLE.ctp_list TR.ctp_small TD { BORDER-TOP: #cdcdcd 1px solid } TABLE.ctp_list TR.first_row TD { BORDER-TOP: #ffffff 1px solid } TABLE.ctp_list TR.odd_row { BACKGROUND-COLOR: #e7e7e7 } TABLE.ctp_list TR.odd_row TD { HEIGHT: 18px } TABLE.ctp_list TR.even_row { BACKGROUND-COLOR: #eeeeee } TABLE.ctp_list TR.even_row TD { HEIGHT: 18px } TABLE.ctp_list TD.ctp_type { BORDER-RIGHT: #cdcdcd 1px solid; WHITE-SPACE: nowrap; BACKGROUND-COLOR: #f7f7e9 } TABLE.ctp_list TD.ctp_type_mail { BORDER-RIGHT: #cdcdcd 1px solid; WHITE-SPACE: nowrap; BACKGROUND-COLOR: #f7f7e9 } TABLE.ctp_list TD.ctp_type_mailreply { BORDER-RIGHT: #cdcdcd 1px solid; WHITE-SPACE: nowrap; BACKGROUND-COLOR: #f7f7e9 } TABLE.ctp_list TD.ctp_type_mailattach { BORDER-RIGHT: #cdcdcd 1px solid; WHITE-SPACE: nowrap; BACKGROUND-COLOR: #f7f7e9 } TABLE.ctp_list TD.ctp_type_text { BORDER-RIGHT: #cdcdcd 1px solid; WHITE-SPACE: nowrap; BACKGROUND-COLOR: #f0d49d } TABLE.ctp_list TD.ctp_type_attachment { BORDER-RIGHT: #cdcdcd 1px solid; WHITE-SPACE: nowrap; BACKGROUND-COLOR: #addda3 } TABLE.ctp_list TD.ctp_headline { BORDER-LEFT: #edf0f4 1px solid } TABLE.ctp_list TD.ctp_content { BORDER-LEFT: #edf0f4 1px solid } TABLE.ctp_list TD.ctp_action { WHITE-SPACE: nowrap } TABLE.ctp_list TD.ctp_period { WHITE-SPACE: nowrap } TABLE.ctp_list TD.ctp_agent { WHITE-SPACE: nowrap } TABLE.ctp_list TR.last_row TD { BORDER-BOTTOM: medium none } TABLE.ctp_list TR.ctp_small TD { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: medium none } TABLE.ctp_list TR.ctp_content TD { PADDING-RIGHT: 5px; PADDING-LEFT: 5px } TABLE.ctp_list THEAD TH { BORDER-BOTTOM: #868686 1px solid; TEXT-ALIGN: left; height:20px; } TABLE.ctp_list THEAD TH.ctp_type { BORDER-RIGHT: #c0c0c0 1px solid; width:2%; } TABLE.ctp_list THEAD TH.ctp_action { PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ececec 1px solid; width:2%; } TABLE.ctp_list THEAD TH.ctp_period { BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ececec 1px solid; } TABLE.ctp_list THEAD TH.ctp_agent { BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ececec 1px solid; width:30%; } TABLE.ctp_list THEAD TH.ctp_headline { BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ececec 1px solid; width:53%; } TABLE.ctp_list THEAD TH.ctp_attribute { BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ececec 1px solid; } TABLE.ctp_list THEAD TH.ctp_duration { BORDER-RIGHT: #c0c0c0 1px solid; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ececec 1px solid; } TD.ctp_closed A, TD.ctp_open A { PADDING-LEFT: 15px } TD.ctp_closed { BACKGROUND-POSITION: 5px 4px; FONT-WEIGHT: bold; BACKGROUND-IMAGE: url(../pic/csct/minus.gif); BACKGROUND-REPEAT: no-repeat; HEIGHT: auto } TD.ctp_open { BACKGROUND-POSITION: 5px 4px; BACKGROUND-IMAGE: url(../pic/csct/plus.gif); BACKGROUND-REPEAT: no-repeat; HEIGHT: auto } A.ctp_history { BACKGROUND-POSITION: left top; DISPLAY: block; PADDING-LEFT: 15px; BACKGROUND-REPEAT: no-repeat; HEIGHT: auto } A.mailheader_closed { BACKGROUND-POSITION: left top; DISPLAY: block; PADDING-LEFT: 15px; FONT-WEIGHT: bold; BACKGROUND-IMAGE: url(../pic/csct/mailheader_minus.gif); COLOR: #13a000; BACKGROUND-REPEAT: no-repeat; HEIGHT: auto } A.mailheader_open { BACKGROUND-POSITION: left top; DISPLAY: block; PADDING-LEFT: 15px; BACKGROUND-IMAGE: url(../pic/csct/mailheader_plus.gif); COLOR: #13a000; BACKGROUND-REPEAT: no-repeat; HEIGHT: auto } .ctp_selection_active { FONT-WEIGHT: bold } TR.mailheader_content TD { BACKGROUND-POSITION: left top; PADDING-LEFT: 15px! important; COLOR: #13a000; BACKGROUND-REPEAT: repeat-y; BACKGROUND-COLOR: #ffffff! important } .ctp_checkbox { BACKGROUND: none transparent scroll repeat 0% 0% } a.order {color: #113258;text-decoration:none;font-weight:bold;background-image:url(../pic/csct/order_down.gif); background-repeat:no-repeat;background-position:center right;padding-right:20px;line-height:20px;} a.order:link {color: #113258;text-decoration:underline;font-weight:bold;} a.order:visited {color: #113258;text-decoration:underline;font-weight:bold;} a.order:hover {color: #000000;text-decoration:underline;font-weight:bold;} table.type {margin:0px;padding:0px;border:none;} table.type td {background-color:none !important;margin:0px !important;padding:0px !important;border:none !important;} input.check {background-color:none;margin:0px;margin-right:5px;} input, select {font-size:11px;} .white {background-color:#ffffff !important;} .black {background-color:#ffffff !important;} table.ctp_select_action {width:100%;} table.ctp_select_action td {padding:5px;padding-bottom:0px;padding-top:0px;} select.ctp_select_action {font-size:11px;} a.ctp_selection {} table.ctp_select_action td.ctp_select_action_arrow {white-space:nowrap;width:2%;} table.ctp_select_action td.ctp_select_action_select {white-space:nowrap;width:100%;} table.ctp_select_action td.ctp_select_action_filter {white-space:nowrap;width:36%;text-align:right;} table.ctp_select_action td.ctp_select_action_actions {white-space:nowrap;width:2%;} td.ctp_action img {margin-right:5px;} div.ctp_open_disabled {padding-left:15px;} a.ctp_open_disabled {padding-left:15px;} textarea.content { border:none; background-color:#fff; width:98%; font: 11px Arial, Helvetica, sans-serif; height:100px; padding:5px; margin-bottom:5px; } div.scrolldiv { margin-bottom:5px; padding:5px; background-color:#fff; position: relative; left: 0px; top: 0px; width: 50%; height: 100%; overflow: scroll; } table.scrollinger { table-layout: fixed; margin-bottom:5px;width:100%; } table.scrollinger td {background-color:#ffffff;padding:5px;padding-bottom:0px;} table.scrollinger pre { width:100%; overflow-x: auto; margin: 0; padding-bottom:5px; line-height: 12px;} table.scrollingerold pre { width:100%; overflow-x: auto; height:9em; line-height: 1; margin: 0; } div.scrollinger { margin-bottom:5px; padding:5px; background-color:#fff; overflow-x: auto; width: 98%; }