@oat-sa/tao-core-ui 1.54.2 → 1.55.0

package/src/css/ckeditor/skins/tao/css/dialog.css

@@ -0,0 +1,950 @@
+/*
+Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+dialog.css
+============
+
+This file styles dialogs and all widgets available inside of it (tabs, buttons,
+fields, etc.).
+
+Dialogs are a complex system because they're very flexible. The CKEditor API
+makes it easy to create and customize dialogs by code, by making use of several
+different widgets inside its contents.
+
+All dialogs share a main dialog strucuture, which can be visually represented
+as follows:
+
++-- .cke_dialog -------------------------------------------------+
+| +-- .cke_dialog_body ----------------------------------------+ |
+| | +-- .cke_dialog_title --+ +-- .cke_dialog_close_button --+ | |
+| | |                       | |                              | | |
+| | +-----------------------+ +------------------------------+ | |
+| | +-- .cke_dialog_tabs ------------------------------------+ | |
+| | |                                                        | | |
+| | +--------------------------------------------------------+ | |
+| | +-- .cke_dialog_contents --------------------------------+ | |
+| | | +-- .cke_dialog_contents_body -----------------------+ | | |
+| | | |                                                    | | | |
+| | | +----------------------------------------------------+ | | |
+| | | +-- .cke_dialog_footer ------------------------------+ | | |
+| | | |                                                    | | | |
+| | | +----------------------------------------------------+ | | |
+| | +--------------------------------------------------------+ | |
+| +------------------------------------------------------------+ |
++----------------------------------------------------------------+
+
+Comments in this file will give more details about each of the above blocks.
+*/
+/*
+Usage:
+- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
+   if 3 colors used then the position of each will be 33,33%
+- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
+   first param - color, second - position. Also you can use px or other valid units for set position.
+*/
+/* based on "visually-hidden" mixin in LDS for accessibility goals */
+/* Do not edit */
+/* Tao specific stuff */
+/*
+Usage:
+- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
+   if 3 colors used then the position of each will be 33,33%
+- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
+   first param - color, second - position. Also you can use px or other valid units for set position.
+*/
+/* based on "visually-hidden" mixin in LDS for accessibility goals */
+/* Do not edit */
+[class^="icon-"], [class*=" icon-"] {
+    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+}
+
+.cke_button {
+    min-width: 14px;
+    text-decoration: none !important;
+    text-align: center;
+}
+
+.cke_top,
+.cke_top:before,
+.cke_top:after,
+.cke_top *,
+.cke_top *:before,
+.cke_top *:after {
+    box-sizing: content-box !important;
+}
+
+.cke_button_icon, .cke_button {
+    padding-top: 1px;
+    line-height: 0.9;
+    font-size: 16px;
+}
+
+.cke_nose {
+    position: absolute;
+    bottom: -6px;
+    transform: rotate(45deg);
+    border: 1px #f3f1ef solid;
+    border-left: none;
+    border-top: none;
+    width: 12px;
+    height: 12px;
+    background: #f3f1ef;
+    box-shadow: 2px 1px 1px 0 rgba(0, 0, 0, 0.1);
+    opacity: 0;
+}
+
+.cke_nose.float-space-left {
+    opacity: 1;
+    transition: opacity .1s ease-in-out;
+    right: auto;
+    left: 5px;
+}
+
+.cke_nose.float-space-right {
+    opacity: 1;
+    transition: opacity .1s ease-in-out;
+    right: 5px;
+    left: auto;
+}
+
+.cke_nose.float-space-bottom {
+    top: -6px;
+    box-shadow: none;
+}
+
+.cke_nose.float-space-top {
+    bottom: -6px;
+}
+
+[class^="btn-"], [class*=" btn-"], .btn-default,
+button, input[type="submit"], input[type="reset"], a.cke_dialog_ui_button {
+    border-radius: 3px;
+    font-size: 14px !important;
+    font-size: 1.4rem !important;
+    cursor: pointer;
+    text-decoration: none !important;
+    vertical-align: middle;
+    outline: 0;
+    overflow: visible;
+    border: none;
+    display: inline-block;
+    line-height: 2.5;
+    padding: 0 15px;
+    font-weight: normal;
+    font-style: normal;
+    text-align: center;
+    height: 35px;
+    color: white;
+    background-color: #adb2b9;
+    text-shadow: 1px 1px 0 #83878e;
+}
+
+.btn-secondary[class^="btn-"], .btn-secondary[class*=" btn-"], .btn-secondary.btn-default,
+button.btn-secondary, input.btn-secondary[type="submit"], input.btn-secondary[type="reset"], a.btn-secondary.cke_dialog_ui_button {
+    color: #adb2b9;
+    border: 1px solid #adb2b9;
+    background-color: white;
+    text-shadow: none;
+    line-height: 2.3;
+}
+
+.small[class^="btn-"], .small[class*=" btn-"], .small.btn-default,
+button.small, input.small[type="submit"], input.small[type="reset"], a.small.cke_dialog_ui_button {
+    line-height: 1.8;
+    height: 25px;
+}
+
+.small.btn-secondary[class^="btn-"], .small.btn-secondary[class*=" btn-"], .small.btn-secondary.btn-default,
+button.small.btn-secondary, input.small.btn-secondary[type="submit"], input.small.btn-secondary[type="reset"], a.small.btn-secondary.cke_dialog_ui_button {
+    line-height: 1.5;
+}
+
+.small[class^="btn-"] [class^="icon-"], .small[class*=" btn-"] [class^="icon-"], .small.btn-default [class^="icon-"], button.small [class^="icon-"], input.small[type="submit"] [class^="icon-"], input.small[type="reset"] [class^="icon-"], a.small.cke_dialog_ui_button [class^="icon-"], .small[class^="btn-"] [class*=" icon-"], .small[class*=" btn-"] [class*=" icon-"], .small.btn-default [class*=" icon-"], button.small [class*=" icon-"], input.small[type="submit"] [class*=" icon-"], input.small[type="reset"] [class*=" icon-"], a.small.cke_dialog_ui_button [class*=" icon-"] {
+    font-size: 13px;
+    font-size: 1.3rem;
+}
+
+[class^="btn-"] [class^="icon-"], [class*=" btn-"] [class^="icon-"], .btn-default [class^="icon-"], button [class^="icon-"], input[type="submit"] [class^="icon-"], input[type="reset"] [class^="icon-"], a.cke_dialog_ui_button [class^="icon-"], [class^="btn-"] [class*=" icon-"], [class*=" btn-"] [class*=" icon-"], .btn-default [class*=" icon-"], button [class*=" icon-"], input[type="submit"] [class*=" icon-"], input[type="reset"] [class*=" icon-"], a.cke_dialog_ui_button [class*=" icon-"] {
+    font: tao !important;
+    font-family: tao;
+    font-size: 14px;
+    font-size: 1.4rem;
+    line-height: 1;
+    padding: 0 9px 0 0;
+    position: relative;
+    top: 1px;
+    left: -1px;
+    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
+}
+
+[class^="btn-"] [class^="icon-"].r, [class*=" btn-"] [class^="icon-"].r, .btn-default [class^="icon-"].r, button [class^="icon-"].r, input[type="submit"] [class^="icon-"].r, input[type="reset"] [class^="icon-"].r, a.cke_dialog_ui_button [class^="icon-"].r, [class^="btn-"] [class*=" icon-"].r, [class*=" btn-"] [class*=" icon-"].r, .btn-default [class*=" icon-"].r, button [class*=" icon-"].r, input[type="submit"] [class*=" icon-"].r, input[type="reset"] [class*=" icon-"].r, a.cke_dialog_ui_button [class*=" icon-"].r {
+    padding: 0 0 0 9px;
+}
+
+:hover[class^="btn-"], :hover[class*=" btn-"], .btn-default:hover,
+button:hover, input:hover[type="submit"], input:hover[type="reset"], a.cke_dialog_ui_button:hover {
+    opacity: .85;
+}
+
+.btn-info[class^="btn-"], .btn-info[class*=" btn-"], .btn-info.btn-default,
+button.btn-info, input.btn-info[type="submit"], input.btn-info[type="reset"], a.btn-info.cke_dialog_ui_button {
+    color: white;
+    background-color: #266d9c;
+    text-shadow: 1px 1px 0 #0b4a74;
+}
+
+.btn-info.btn-secondary[class^="btn-"], .btn-info.btn-secondary[class*=" btn-"], .btn-info.btn-secondary.btn-default,
+button.btn-info.btn-secondary, input.btn-info.btn-secondary[type="submit"], input.btn-info.btn-secondary[type="reset"], a.btn-info.btn-secondary.cke_dialog_ui_button {
+    color: #266d9c;
+    border: 1px solid #266d9c;
+    background-color: white;
+    text-shadow: none;
+}
+
+.btn-error[class^="btn-"], .btn-error[class*=" btn-"], .btn-error.btn-default,
+button.btn-error, input.btn-error[type="submit"], input.btn-error[type="reset"], a.btn-error.cke_dialog_ui_button {
+    color: white;
+    background-color: #c12a40;
+    text-shadow: 1px 1px 0 #950e22;
+}
+
+.btn-error.btn-secondary[class^="btn-"], .btn-error.btn-secondary[class*=" btn-"], .btn-error.btn-secondary.btn-default,
+button.btn-error.btn-secondary, input.btn-error.btn-secondary[type="submit"], input.btn-error.btn-secondary[type="reset"], a.btn-error.btn-secondary.cke_dialog_ui_button {
+    color: #c12a40;
+    border: 1px solid #c12a40;
+    background-color: white;
+    text-shadow: none;
+}
+
+.btn-success[class^="btn-"], .btn-success[class*=" btn-"], .btn-success.btn-default,
+button.btn-success, input.btn-success[type="submit"], input.btn-success[type="reset"], a.btn-success.cke_dialog_ui_button {
+    color: white;
+    background-color: #269c5d;
+    text-shadow: 1px 1px 0 #0b743c;
+}
+
+.btn-success.btn-secondary[class^="btn-"], .btn-success.btn-secondary[class*=" btn-"], .btn-success.btn-secondary.btn-default,
+button.btn-success.btn-secondary, input.btn-success.btn-secondary[type="submit"], input.btn-success.btn-secondary[type="reset"], a.btn-success.btn-secondary.cke_dialog_ui_button {
+    color: #269c5d;
+    border: 1px solid #269c5d;
+    background-color: white;
+    text-shadow: none;
+}
+
+.btn-warning[class^="btn-"], .btn-warning[class*=" btn-"], .btn-warning.btn-default,
+button.btn-warning, input.btn-warning[type="submit"], input.btn-warning[type="reset"], a.btn-warning.cke_dialog_ui_button {
+    color: white;
+    background-color: #dcb66b;
+    text-shadow: 1px 1px 0 #ad8b49;
+}
+
+.btn-warning.btn-secondary[class^="btn-"], .btn-warning.btn-secondary[class*=" btn-"], .btn-warning.btn-secondary.btn-default,
+button.btn-warning.btn-secondary, input.btn-warning.btn-secondary[type="submit"], input.btn-warning.btn-secondary[type="reset"], a.btn-warning.btn-secondary.cke_dialog_ui_button {
+    color: #dcb66b;
+    border: 1px solid #dcb66b;
+    background-color: white;
+    text-shadow: none;
+}
+
+/* todo move to main ? */
+.disabled, button[disabled] {
+    background-color: #afb4bb !important;
+    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8) !important;
+    cursor: not-allowed !important;
+    opacity: .55 !important;
+    color: #000 !important;
+    border: none !important;
+}
+
+.ui-button [class^="icon-"], .ui-button [class*=" icon-"] {
+    font-family: tao !important;
+}
+
+/* The outer container of the dialog. */
+.cke_dialog {
+    /* Mandatory: Because the dialog.css file is loaded on demand, we avoid
+    showing an unstyled dialog by hidding it. Here, we restore its visibility. */
+    visibility: visible;
+}
+
+.cke_dialog_container {
+    background: transparent !important;
+}
+
+/* The inner boundary container. */
+.cke_dialog_body {
+    z-index: 1;
+    border: 1px solid #ddd;
+    border-radius: 2px;
+    border-radius: 1px;
+    border-color: #333333;
+}
+
+/* This one is required by Firefox 3.6. Without it,
+   dialog tabs and resizer float outside of the dialog.
+   Although this rule doesn't seem to break anything on other
+   browsers, it doesn't work with broken jQueryUI - #9851. */
+.cke_browser_gecko19 .cke_dialog_body {
+    position: relative;
+}
+
+/* Due to our reset we have to recover the styles of some elements. */
+.cke_dialog strong {
+    font-weight: bold;
+}
+
+/* The dialog title. */
+.cke_dialog_title {
+    font-size: 13px;
+    cursor: move;
+    position: relative;
+    color: white;
+    border-bottom: 1px solid #333333;
+    padding: 6px 10px;
+    background: #333333;
+}
+
+/* The outer part of the dialog contants, which contains the contents body
+   and the footer. */
+.cke_dialog_contents {
+    background-color: #f3f1ef;
+    overflow: auto;
+    padding: 15px 10px 5px 10px;
+    margin-top: 30px;
+    border-top: 1px solid #bfbfbf;
+    border-radius: 0 0 3px 3px;
+}
+
+/* The contents body part, which will hold all elements available in the dialog. */
+.cke_dialog_contents_body {
+    overflow: auto;
+    padding: 17px 10px 5px 10px;
+    margin-top: 22px;
+}
+
+/* The dialog footer, which usually contains the "Ok" and "Cancel" buttons as
+   well as a resize handler. */
+.cke_dialog_footer {
+    text-align: right;
+    position: relative;
+    border-top: 1px solid #ddd;
+    background: #f3f1ef;
+}
+
+.cke_rtl .cke_dialog_footer {
+    text-align: left;
+}
+
+.cke_hc .cke_dialog_footer {
+    outline: none;
+    border-top: 1px solid #fff;
+}
+
+.cke_dialog .cke_resizer {
+    margin-top: 22px;
+}
+
+.cke_dialog .cke_resizer_rtl {
+    margin-left: 5px;
+}
+
+.cke_dialog .cke_resizer_ltr {
+    margin-right: 5px;
+}
+
+/*
+Dialog tabs
+-------------
+
+Tabs are presented on some of the dialogs to make it possible to have its
+contents split on different groups, visible one after the other.
+
+The main element that holds the tabs can be made hidden, in case of no tabs
+available.
+
+The following is the visual representation of the tabs block:
+
++-- .cke_dialog_tabs ------------------------------------+
+|  +-- .cke_dialog_tab --+ +-- .cke_dialog_tab --+ ...   |
+|  |                     | |                     |       |
+|  +---------------------+ +---------------------+       |
++--------------------------------------------------------+
+
+The .cke_dialog_tab_selected class is appended to the active tab.
+*/
+/* The main tabs container. */
+.cke_dialog_tabs {
+    height: 24px;
+    display: inline-block;
+    margin: 5px 0 0;
+    position: absolute;
+    z-index: 2;
+    left: 10px;
+}
+
+.cke_rtl .cke_dialog_tabs {
+    right: 10px;
+}
+
+/* A single tab (an <a> element). */
+a.cke_dialog_tab {
+    height: 16px;
+    padding: 4px 8px;
+    margin-right: 3px;
+    display: inline-block;
+    cursor: pointer;
+    line-height: 16px;
+    outline: none;
+    color: #595959;
+    border: 1px solid #bfbfbf;
+    border-radius: 3px 3px 0 0;
+    background: #d4d4d4;
+    background-image: linear-gradient(top, #fafafa, #ededed);
+    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#fafafa', endColorstr='#ededed');
+}
+
+.cke_rtl a.cke_dialog_tab {
+    margin-right: 0;
+    margin-left: 3px;
+}
+
+/* A hover state of a regular inactive tab. */
+a.cke_dialog_tab:hover {
+    background: #ebebeb;
+    background: linear-gradient(to bottom, #ebebeb 0%, #dfdfdf 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#dfdfdf', GradientType=0);
+}
+
+a.cke_dialog_tab_selected {
+    background: #fff;
+    color: #383838;
+    border-bottom-color: #fff;
+    cursor: default;
+    filter: none;
+}
+
+/* A hover state for selected tab. */
+a.cke_dialog_tab_selected:hover {
+    background: #ededed;
+    background: linear-gradient(to bottom, #ededed 0%, #ffffff 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff', GradientType=0);
+}
+
+.cke_hc a.cke_dialog_tab:hover,
+.cke_hc a.cke_dialog_tab_selected {
+    border: 3px solid;
+    padding: 2px 6px;
+}
+
+a.cke_dialog_tab_disabled {
+    color: #bababa;
+    cursor: default;
+}
+
+/* The .cke_single_page class is appended to the dialog outer element in case
+   of dialogs that has no tabs. */
+.cke_single_page .cke_dialog_tabs {
+    display: none;
+}
+
+.cke_single_page .cke_dialog_contents {
+    padding-top: 5px;
+    margin-top: 0;
+    border-top: none;
+}
+
+/* The close button at the top of the dialog. */
+.cke_dialog_close_button {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA3klEQVR42u2QsQqDMBRFtYubkw4Ogptf4SJuDkFEjEQsKKEf5OrPdSqFfkKaNBcsiNjUOvfBxes9L4/kWda/1jVqXbXqDVbPbPx42vf9e9u2KgxDoX/ZAjFkYOgx3eDcNI3knKsoit5DGDwyMPQY32DbNqeUymEYVBzHAoJHBrZrEa7rXhhjEleG4JH9skxWluWzqioFwa92Yj4cBIEoikIRQiQEj2zPEOp5nsjzXGVZJh3H6SF4ZGDoMQ24pWmqkiTBtvtF3iMDQ49pwKS3/tDfboN1M5u+PeN0kB2rF8eyXLUlg+i6AAAAAElFTkSuQmCC);
+    background-repeat: no-repeat;
+    background-position: 0 0;
+    position: absolute;
+    cursor: pointer;
+    color: white;
+    text-align: center;
+    height: 20px;
+    width: 20px;
+    top: 5px;
+    z-index: 5;
+}
+
+.cke_hidpi .cke_dialog_close_button {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAACpElEQVR42u2Wy08TYRTFgchCg1AsTUiwLFnowigxMLQEKZApfT+HDi1tKQ0lPP4c41Ld+Ygro3+UG22iZXUT728yRYigtLS66ZeczNd7zzn33na+mQ4NDdZgDdZgXb3uK54rviheKx50oIX70tW+cL06Xq+era3J0cmJmJGI3PF4vmps4Rq6Bbho0K5ubAhenRYffWwY3zE4PDyU4+Njx8zj89HE4h90i3DgokHLHi88O+rgkWF8rtXrUtvbkz1Fo9GQxsEBTXzTtHGJxCAHBy4atHjg1c1PsGyVSqeValUqlYpU9VpXs/r+fruJpXPcJWLk4FRdDVo88Or2RozlbPu0VC7Lzs6OlPVaq9Wcyaamp2kiANg702qu7HLRoMXjpqchkras0+1iUYqKUqnkTFbd3ZUZv78J2BMjBwcuGrS9OpKbqXy+ZWO+ve0UYdLzKLo5OHDR9PapMDISTqtxwbalUCg4sHVvn/tMDg7cvjyZbk9OmtbWVsuyLMnn8xdAjBycfj4dg5lstknBbDZ7AcTIwelbcc/UVJNimUxG0un0BRAjB6cfTQQnfL5mTqfM5XK/FW+DHBy4vWwiOK5TZdzJk8mkg4Qilki0QMKNAThwx3v0TQQn1CiZSklKEY/HJaaIxmISMs3WrbExE7AnRg4OXDQTN2ziyV2vt8l08URCotGoRPQNF97clOVQqDU0PPzrbtc9MXJw4KJBiwde3Zz7DxGdiokwbRcPrq7ykLnsqJnk2k0AR6seeHX8Op6dm/thqlk4HBbTNGVDYaysXFX8rAk4cNE4WvXAq+PXsXd29u1KKCSh9XXhj8nTQOBvxc+agIsGLR7q9aabe2Bucmbm/cP5+ZbX7//ovvmuuwKq+YT2nt//Dq+bnITR/6QdrH+zfgLSA6aKhTkIkwAAAABJRU5ErkJggg==);
+    background-size: 16px;
+}
+
+.cke_dialog_close_button span {
+    display: none;
+}
+
+.cke_hc .cke_dialog_close_button span {
+    display: inline;
+    cursor: pointer;
+    font-weight: bold;
+    position: relative;
+    top: 3px;
+}
+
+.cke_ltr .cke_dialog_close_button {
+    right: 5px;
+}
+
+.cke_rtl .cke_dialog_close_button {
+    left: 6px;
+}
+
+.cke_dialog_close_button {
+    top: 4px;
+}
+
+/*
+Dialog UI Elements
+--------------------
+
+The remaining styles define the UI elements that can be used inside dialog
+contents.
+
+Most of the UI elements on dialogs contain a textual label. All of them share
+the same labelling structure, having the label text inside an element with
+.cke_dialog_ui_labeled_label and the element specific part inside the
+.cke_dialog_ui_labeled_content class.
+*/
+/* If an element is supposed to be disabled, the .cke_disabled class is
+   appended to it. */
+div.cke_disabled .cke_dialog_ui_labeled_content div * {
+    background-color: #ddd;
+    cursor: default;
+}
+
+/*
+Horizontal-Box and Vertical-Box
+---------------------------------
+
+There are basic layou element used by the editor to properly align elements in
+the dialog. They're basically tables that have each cell filled by UI elements.
+
+The following is the visual representation of a H-Box:
+
++-- .cke_dialog_ui_hbox --------------------------------------------------------------------------------+
+|  +-- .cke_dialog_ui_hbox_first --+ +-- .cke_dialog_ui_hbox_child --+ +-- .cke_dialog_ui_hbox_last --+ |
+|  +                               + +                               + +                              + |
+|  +-------------------------------+ +-------------------------------+ +------------------------------+ |
++-------------------------------------------------------------------------------------------------------+
+
+It is possible to have nested V/H-Boxes.
+*/
+.cke_dialog_ui_vbox table,
+.cke_dialog_ui_hbox table {
+    margin: auto;
+}
+
+.cke_dialog_ui_vbox_child {
+    padding: 5px 0px;
+}
+
+.cke_dialog_ui_hbox {
+    width: 100%;
+}
+
+.cke_dialog_ui_hbox_first,
+.cke_dialog_ui_hbox_child,
+.cke_dialog_ui_hbox_last {
+    vertical-align: top;
+}
+
+.cke_ltr .cke_dialog_ui_hbox_first,
+.cke_ltr .cke_dialog_ui_hbox_child {
+    padding-right: 10px;
+}
+
+.cke_rtl .cke_dialog_ui_hbox_first,
+.cke_rtl .cke_dialog_ui_hbox_child {
+    padding-left: 10px;
+}
+
+.cke_ltr .cke_dialog_footer_buttons .cke_dialog_ui_hbox_first,
+.cke_ltr .cke_dialog_footer_buttons .cke_dialog_ui_hbox_child {
+    padding-right: 5px;
+}
+
+.cke_rtl .cke_dialog_footer_buttons .cke_dialog_ui_hbox_first,
+.cke_rtl .cke_dialog_footer_buttons .cke_dialog_ui_hbox_child {
+    padding-left: 5px;
+    padding-right: 0;
+}
+
+/* Applies to all labeled dialog fields */
+.cke_hc div.cke_dialog_ui_input_text,
+.cke_hc div.cke_dialog_ui_input_password,
+.cke_hc div.cke_dialog_ui_input_textarea,
+.cke_hc div.cke_dialog_ui_input_select,
+.cke_hc div.cke_dialog_ui_input_file {
+    border: 1px solid;
+}
+
+/*
+Text Input
+------------
+
+The basic text field to input text.
+
++-- .cke_dialog_ui_text --------------------------+
+|  +-- .cke_dialog_ui_labeled_label ------------+ |
+|  |                                            | |
+|  +--------------------------------------------+ |
+|  +-- .cke_dialog_ui_labeled_content ----------+ |
+|  | +-- div.cke_dialog_ui_input_text --------+ | |
+|  | | +-- input.cke_dialog_ui_input_text --+ | | |
+|  | | |                                    | | | |
+|  | | +------------------------------------+ | | |
+|  | +----------------------------------------+ | |
+|  +--------------------------------------------+ |
++-------------------------------------------------+
+*/
+/*
+Textarea
+----------
+
+The textarea field to input larger text.
+
++-- .cke_dialog_ui_textarea --------------------------+
+|  +-- .cke_dialog_ui_labeled_label ----------------+ |
+|  |                                                | |
+|  +------------------------------------------------+ |
+|  +-- .cke_dialog_ui_labeled_content --------------+ |
+|  | +-- div.cke_dialog_ui_input_textarea --------+ | |
+|  | | +-- input.cke_dialog_ui_input_textarea --+ | | |
+|  | | |                                        | | | |
+|  | | +----------------------------------------+ | | |
+|  | +--------------------------------------------+ | |
+|  +------------------------------------------------+ |
++-----------------------------------------------------+
+*/
+textarea.cke_dialog_ui_input_textarea {
+    overflow: auto;
+    resize: none;
+}
+
+input.cke_dialog_ui_input_text,
+input.cke_dialog_ui_input_password,
+textarea.cke_dialog_ui_input_textarea {
+    background-color: #fff;
+    border: 1px solid #c9cccf;
+    border-top-color: #aeb3b9;
+    padding: 4px 6px;
+    outline: none;
+    width: 100%;
+    *width: 95%;
+    box-sizing: border-box;
+    border-radius: 3px;
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) inset;
+}
+
+input.cke_dialog_ui_input_text:hover,
+input.cke_dialog_ui_input_password:hover,
+textarea.cke_dialog_ui_input_textarea:hover {
+    border: 1px solid #aeb3b9;
+    border-top-color: #a0a6ad;
+}
+
+input.cke_dialog_ui_input_text:focus,
+input.cke_dialog_ui_input_password:focus,
+textarea.cke_dialog_ui_input_textarea:focus,
+select.cke_dialog_ui_input_select:focus {
+    outline: none;
+    border: 1px solid #139ff7;
+    border-top-color: #1392e9;
+}
+
+/*
+Button
+--------
+
+The buttons used in the dialog footer or inside the contents.
+
++-- a.cke_dialog_ui_button -----------+
+|  +-- span.cke_dialog_ui_button --+  |
+|  |                               |  |
+|  +-------------------------------+  |
++-------------------------------------+
+*/
+/* The outer part of the button. */
+a.cke_dialog_ui_button {
+    line-height: 1.8;
+    height: 25px;
+    background-color: #266d9c;
+    text-shadow: 1px 1px 0 #0b4a74;
+}
+
+/* Special class appended to the Ok button. */
+/* A special container that holds the footer buttons. */
+.cke_dialog_footer_buttons {
+    display: inline-table;
+    margin: 5px;
+    width: auto;
+    position: relative;
+    vertical-align: middle;
+}
+
+/*
+Styles for other dialog element types.
+*/
+div.cke_dialog_ui_input_select {
+    display: table;
+}
+
+select.cke_dialog_ui_input_select {
+    height: 24px;
+    line-height: 24px;
+    background-color: #fff;
+    border: 1px solid #c9cccf;
+    border-top-color: #aeb3b9;
+    padding: 2px 6px;
+    outline: none;
+    border-radius: 3px;
+    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15) inset;
+}
+
+.cke_dialog_ui_input_file {
+    width: 100%;
+    height: 25px;
+}
+
+.cke_hc .cke_dialog_ui_labeled_content input:focus,
+.cke_hc .cke_dialog_ui_labeled_content select:focus,
+.cke_hc .cke_dialog_ui_labeled_content textarea:focus {
+    outline: 1px dotted;
+}
+
+/*
+ * Some utility CSS classes for dialog authors.
+ */
+.cke_dialog .cke_centered {
+    text-align: center;
+}
+
+.cke_dialog a.cke_btn_reset {
+    float: right;
+    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABfUlEQVR42mNgoAMQB+I+IGYl1wAJZ2fn/0D6JBArEKtJH4izgXgmBwfHvJKSkv9RUVH/2djY3gPFAvFp5ADiiYKCgv8MDAz+u7i4gHF6ejoYJyQk/Ofj4wO5xgWXAZstLS3/p6WlgWz84OjoeMDPz+8aSGNcXNz/4ODgz0A14bg0J9vY2ICdKi8vPxnI54SFQUxMzH9gOFwBstVxup2Jiel0eHj4fx0dnd3ogaikpLQYSHPh1MzKyspiYWHxPTQ0FOS/GDRpRmJCXQAUVYGBgSADvPCoWwvEF4A4FzPe9PUf+fr6ggzowKFZBKjmt729PUhNFIYsDw/PYk9Pz/8qKirfgVwjZDlmZmZQKlwbEBDw39XV9ReuBCVhbW392svLCxTXP0HpAYgjgLgAaMAFKyur/yA5Xl7eanxh4WRsbPwKlHj09PT+Kyoq/tfU1PwPil47O7v/YmJiC0EOIhSgYtzc3PM0NDRuOzk5/QP6+SMwXRwCioeQk5G4CEUjABiqcWIPOk11AAAAAElFTkSuQmCC) top left no-repeat;
+    width: 16px;
+    height: 16px;
+    border: 1px none;
+    font-size: 1px;
+}
+
+.cke_hidpi .cke_dialog a.cke_btn_reset {
+    background-size: 16px;
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAETElEQVR42u1W3U/bVRhuaWkplI910gIb0t8KWbGoTSi1tBT6Qb9LS1tKKbR8UwgwzIzRJRoTb/z6AyTR3XBhvHA3Xpi4meASvXLGCxMTEy8WzXRZ4i42NcHom/i8v7SYbNHSlm1eeJInp+d3znue533Ped8eieT/djxtAHgZqHtUAswjbjdJlcpP8Fv3SAS8cOECZefmqE6p/Aljz0MX8Oz587Szs0OF9XXqOH36D3x7FZA9KEIp0AdEAZtMofBvb2/T2toaFQoF2traopHRUZLU13+K+a7jIu0HXgOuIMy3dV1d1G8yUY8gkB7Y2NigpaUlEaurq7S5uUnp6WlSNDXdgk2gFmK+2c+3tbf/5nA6aTKZFMO8fe6c6CkTrWO8vLxMCwsLh1jCmNetIiod3d1/Yo/XJSdPyisl78PN/mzQahU34xAz0SK8XFhcPCSbn5+nfD5PuVzuEDwWhays0DwiImttfUui0VQkwNDU1nYnNTUlnusiCJkoh43nQDALzDEpk/N3HiMLSuB1eQiIp9O3JQ0NsYovWUNLy/4KPOZQ5ouknGaxZPKXp222fa0gvKnUaFa6e3vfcHm9V1kEE88WweLcgcAX2Euo5ty3o7GYeKFKnqWzWXpyaOgy5rrvWy2Xm9lbUeTsLKVmZuiMyfQ2ZpTVkJ/R9/Xd5TOexWZZEGexcYcgvPJvdYCPgj2fSCbvSJTKmVpu/YvT8IDJM+hnIMDhdu8Xc/8fBWQhwBMMfo3fxtoqjFr9QQakmUxGzGOc+QE+68tVQv3AwB76xpqrzeNnz15PpdM0hdufSKXoKav1y7JGjY3y46p27Z5AgDj1UiBnAWqt9t2H+adiTxTJk6h4LAD1/KUq90oBu/egs5yRJoT0m0wkKAFw2ZWoVO9VRa9QfGSx2cjmcNAzdjv1m80HR0pL8/Dwd5GJCYrF4yKQft9Ulcsm048cwdJdMlks145k2Hbq1PvhaJRiiAQLwEuH/9ttFfL73D6faB8HuKg1abW7RzOtr38uBAETHAUWMTlJzRrNtxWk2IkTOt0PcdhNwJ73CQMSqXT5qOo77S7Xz+FIhKIQwh4Ew2GSq1SXMNdaxvYxeWPjx5GiHdtzNLHfDRZWwQugLjfm9VIwFCIWwpEYwVtA1dLyPeZC975+23t7uQ4kVc3NN514CfH6MESzvWt8nGATrfgSdRkMH/pQE0IsAptxKEPoBYOBlGr1XYT0KpZdBD6XKhS/8suIxYohxzq28weDpBOEvWprQqfF4bg57vdToCgkUowGh5g9HRwaolGX65CY53kdrx8HLHb79cpCf3/Tant6LtnHxsiLUPohxl8UFIR3JfC4NOfF7XdgvVav36uV/O8mk2UGh4dvjXk85ALcAAvygYx7d/E7HiZktlpvYH30QZRpLZ5WBeTzO3qj8Sub0/n7KEjRH/QYjdfUOt0u3gHLx+d1+aYCnqj21fOfaX8B/W75vG/o0t0AAAAASUVORK5CYII=);
+}
+
+.cke_rtl .cke_dialog a.cke_btn_reset {
+    float: left;
+}
+
+.cke_dialog a.cke_btn_locked,
+.cke_dialog a.cke_btn_unlocked {
+    float: left;
+    width: 16px;
+    height: 16px;
+    background-repeat: no-repeat;
+    border: none 1px;
+    font-size: 1px;
+}
+
+.cke_dialog a.cke_btn_locked .cke_icon {
+    display: none;
+}
+
+.cke_rtl .cke_dialog a.cke_btn_locked,
+.cke_rtl .cke_dialog a.cke_btn_unlocked {
+    float: right;
+}
+
+.cke_dialog a.cke_btn_locked {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABIUlEQVR42s2RQWqDUBRFM3NgVOJAqIqIEzEgDh0pKIgRNKiIGjeQ1WQ/WYLr6BI66+jV+5EirdLaUR88rve8+98H/+Hwn+sy9Tj126yXXYdFUXyVZfk+fb9A4fcsGU+n030JZj/+6rRt2++THL/g48x/riAIaA9f1nNqKssSwW+94M/V05qmUVVV1HUd9X1Pt9uNhmFgCg+OOXKrCzzPozzPqa5rapqG2rb9bHhwzJFbXeA4DqVpStfrld3kuu6D4zgVCg+OOXJbf5+SJKGiKNgCnudVcCg8OObIrS6wLIuiKKIsy9htgiA8JqxC4cExR251gaqq5Ps+hWFIcRzT+XwmSZKYwoNjjtzmMyqKwgK6rpNhGGSaJlN4cMw3n/Ev9QGQyJLlaCS9rQAAAABJRU5ErkJggg==);
+}
+
+.cke_dialog a.cke_btn_unlocked {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABIUlEQVR42s1RS2qEQBScnQujIgYXjoi4EQVxKVkoKBHHoOIPPyeY08xpspkj5BBZ5QJZZ/XSJUlgQAkz2eRB8fpVVVc33bvdf65HhmeGd4YXhsM1mx8YXhmeGO4VRTmKovh2bchFybJ8/LrJzXVn2/bHnx4lDEP6zXNmoC3Udf29Pq/u3u/31LYtTdNE8zxfANw4jtQ0DcG3GuD7PhVFQV3XUd/3NAzDDzAjHDp8qwGO41CWZVRV1XKS53knjuM0dMzgocO3GsBemdI0pbIslwCe5zXw6JjBQ4dvNcCyLIrjmPI8X04TBOHEaA0dM3jo8K0GaJpGQRBQFEWUJAm5rkuSJC0dM3jo8G1+o6qqi0HXdTIMg0zTXDpm8NA3v/GW+gQX/Yy8i1gxkgAAAABJRU5ErkJggg==);
+}
+
+.cke_hidpi .cke_dialog a.cke_btn_unlocked,
+.cke_hidpi .cke_dialog a.cke_btn_locked {
+    background-size: 16px;
+}
+
+.cke_hidpi .cke_dialog a.cke_btn_locked {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADBElEQVR42u2W204aURSGvdC0SZPaxFMa08ZK06qt2iiJRxAEBAdBzqhFiwFBqz6Cj+Jt730K3qJXPoFX3qyk6xsHAyPEMeBF0+7kT3bW+te319qOM/T0/F9/6XL19PVdDI6NXS2FQteIPTEz98yr8v3w8Obk7EyqJydSrlZNsSdGDs+znPxyaOhXsVKR6vHxnTi4UVYcD96uT/6jXJYjhVdUx0x8eio/z89NsSdGDg/ebt6EK1co3JSOjqRMEzqtEY//1nhe9dZSnhg5PHip6c4z0dt7UdKpSgouKzgSi3F4fwtnPzk8eKmhtuPz34yOXh0Ui1JUHZZKYk3ebuXx4KWG2o4bmF1evt4rFGT/4EB29vfFuvJ26y0evNRQ23EDa4Yh+d1d2dnbk0gyKY/58eClhtqOG1gNhyWTy5nybm4+CsRT91PbcQOBaFSyCkPsu+1vO/iIy1UDENcrzWazpmK690UishQMysL6epOIkYs1+KmFAQum49OHxsdriUxG0grJqHI6DWKfSqclkUq1FDm7HwYsmI4bYKKEwuqTdCpYMB03MOfxSGx7W1I6VVqLOxEMWDAdN/BtdVWi8bgkudY2anVQK8GABdP5y2dlRaKxmCT1IbIrZf2tU9YzgtinrCZa1cCC6biBr4uLEtGXSFw739bra1IiIWHDuH09PHypVjdiT4yc3Q8DFkzHDXxZWOAQs7hR9Qb6R0YuH3yJNFZvwF4HC6bjBibdbgnpWyyq/8NbW1v3iulV8kBZk9uXmxyexhoYsGA6buDz/LwENzbE0OJog0yoTtSuAXL1Q+uCAQum4wY+zc1JIBQSQ6+uUSZQD7D+/k2LmGEdbq+DBdNxAx9nZ8UfCEhYry6ir9cm6cfGHwzevhoYuH8I2RMjZ/fDgAXT+W+wmRnx6ZuL4gcCivSwJtXjLWpgwXTcwIfpafH6/RLUD0xL6ZWGbCLWzg8L5lN+gteWvF7x+HziWVvrTMqABfNJn+MXg4O191NT8m5y8k4TEw/lIAcD1pM+x//M+gOahgSuyle9EwAAAABJRU5ErkJggg==);
+}
+
+.cke_hidpi .cke_dialog a.cke_btn_unlocked {
+    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAC/UlEQVR42u2W20pbQRiFgyhtEWrBEyINVkurtpqigXhIYmISE3dMzNlDExvNWb3qXS+kfY6Ct73onU+RtxAKPoH0wpsfutbujiQx0lFJoLQDCyYz83//msOeicn0v/ylZcLU1fWx32z+vuDx/Fj0+S4GxsbOTD09J3pfm0smfXBweXh8LKVKRfKlki7WK2h7v79/iTHFdiX/kj86EiavIGGpXJYSk9fE31C2WJTHg4Pf2mHgiam393Mml/tZOjyUsmFGN4R6GaaKSF6APuTz0s6VMGOGX7Hnn1CfhEagLS0cPi9wS5A8VyhIKp2+7MSZqC99gVDoPI/kOZrASpi6u086/YVs7edyks1mZQ96Njp61mkDI9uZjGT29mQ3nRbL0tJFxy+JQDQq27u7srWzIyuaJh034Fxfl0Qqpcvu93fegCcYlCSSU6zfl2MfHB+v4poVm8cjttXVP2rR6xVXICAhbEEymdQVRp0mhicmqmQqZ2fySCIhUSgSiykrFo9LAolTmD3Fehwii0xlA5xRBLDaTB4qsshUNjDncEhoc1NimFUcwQ8RGWSRqWzgnd0uwXBYolzWW9QqUSuRQRaZygYsy8sSDIUkikPUrJix1zHsa9zYY9ZjholWMWSRqWzg7cKCBHCJhOF8E8vXoEhE/Jp29XRo6BRDrRTrbGNf83gyyCJT2cAbm41J9OB61Qz0DQ+f3niJ0FYz0BxHFpnKBqasVvHhFgviG97Y2LhWCEvJA2XMvLlY2ccx9TFkkEWmsoHX8/PiXVsTDcHBOulQzOg2A+yrJa2JDLLIVDbwam5OPLgFNSxdvXQgEhj731DYphnJm+PIIlPZwEuLRdy4gv1YugCu1wbhsXF7vVe9/f3Xh5B1trGveTwZZJGp/r97dlZcuLkYfEOEUkjWoFp7ixiyyFQ28GJmRpxut3jxwLQUltTXJLbdNp4sMpUN4E9nddHpFIfLJY6VlYcJDLLIvNNz/GhgoGqenpbnU1O/NTl5Uwp9ZJB1p+f4nym/ADm2xhhFbdXIAAAAAElFTkSuQmCC);
+}
+
+.cke_dialog .cke_btn_over {
+    border: outset 1px;
+    cursor: pointer;
+}
+
+/*
+The rest of the file contains style used on several common plugins. There is a
+tendency that these will be moved to the plugins code in the future.
+*/
+.cke_dialog .ImagePreviewBox {
+    border: 2px ridge black;
+    overflow: scroll;
+    height: 200px;
+    width: 300px;
+    padding: 2px;
+    background-color: white;
+}
+
+.cke_dialog .ImagePreviewBox table td {
+    white-space: normal;
+}
+
+.cke_dialog .ImagePreviewLoader {
+    position: absolute;
+    white-space: normal;
+    overflow: hidden;
+    height: 160px;
+    width: 230px;
+    margin: 2px;
+    padding: 2px;
+    opacity: 0.9;
+    filter: alpha(opacity=90);
+    background-color: #e4e4e4;
+}
+
+.cke_dialog .FlashPreviewBox {
+    white-space: normal;
+    border: 2px ridge black;
+    overflow: auto;
+    height: 160px;
+    width: 390px;
+    padding: 2px;
+    background-color: white;
+}
+
+.cke_dialog .cke_pastetext {
+    width: 346px;
+    height: 170px;
+}
+
+.cke_dialog .cke_pastetext textarea {
+    width: 340px;
+    height: 170px;
+    resize: none;
+}
+
+.cke_dialog iframe.cke_pasteframe {
+    width: 346px;
+    height: 130px;
+    background-color: white;
+    border: 1px solid #aeb3b9;
+    border-radius: 3px;
+}
+
+.cke_dialog .cke_hand {
+    cursor: pointer;
+}
+
+.cke_disabled {
+    color: #a0a0a0;
+}
+
+.cke_dialog_body .cke_label {
+    display: none;
+}
+
+.cke_dialog_body label {
+    display: inline;
+    margin-bottom: auto;
+    cursor: default;
+}
+
+.cke_dialog_body label.cke_required {
+    font-weight: bold;
+}
+
+a.cke_smile {
+    overflow: hidden;
+    display: block;
+    text-align: center;
+    padding: 0.3em 0;
+}
+
+a.cke_smile img {
+    vertical-align: middle;
+}
+
+a.cke_specialchar {
+    cursor: inherit;
+    display: block;
+    height: 1.25em;
+    padding: 0.2em 0.3em;
+    text-align: center;
+}
+
+a.cke_smile,
+a.cke_specialchar {
+    border: 1px solid transparent;
+}
+
+a.cke_smile:hover,
+a.cke_smile:focus,
+a.cke_smile:active,
+a.cke_specialchar:hover,
+a.cke_specialchar:focus,
+a.cke_specialchar:active {
+    background: #fff;
+    outline: 0;
+}
+
+a.cke_smile:hover,
+a.cke_specialchar:hover {
+    border-color: #888;
+}
+
+a.cke_smile:focus,
+a.cke_smile:active,
+a.cke_specialchar:focus,
+a.cke_specialchar:active {
+    border-color: #139FF7;
+}
+
+/**
+ * Styles specific to "cellProperties" dialog.
+ */
+.cke_dialog_contents a.colorChooser {
+    display: block;
+    margin-top: 6px;
+    margin-left: 10px;
+    width: 80px;
+}
+
+.cke_rtl .cke_dialog_contents a.colorChooser {
+    margin-right: 10px;
+}
+
+/* Compensate focus outline for some input elements. (#6200) */
+.cke_dialog_ui_checkbox_input:focus,
+.cke_dialog_ui_radio_input:focus,
+.cke_btn_over {
+    outline: 1px dotted #696969;
+}
+
+.cke_iframe_shim {
+    display: block;
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: -1;
+    filter: alpha(opacity=0);
+    width: 100%;
+    height: 100%;
+}
+
+/*# sourceMappingURL=dialog.css.map */