120 files changed, 3865 insertions, 0 deletions
diff --git a/sources/skins/moonocolor/colorpanel.css b/sources/skins/moonocolor/colorpanel.css
new file mode 100644
index 0000000..7292371
--- /dev/null
+++ b/sources/skins/moonocolor/colorpanel.css
@@ -0,0 +1,127 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+colorpanel.css (part of editor.css)
+=====================================
+The color panel is related to the contents part of the panels that are
+displayed when clicking the color buttons of the toolbar. See panels.css for
+styles related to the outer part of panels.
+The following is the visual representation of the color panel contents:
+-- .cke_panel_block.cke_colorblock --+
+| +-- a.cke_colorauto --------------+ |
+| |                                 | |
+| |         AUTOMATIC COLOR         | |
+| |                                 | |
+| +---------------------------------+ |
+| +-- table ------------------------+ |
+| |                                 | |
+| |          COLOR PALETTE          | |
+| |                                 | |
+| |---------------------------------| |
+| |          "More Colors"          | |
+| +---------------------------------+ |
+-------------------------------------+
+The AUTOMATIC COLOR section is an <a> containing a table with two cells with
+the following contents:
+-- TD -----------------+ +-- TD -----------------+
+| +-- .cke_colorbox --+ | |                       |
+| |                   | | |      "Automatic"      |
+| +-------------------+ | |                       |
+-----------------------+ +-----------------------+
+The COLOR PALETTE section instead is a table with a variable number of cells
+(by default 8). Each cell represents a color box, with the following structure:
+-- A.cke_colorbox ---------+
+| +-- SPAN.cke_colorbox --+ |
+| |                       | |
+| +-----------------------+ |
+---------------------------+
+*/
+/* The container of the color palette. */
+.cke_colorblock
+{
+        padding: 3px;
+        font-size: 11px;
+        font-family: 'Microsoft Sans Serif', Tahoma, Arial, Verdana, Sans-Serif;
+}
+.cke_colorblock,
+.cke_colorblock a
+{
+        text-decoration: none;
+        color: #000;
+}
+/* The box which is to represent a single color on the color palette.
+   It is a small, square-shaped element which can be selected from the palette. */
+span.cke_colorbox
+{
+        width: 10px;
+        height: 10px;
+        border: #808080 1px solid;
+        float: left;
+}
+.cke_rtl span.cke_colorbox
+{
+        float: right;
+}
+/* The wrapper of the span.cke_colorbox. It provides an extra border and padding. */
+a.cke_colorbox
+{
+        border: #fff 1px solid;
+        padding: 2px;
+        float: left;
+        width: 12px;
+        height: 12px;
+}
+.cke_rtl a.cke_colorbox
+{
+        float: right;
+}
+/* Different states of the a.cke_colorbox wrapper. */
+a:hover.cke_colorbox,
+a:focus.cke_colorbox,
+a:active.cke_colorbox
+{
+        border: #b6b6b6 1px solid;
+        background-color: #e5e5e5;
+}
+/* Buttons which are visible at the top/bottom of the color palette:
+   - cke_colorauto (TOP) applies the automatic color.
+   - cke_colormore (BOTTOM) executes the color dialog.
+*/
+a.cke_colorauto,
+a.cke_colormore
+{
+        border: #fff 1px solid;
+        padding: 2px;
+        display: block;
+        cursor: pointer;
+}
+/* Different states of cke_colorauto/cke_colormore buttons. */
+a:hover.cke_colorauto,
+a:hover.cke_colormore,
+a:focus.cke_colorauto,
+a:focus.cke_colormore,
+a:active.cke_colorauto,
+a:active.cke_colormore
+{
+        border: #b6b6b6 1px solid;
+        background-color: #e5e5e5;
+}
diff --git a/sources/skins/moonocolor/dialog.css b/sources/skins/moonocolor/dialog.css
new file mode 100644
index 0000000..2e5eb01
--- /dev/null
+++ b/sources/skins/moonocolor/dialog.css
@@ -0,0 +1,1060 @@
+/*
+Copyright (c) 2003-2015, 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.
+*/
+/* 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;
+}
+/* The inner boundary container. */
+.cke_dialog_body
+{
+        z-index: 1;
+        background: #eaeaea;
+        border: 1px solid #b2b2b2;
+        border-bottom-color: #999;
+        border-radius: 3px;
+        box-shadow: 0 0 3px rgba(0, 0, 0, .15);
+}
+/* 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-weight: bold;
+        font-size: 13px;
+        cursor: move;
+        position: relative;
+        color: #474747;
+        text-shadow: 0 1px 0 rgba(255,255,255,.75);
+        border-bottom: 1px solid #999;
+        padding: 6px 10px;
+        border-radius: 2px 2px 0 0;
+        box-shadow: 0 1px 0 #fff inset;
+        background: #cfd1cf;
+        background-image: linear-gradient(to bottom, #f5f5f5, #cfd1cf);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f5f5f5', endColorstr='#cfd1cf');
+}
+.cke_dialog_spinner
+{
+        border-radius: 50%;
+        width: 12px;
+        height: 12px;
+        overflow: hidden;
+        text-indent: -9999em;
+        border-top: 2px solid rgba(102, 102, 102, 0.2);
+        border-right: 2px solid rgba(102, 102, 102, 0.2);
+        border-bottom: 2px solid rgba(102, 102, 102, 0.2);
+        border-left: 2px solid rgba(102, 102, 102, 1);
+        -webkit-animation: dialog_spinner 1s infinite linear;
+        animation: dialog_spinner 1s infinite linear;
+}
+/* A GIF fallback for IE8 and IE9 which does not support CSS animations. */
+.cke_browser_ie8 .cke_dialog_spinner,
+.cke_browser_ie9 .cke_dialog_spinner
+{
+        background: url(images/spinner.gif) center top no-repeat;
+        width: 16px;
+        height: 16px;
+        border: 0;
+}
+@-webkit-keyframes dialog_spinner
+{
+        0% {
+                -webkit-transform: rotate(0deg);
+                transform: rotate(0deg);
+        }
+        100% {
+                -webkit-transform: rotate(360deg);
+                transform: rotate(360deg);
+        }
+}
+@keyframes dialog_spinner
+{
+        0% {
+                -webkit-transform: rotate(0deg);
+                transform: rotate(0deg);
+        }
+        100% {
+                -webkit-transform: rotate(360deg);
+                transform: rotate(360deg);
+        }
+}
+/* The outer part of the dialog contants, which contains the contents body
+   and the footer. */
+.cke_dialog_contents
+{
+        background-color: #fff;
+        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: none;
+        outline: 1px solid #bfbfbf;
+        box-shadow: 0 1px 0 #fff inset;
+        border-radius: 0 0 2px 2px;
+        background: #cfd1cf;
+        background-image: linear-gradient(to bottom, #ebebeb, #cfd1cf);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ebebeb', endColorstr='#cfd1cf');
+}
+.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(to bottom, #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,
+a.cke_dialog_tab:focus
+{
+        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,
+a.cke_dialog_tab_selected:focus,
+{
+        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:focus,
+.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. */
+a.cke_dialog_close_button
+{
+        background-image: url(images/close.png);
+        background-repeat: no-repeat;
+        background-position: 50%;
+        position: absolute;
+        cursor: pointer;
+        text-align: center;
+        height: 20px;
+        width: 20px;
+        top: 4px;
+        z-index: 5;
+        opacity: 0.8;
+        filter: alpha(opacity = 80);
+}
+.cke_dialog_close_button:hover
+{
+        opacity: 1;
+        filter: alpha(opacity = 100);
+}
+.cke_hidpi .cke_dialog_close_button
+{
+        background-image: url(images/hidpi/close.png);
+        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,.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
+{
+        display: inline-block;
+        *display: inline;
+        *zoom: 1;
+        padding: 4px 0;
+        margin: 0;
+        text-align: center;
+        color: #333;
+        vertical-align: middle;
+        cursor: pointer;
+        border: 1px solid #b6b6b6;
+        border-bottom-color: #999;
+        border-radius: 3px;
+        box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;
+        background: #e4e4e4;
+        background-image: linear-gradient(to bottom, #ffffff, #e4e4e4);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ffffff', endColorstr='#e4e4e4');
+}
+span.cke_dialog_ui_button
+{
+        padding: 0 10px;
+}
+a.cke_dialog_ui_button:hover
+{
+        border-color: #9e9e9e;
+        background: #ccc;
+        background-image: linear-gradient(to bottom, #f2f2f2, #ccc);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f2f2f2', endColorstr='#cccccc');
+}
+/*      :focus/:active styles for dialog buttons: regular and footer. */
+a.cke_dialog_ui_button:focus,
+a.cke_dialog_ui_button:active
+{
+        border-color: #969696;
+        outline: none;
+        box-shadow: 0 0 6px rgba(0,0,0,.4) inset;
+}
+.cke_hc a.cke_dialog_ui_button:hover,
+.cke_hc a.cke_dialog_ui_button:focus,
+.cke_hc a.cke_dialog_ui_button:active
+{
+        border: 3px solid;
+        padding-top: 1px;
+        padding-bottom: 1px;
+}
+.cke_hc a.cke_dialog_ui_button:hover span,
+.cke_hc a.cke_dialog_ui_button:focus span,
+.cke_hc a.cke_dialog_ui_button:active span
+{
+        padding-left: 10px;
+        padding-right: 10px;
+}
+/*
+a.cke_dialog_ui_button[style*="width"]
+{
+        display: block !important;
+        width: auto !important;
+}
+*/
+/* The inner part of the button (both in dialog tabs and dialog footer). */
+.cke_dialog_footer_buttons a.cke_dialog_ui_button span
+{
+        color: inherit;
+        font-size: 12px;
+        font-weight: bold;
+        line-height: 18px;
+        padding: 0 12px;
+}
+/* Special class appended to the Ok button. */
+a.cke_dialog_ui_button_ok
+{
+        color: #fff;
+        text-shadow: 0 -1px 0 #55830c;
+        border-color: #62a60a #62a60a #4d9200;
+        background: #69b10b;
+        background-image: linear-gradient(to bottom, #9ad717, #69b10b);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#9ad717', endColorstr='#69b10b');
+}
+a.cke_dialog_ui_button_ok:hover
+{
+        border-color: #5b9909 #5b9909 #478500;
+        background: #88be14;
+        background: linear-gradient(to bottom, #88be14 0%,#5d9c0a 100%);
+        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#88be14', endColorstr='#5d9c0a',GradientType=0 );
+}
+a.cke_dialog_ui_button_ok.cke_disabled {
+        border-color: #7D9F51;
+        background: #8DAD62;
+        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B3D271), to(#8DAD62));
+        background-image: -webkit-linear-gradient(top, #B3D271, #8DAD62);
+        background-image: -o-linear-gradient(top, #B3D271, #8DAD62);
+        background-image: linear-gradient(to bottom, #B3D271, #8DAD62);
+        background-image: -moz-linear-gradient(top, #B3D271, #8DAD62);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#B3D271', endColorstr='#8DAD62');
+}
+a.cke_dialog_ui_button_ok.cke_disabled span {
+        color: #E0E8D1;
+}
+/* Default text shadow used for inner parts of all dialog buttons (both in dialog tabs and dialog footer). */
+a.cke_dialog_ui_button span
+{
+        text-shadow: 0 1px 0 #fff;
+}
+/* Text shadow used for inner part of OK dialog button in footer. */
+a.cke_dialog_ui_button_ok span
+{
+        text-shadow: 0 -1px 0 #55830c;
+}
+span.cke_dialog_ui_button
+{
+        cursor: pointer;
+}
+/*      :focus/:active styles for dialog footer buttons (ok & cancel) */
+a.cke_dialog_ui_button_ok:focus,
+a.cke_dialog_ui_button_ok:active,
+a.cke_dialog_ui_button_cancel:focus,
+a.cke_dialog_ui_button_cancel:active
+{
+        border-width: 2px;
+        padding: 3px 0;
+}
+a.cke_dialog_ui_button_ok:focus,
+a.cke_dialog_ui_button_ok:active
+{
+        border-color: #568C0A;
+}
+a.cke_dialog_ui_button_ok.cke_disabled:focus,
+a.cke_dialog_ui_button_ok.cke_disabled:active
+{
+        border-color: #6F8C49;
+}
+/*      :focus/:active styles for dialog footer buttons (ok & cancel) spans */
+a.cke_dialog_ui_button_ok:focus span,
+a.cke_dialog_ui_button_ok:active span,
+a.cke_dialog_ui_button_cancel:focus span,
+a.cke_dialog_ui_button_cancel:active span
+{
+        padding: 0 11px;        /* Thick button border must be compensated. */
+}
+/* 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: 25px;
+        line-height: 25px;
+        background-color: #fff;
+        border: 1px solid #c9cccf;
+        border-top-color: #aeb3b9;
+        padding: 3px 3px 3px 6px;
+        outline: none;
+        border-radius: 3px;
+        box-shadow: 0 1px 2px rgba(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_dark_background
+{
+        background-color: #DEDEDE;
+}
+.cke_dialog .cke_light_background
+{
+        background-color: #EBEBEB;
+}
+.cke_dialog .cke_centered
+{
+        text-align: center;
+}
+.cke_dialog a.cke_btn_reset
+{
+        float: right;
+        background: url(images/refresh.png) 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(images/hidpi/refresh.png);
+}
+.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(images/lock.png);
+}
+.cke_dialog a.cke_btn_unlocked
+{
+        background-image: url(images/lock-open.png);
+}
+.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(images/hidpi/lock.png);
+}
+.cke_hidpi .cke_dialog a.cke_btn_unlocked {
+        background-image: url(images/hidpi/lock-open.png);
+}
+.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%;
+}
diff --git a/sources/skins/moonocolor/dialog_ie.css b/sources/skins/moonocolor/dialog_ie.css
new file mode 100644
index 0000000..ca02a47
--- /dev/null
+++ b/sources/skins/moonocolor/dialog_ie.css
@@ -0,0 +1,62 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+dialog_ie.css
+===============
+This file contains styles to used by all versions of Internet Explorer only.
+*/
+/* Base it on dialog.css, overriding it with styles defined in this file. */
+@import url("dialog.css");
+/* IE doesn't leave enough padding in text input for cursor to blink in RTL. (#6087) */
+.cke_rtl input.cke_dialog_ui_input_text,
+.cke_rtl input.cke_dialog_ui_input_password
+{
+        padding-right: 2px;
+}
+/* Compensate the padding added above on container. */
+.cke_rtl div.cke_dialog_ui_input_text,
+.cke_rtl div.cke_dialog_ui_input_password
+{
+        padding-left: 2px;
+}
+.cke_rtl div.cke_dialog_ui_input_text {
+        padding-right: 1px;
+}
+.cke_rtl .cke_dialog_ui_vbox_child,
+.cke_rtl .cke_dialog_ui_hbox_child,
+.cke_rtl .cke_dialog_ui_hbox_first,
+.cke_rtl .cke_dialog_ui_hbox_last
+{
+        padding-right: 2px !important;
+}
+/* Disable filters for HC mode. */
+.cke_hc .cke_dialog_title,
+.cke_hc .cke_dialog_footer,
+.cke_hc a.cke_dialog_tab,
+.cke_hc a.cke_dialog_ui_button,
+.cke_hc a.cke_dialog_ui_button:hover,
+.cke_hc a.cke_dialog_ui_button_ok,
+.cke_hc a.cke_dialog_ui_button_ok:hover
+{
+    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
+/*      Remove border from dialog field wrappers in HC
+        to avoid double borders. */
+.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: 0;
+}
diff --git a/sources/skins/moonocolor/dialog_ie7.css b/sources/skins/moonocolor/dialog_ie7.css
new file mode 100644
index 0000000..29ac5d0
--- /dev/null
+++ b/sources/skins/moonocolor/dialog_ie7.css
@@ -0,0 +1,68 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+dialog_ie7.css
+===============
+This file contains styles to used by Internet Explorer 7 only.
+*/
+/* Base it on dialog_ie.css, overriding it with styles defined in this file. */
+@import url("dialog_ie.css");
+.cke_dialog_title
+{
+        /* gradient fix */
+        zoom: 1;
+}
+.cke_dialog_footer
+{
+        /* IE7 ignores footer's outline. Use border instead. */
+        border-top: 1px solid #bfbfbf;
+}
+/* IE7 needs position static #6806 */
+.cke_dialog_footer_buttons
+{
+        position: static;
+}
+/* IE7 crops the bottom pixels of footer buttons (#9491) */
+.cke_dialog_footer_buttons a.cke_dialog_ui_button
+{
+        vertical-align: top;
+}
+/* IE7 margin loose on float. */
+.cke_dialog .cke_resizer_ltr
+{
+        padding-left: 4px;
+}
+.cke_dialog .cke_resizer_rtl
+{
+        padding-right: 4px;
+}
+/*      IE7 doesn't support box-sizing and therefore we cannot
+        have sexy inputs which go well with the layout. */
+.cke_dialog_ui_input_text,
+.cke_dialog_ui_input_password,
+.cke_dialog_ui_input_textarea,
+.cke_dialog_ui_input_select
+{
+        padding: 0 !important;
+}
+/* Predefined border to avoid visual size change impact. */
+.cke_dialog_ui_checkbox_input,
+.cke_dialog_ui_ratio_input,
+.cke_btn_reset,
+.cke_btn_locked,
+.cke_btn_unlocked
+{
+        border: 1px solid transparent !important;
+}
diff --git a/sources/skins/moonocolor/dialog_ie8.css b/sources/skins/moonocolor/dialog_ie8.css
new file mode 100644
index 0000000..1a7a36c
--- /dev/null
+++ b/sources/skins/moonocolor/dialog_ie8.css
@@ -0,0 +1,24 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+dialog_ie8.css
+===============
+This file contains styles to used by Internet Explorer 8 only.
+*/
+/* Base it on dialog_ie.css, overriding it with styles defined in this file. */
+@import url("dialog_ie.css");
+/*      Without the following, IE8 cannot compensate footer button thick borders
+        on :focus/:active. */
+a.cke_dialog_ui_button_ok:focus span,
+a.cke_dialog_ui_button_ok:active span,
+a.cke_dialog_ui_button_cancel:focus span,
+a.cke_dialog_ui_button_cancel:active span
+{
+        display: block;
+}
diff --git a/sources/skins/moonocolor/dialog_iequirks.css b/sources/skins/moonocolor/dialog_iequirks.css
new file mode 100644
index 0000000..9f27a99
--- /dev/null
+++ b/sources/skins/moonocolor/dialog_iequirks.css
@@ -0,0 +1,21 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+dialog_ie7.css
+===============
+This file contains styles to used by Internet Explorer in
+Quirks mode only.
+*/
+/* Base it on dialog_ie.css, overriding it with styles defined in this file. */
+@import url("dialog_ie.css");
+/* [IE7-8] Filter on footer causes background artifacts when opening dialog. */
+.cke_dialog_footer
+{
+        filter: "";
+}
diff --git a/sources/skins/moonocolor/editor.css b/sources/skins/moonocolor/editor.css
new file mode 100644
index 0000000..9d32984
--- /dev/null
+++ b/sources/skins/moonocolor/editor.css
@@ -0,0 +1,69 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+editor.css
+============
+This is he heart of the skin system. This is the file loaded by the editor to
+style all elements inside its main interface.
+To make it easier to maintain, instead of including all styles here, we import
+other files.
+*/
+/* "Reset" styles, necessary to avoid the editor UI being broken by external CSS. */
+@import url("reset.css");
+/* Styles the main interface structure (holding box). */
+@import url("mainui.css");
+/* Styles all "panels", which are the floating elements that appear when
+   opening toolbar combos, menu buttons, context menus, etc. */
+@import url("panel.css");
+/* Styles the color panel displayed by the color buttons. */
+@import url("colorpanel.css");
+/* Styles to toolbar. */
+@import url("toolbar.css");
+/* Styles menus, which are lists of selectable items (context menu, menu button). */
+@import url("menu.css");
+/* Styles toolbar combos. */
+@import url("richcombo.css");
+/* Styles the elements path bar, available at the bottom of the editor UI.*/
+@import url("elementspath.css");
+/* Contains hard-coded presets for "configurable-like" options of the UI
+   (e.g. display labels on specific buttons) */
+@import url("presets.css");
+/* Styles for notifications. */
+@import url("notification.css");
+/* Important!
+   To avoid showing the editor UI while its styles are still not available, the
+   editor creates it with visibility:hidden. Here, we restore the UI visibility. */
+.cke_chrome
+{
+        visibility: inherit;
+}
+/* For accessibility purposes, several "voice labels" are present in the UI.
+   These are usually <span> elements that show not be visible, but that are
+   used by screen-readers to announce other elements. Here, we hide these
+   <spans>, in fact. */
+.cke_voice_label
+{
+        display: none;
+}
+legend.cke_voice_label
+{
+        display: none;
+}
diff --git a/sources/skins/moonocolor/editor_gecko.css b/sources/skins/moonocolor/editor_gecko.css
new file mode 100644
index 0000000..af24488
--- /dev/null
+++ b/sources/skins/moonocolor/editor_gecko.css
@@ -0,0 +1,25 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+editor_gecko.css
+==================
+This file contains styles to used by all Gecko based browsers (Firefox) only.
+*/
+/* Base it on editor.css, overriding it with styles defined in this file. */
+@import url("editor.css");
+.cke_bottom
+{
+        padding-bottom: 3px;
+}
+.cke_combo_text
+{
+        margin-bottom: -1px;
+        margin-top: 1px;
+}
diff --git a/sources/skins/moonocolor/editor_ie.css b/sources/skins/moonocolor/editor_ie.css
new file mode 100644
index 0000000..756098e
--- /dev/null
+++ b/sources/skins/moonocolor/editor_ie.css
@@ -0,0 +1,71 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+editor_ie.css
+===============
+This file contains styles to used by all versions of Internet Explorer only.
+*/
+/* Base it on editor.css, overriding it with styles defined in this file. */
+@import url("editor.css");
+a.cke_button_disabled,
+/* Those two are to overwrite the gradient filter since we cannot have both of them. */
+a.cke_button_disabled:hover,
+a.cke_button_disabled:focus,
+a.cke_button_disabled:active
+{
+        filter: alpha(opacity = 30);
+}
+/* PNG Alpha Transparency Fix For IE<9 */
+.cke_button_disabled .cke_button_icon
+{
+        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00ffffff, endColorstr=#00ffffff);
+}
+.cke_button_off:hover,
+.cke_button_off:focus,
+.cke_button_off:active
+{
+        filter: alpha(opacity = 100);
+}
+.cke_combo_disabled .cke_combo_inlinelabel,
+.cke_combo_disabled .cke_combo_open
+{
+        filter: alpha(opacity = 30);
+}
+.cke_toolbox_collapser
+{
+        border: 1px solid #a6a6a6;
+}
+.cke_toolbox_collapser .cke_arrow
+{
+        margin-top: 1px;
+}
+/* Gradient filters must be removed for HC mode to reveal the background. */
+.cke_hc .cke_top,
+.cke_hc .cke_bottom,
+.cke_hc .cke_combo_button,
+.cke_hc a.cke_combo_button:hover,
+.cke_hc a.cke_combo_button:focus,
+.cke_hc .cke_toolgroup,
+.cke_hc .cke_button_on,
+.cke_hc a.cke_button_off:hover,
+.cke_hc a.cke_button_off:focus,
+.cke_hc a.cke_button_off:active,
+.cke_hc .cke_toolbox_collapser,
+.cke_hc .cke_toolbox_collapser:hover,
+.cke_hc .cke_panel_grouptitle
+{
+        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
+}
diff --git a/sources/skins/moonocolor/editor_ie7.css b/sources/skins/moonocolor/editor_ie7.css
new file mode 100644
index 0000000..8d50ebc
--- /dev/null
+++ b/sources/skins/moonocolor/editor_ie7.css
@@ -0,0 +1,213 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+editor_ie7.css
+===============
+This file contains styles to used by Internet Explorer 7 only.
+*/
+/* Base it on editor_ie.css, overriding it with styles defined in this file. */
+@import url("editor_ie.css");
+.cke_rtl .cke_toolgroup,
+.cke_rtl .cke_toolbar_separator,
+.cke_rtl .cke_button,
+.cke_rtl .cke_button *,
+.cke_rtl .cke_combo,
+.cke_rtl .cke_combo *,
+.cke_rtl .cke_path_item,
+.cke_rtl .cke_path_item *,
+.cke_rtl .cke_path_empty
+{
+        float: none;
+}
+.cke_rtl .cke_toolgroup,
+.cke_rtl .cke_toolbar_separator,
+.cke_rtl .cke_combo_button,
+.cke_rtl .cke_combo_button *,
+.cke_rtl .cke_button,
+.cke_rtl .cke_button_icon
+{
+        display: inline-block;
+        vertical-align: top;
+}
+.cke_toolbox
+{
+        display:inline-block;
+        padding-bottom: 5px;
+        height: 100%;
+}
+.cke_rtl .cke_toolbox
+{
+        padding-bottom: 0;
+}
+.cke_toolbar
+{
+        margin-bottom: 5px;
+}
+.cke_rtl .cke_toolbar
+{
+        margin-bottom: 0;
+}
+/* IE7: toolgroup must be adapted to toolbar items height. */
+.cke_toolgroup
+{
+        height: 26px;
+}
+/* Avoid breaking elements that use background gradient when page zoom > 1 (#9548) */
+.cke_toolgroup,
+.cke_combo
+{
+        position: relative;
+}
+a.cke_button
+{
+        /* IE7: buttons must not float to wrap the toolbar in a whole. */
+        float:none;
+        /* IE7: buttons have to be aligned to top. Otherwise, some buttons like
+         * source and scayt are displayed a few pixels below the base line.
+         */
+        vertical-align:top;
+}
+.cke_toolbar_separator
+{
+        display: inline-block;
+        float: none;
+        vertical-align: top;
+        background-color: #c0c0c0;
+}
+.cke_toolbox_collapser .cke_arrow
+{
+        margin-top: 0;
+}
+.cke_toolbox_collapser .cke_arrow
+{
+        border-width:4px;
+}
+.cke_toolbox_collapser.cke_toolbox_collapser_min .cke_arrow
+{
+        border-width:3px;
+}
+.cke_rtl .cke_button_arrow
+{
+        padding-top: 8px;
+        margin-right: 2px;
+}
+.cke_rtl .cke_combo_inlinelabel
+{
+        display: table-cell;
+        vertical-align: middle;
+}
+/*
+ * Editor menus are display:table-driven. IE7 doesn't support this approach,
+ * hence this position&float hybrid fall-back.
+ */
+.cke_menubutton
+{
+        display: block;
+        height: 24px;
+}
+.cke_menubutton_inner
+{
+        display: block;
+        position: relative;
+}
+.cke_menubutton_icon
+{
+        height: 16px;
+        width: 16px;
+}
+.cke_menubutton_icon,
+.cke_menubutton_label,
+.cke_menuarrow
+{
+        display: inline-block;
+}
+.cke_menubutton_label
+{
+        width: auto;
+        vertical-align: top;
+        line-height: 24px;
+        height: 24px;
+        margin: 0 10px 0 0;
+}
+.cke_menuarrow
+{
+        width: 5px;
+        height: 6px;
+        padding: 0;
+        position: absolute;
+        right: 8px;
+        top: 10px;
+        background-position: 0 0;
+}
+/* Menus in RTL mode. */
+.cke_rtl .cke_menubutton_icon
+{
+        position: absolute;
+        right: 0px;
+        top: 0px;
+}
+.cke_rtl .cke_menubutton_label
+{
+        float: right;
+        clear: both;
+        margin: 0 24px 0 10px;
+}
+.cke_hc .cke_rtl .cke_menubutton_label
+{
+        margin-right: 0;
+}
+.cke_rtl .cke_menuarrow
+{
+        left: 8px;
+        right: auto;
+        background-position: 0 -24px;
+}
+.cke_hc .cke_menuarrow
+{
+        top: 5px;
+        padding: 0 5px;
+}
+.cke_rtl input.cke_dialog_ui_input_text,
+.cke_rtl input.cke_dialog_ui_input_password
+{
+        /* Positioning is required for IE7 on text inputs not to stretch dialog horizontally. (#8971)*/
+        position: relative;
+}
+/* Reset vertical paddings which put editing area under bottom UI space. (#9721) */
+.cke_wysiwyg_div
+{
+        padding-top: 0 !important;
+        padding-bottom: 0 !important;
+}
diff --git a/sources/skins/moonocolor/editor_ie8.css b/sources/skins/moonocolor/editor_ie8.css
new file mode 100644
index 0000000..864a542
--- /dev/null
+++ b/sources/skins/moonocolor/editor_ie8.css
@@ -0,0 +1,27 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+editor_ie8.css
+===============
+This file contains styles to used by Internet Explorer 8 only.
+*/
+/* Base it on editor_ie.css, overriding it with styles defined in this file. */
+@import url("editor_ie.css");
+.cke_toolbox_collapser .cke_arrow
+{
+        border-width:4px;
+}
+.cke_toolbox_collapser.cke_toolbox_collapser_min .cke_arrow
+{
+        border-width:3px;
+}
+.cke_toolbox_collapser .cke_arrow
+{
+        margin-top: 0;
+}
diff --git a/sources/skins/moonocolor/editor_iequirks.css b/sources/skins/moonocolor/editor_iequirks.css
new file mode 100644
index 0000000..b4efa0f
--- /dev/null
+++ b/sources/skins/moonocolor/editor_iequirks.css
@@ -0,0 +1,79 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+editor_iequirks.css
+===============
+This file contains styles to used by all versions of Internet Explorer
+in Quirks mode only.
+*/
+/* Base it on editor_ie.css, overriding it with styles defined in this file. */
+@import url("editor_ie.css");
+.cke_top,
+.cke_contents,
+.cke_bottom
+{
+        width: 100%; /* hasLayout = true */
+}
+.cke_button_arrow
+{
+        font-size: 0; /* Set minimal font size, so arrow won't be streched by the text that doesn't exist. */
+}
+/* Bring back toolbar buttons in RTL. */
+.cke_rtl .cke_toolgroup,
+.cke_rtl .cke_toolbar_separator,
+.cke_rtl .cke_button,
+.cke_rtl .cke_button *,
+.cke_rtl .cke_combo,
+.cke_rtl .cke_combo *,
+.cke_rtl .cke_path_item,
+.cke_rtl .cke_path_item *,
+.cke_rtl .cke_path_empty
+{
+        float: none;
+}
+.cke_rtl .cke_toolgroup,
+.cke_rtl .cke_toolbar_separator,
+.cke_rtl .cke_combo_button,
+.cke_rtl .cke_combo_button *,
+.cke_rtl .cke_button,
+.cke_rtl .cke_button_icon
+{
+        display: inline-block;
+        vertical-align: top;
+}
+/* Otherwise formatting toolbar breaks when editing a mixed content (#9893). */
+.cke_rtl .cke_button_icon
+{
+        float: none;
+}
+.cke_resizer
+{
+        width: 10px;
+}
+.cke_source
+{
+        white-space: normal;
+}
+.cke_bottom
+{
+        position: static; /* Without this bottom space doesn't move when resizing editor. */
+}
+.cke_colorbox
+{
+        font-size: 0; /* Set minimal font size, so button won't be streched by the text that doesn't exist. */
+}
diff --git a/sources/skins/moonocolor/elementspath.css b/sources/skins/moonocolor/elementspath.css
new file mode 100644
index 0000000..ccf579c
--- /dev/null
+++ b/sources/skins/moonocolor/elementspath.css
@@ -0,0 +1,76 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+elementspath.css (part of editor.css)
+=======================================
+This file styles the "Elements Path", whith is the list of element names
+present at the the bottom bar of the CKEditor interface.
+The following is a visual representation of its main elements:
+-- .cke_path ---------------------------------------------------------------+
+| +-- .cke_path_item ----+ +-- .cke_path_item ----+ +-- .cke_path_empty ---+ |
+| |                      | |                      | |                      | |
+| +----------------------+ +----------------------+ +----------------------+ |
+----------------------------------------------------------------------------+
+*/
+/* The box that holds the entire elements path. */
+.cke_path
+{
+        float: left;
+        margin: -2px 0 2px;
+}
+/* Each item of the elements path. */
+a.cke_path_item,
+/* Empty element available at the end of the elements path, to help us keeping
+   the proper box size when the elements path is empty. */
+span.cke_path_empty
+{
+        display: inline-block;
+        float: left;
+        padding: 3px 4px;
+        margin-right: 2px;
+        cursor: default;
+        text-decoration: none;
+        outline: 0;
+        border: 0;
+        color: #4c4c4c;
+        text-shadow: 0 1px 0 #fff;
+        font-weight: bold;
+        font-size: 11px;
+}
+.cke_rtl .cke_path,
+.cke_rtl .cke_path_item,
+.cke_rtl .cke_path_empty
+{
+        float: right;
+}
+/* The items are <a> elements, so we define its hover states here. */
+a.cke_path_item:hover,
+a.cke_path_item:focus,
+a.cke_path_item:active
+{
+        background-color: #bfbfbf;
+        color: #333;
+        text-shadow: 0 1px 0 rgba(255,255,255,.5);
+        border-radius: 2px;
+        box-shadow: 0 0 4px rgba(0,0,0,.5) inset, 0 1px 0 rgba(255,255,255,.5);
+}
+.cke_hc a.cke_path_item:hover,
+.cke_hc a.cke_path_item:focus,
+.cke_hc a.cke_path_item:active
+{
+        border: 2px solid;
+        padding: 1px 2px;
+}
diff --git a/sources/skins/moonocolor/icons/about.png b/sources/skins/moonocolor/icons/about.png
new file mode 100644
index 0000000..f22c6c7
--- /dev/null
+++ b/sources/skins/moonocolor/icons/about.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/anchor-rtl.png b/sources/skins/moonocolor/icons/anchor-rtl.png
new file mode 100644
index 0000000..1a7faf1
--- /dev/null
+++ b/sources/skins/moonocolor/icons/anchor-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/anchor.png b/sources/skins/moonocolor/icons/anchor.png
new file mode 100644
index 0000000..973a518
--- /dev/null
+++ b/sources/skins/moonocolor/icons/anchor.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/bgcolor.png b/sources/skins/moonocolor/icons/bgcolor.png
new file mode 100644
index 0000000..07074b7
--- /dev/null
+++ b/sources/skins/moonocolor/icons/bgcolor.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/bidiltr.png b/sources/skins/moonocolor/icons/bidiltr.png
new file mode 100644
index 0000000..7f82bc6
--- /dev/null
+++ b/sources/skins/moonocolor/icons/bidiltr.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/bidirtl.png b/sources/skins/moonocolor/icons/bidirtl.png
new file mode 100644
index 0000000..ca55b06
--- /dev/null
+++ b/sources/skins/moonocolor/icons/bidirtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/blockquote.png b/sources/skins/moonocolor/icons/blockquote.png
new file mode 100644
index 0000000..0ab06d5
--- /dev/null
+++ b/sources/skins/moonocolor/icons/blockquote.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/bold.png b/sources/skins/moonocolor/icons/bold.png
new file mode 100644
index 0000000..583a622
--- /dev/null
+++ b/sources/skins/moonocolor/icons/bold.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/bulletedlist-rtl.png b/sources/skins/moonocolor/icons/bulletedlist-rtl.png
new file mode 100644
index 0000000..ba0246e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/bulletedlist-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/bulletedlist.png b/sources/skins/moonocolor/icons/bulletedlist.png
new file mode 100644
index 0000000..03b447e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/bulletedlist.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/button.png b/sources/skins/moonocolor/icons/button.png
new file mode 100644
index 0000000..b3f337b
--- /dev/null
+++ b/sources/skins/moonocolor/icons/button.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/checkbox.png b/sources/skins/moonocolor/icons/checkbox.png
new file mode 100644
index 0000000..688673a
--- /dev/null
+++ b/sources/skins/moonocolor/icons/checkbox.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/copy-rtl.png b/sources/skins/moonocolor/icons/copy-rtl.png
new file mode 100644
index 0000000..ae2424c
--- /dev/null
+++ b/sources/skins/moonocolor/icons/copy-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/copy.png b/sources/skins/moonocolor/icons/copy.png
new file mode 100644
index 0000000..4476702
--- /dev/null
+++ b/sources/skins/moonocolor/icons/copy.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/creatediv.png b/sources/skins/moonocolor/icons/creatediv.png
new file mode 100644
index 0000000..6d12d33
--- /dev/null
+++ b/sources/skins/moonocolor/icons/creatediv.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/cut-rtl.png b/sources/skins/moonocolor/icons/cut-rtl.png
new file mode 100644
index 0000000..1505e60
--- /dev/null
+++ b/sources/skins/moonocolor/icons/cut-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/cut.png b/sources/skins/moonocolor/icons/cut.png
new file mode 100644
index 0000000..084196e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/cut.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/docprops-rtl.png b/sources/skins/moonocolor/icons/docprops-rtl.png
new file mode 100644
index 0000000..37641cb
--- /dev/null
+++ b/sources/skins/moonocolor/icons/docprops-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/docprops.png b/sources/skins/moonocolor/icons/docprops.png
new file mode 100644
index 0000000..a9378ce
--- /dev/null
+++ b/sources/skins/moonocolor/icons/docprops.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/find-rtl.png b/sources/skins/moonocolor/icons/find-rtl.png
new file mode 100644
index 0000000..915ed67
--- /dev/null
+++ b/sources/skins/moonocolor/icons/find-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/find.png b/sources/skins/moonocolor/icons/find.png
new file mode 100644
index 0000000..297c393
--- /dev/null
+++ b/sources/skins/moonocolor/icons/find.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/flash.png b/sources/skins/moonocolor/icons/flash.png
new file mode 100644
index 0000000..9332fb9
--- /dev/null
+++ b/sources/skins/moonocolor/icons/flash.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/form.png b/sources/skins/moonocolor/icons/form.png
new file mode 100644
index 0000000..03ee607
--- /dev/null
+++ b/sources/skins/moonocolor/icons/form.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/hiddenfield.png b/sources/skins/moonocolor/icons/hiddenfield.png
new file mode 100644
index 0000000..0b78e4a
--- /dev/null
+++ b/sources/skins/moonocolor/icons/hiddenfield.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/horizontalrule.png b/sources/skins/moonocolor/icons/horizontalrule.png
new file mode 100644
index 0000000..eed81b3
--- /dev/null
+++ b/sources/skins/moonocolor/icons/horizontalrule.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/iframe.png b/sources/skins/moonocolor/icons/iframe.png
new file mode 100644
index 0000000..5a83d90
--- /dev/null
+++ b/sources/skins/moonocolor/icons/iframe.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/image.png b/sources/skins/moonocolor/icons/image.png
new file mode 100644
index 0000000..f1c3395
--- /dev/null
+++ b/sources/skins/moonocolor/icons/image.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/imagebutton.png b/sources/skins/moonocolor/icons/imagebutton.png
new file mode 100644
index 0000000..b91f61a
--- /dev/null
+++ b/sources/skins/moonocolor/icons/imagebutton.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/indent-rtl.png b/sources/skins/moonocolor/icons/indent-rtl.png
new file mode 100644
index 0000000..5935830
--- /dev/null
+++ b/sources/skins/moonocolor/icons/indent-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/indent.png b/sources/skins/moonocolor/icons/indent.png
new file mode 100644
index 0000000..f19d778
--- /dev/null
+++ b/sources/skins/moonocolor/icons/indent.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/italic.png b/sources/skins/moonocolor/icons/italic.png
new file mode 100644
index 0000000..246f32a
--- /dev/null
+++ b/sources/skins/moonocolor/icons/italic.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/justifyblock.png b/sources/skins/moonocolor/icons/justifyblock.png
new file mode 100644
index 0000000..70d09af
--- /dev/null
+++ b/sources/skins/moonocolor/icons/justifyblock.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/justifycenter.png b/sources/skins/moonocolor/icons/justifycenter.png
new file mode 100644
index 0000000..2bf0477
--- /dev/null
+++ b/sources/skins/moonocolor/icons/justifycenter.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/justifyleft.png b/sources/skins/moonocolor/icons/justifyleft.png
new file mode 100644
index 0000000..a2648bb
--- /dev/null
+++ b/sources/skins/moonocolor/icons/justifyleft.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/justifyright.png b/sources/skins/moonocolor/icons/justifyright.png
new file mode 100644
index 0000000..20878b9
--- /dev/null
+++ b/sources/skins/moonocolor/icons/justifyright.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/link.png b/sources/skins/moonocolor/icons/link.png
new file mode 100644
index 0000000..c72e039
--- /dev/null
+++ b/sources/skins/moonocolor/icons/link.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/maximize.png b/sources/skins/moonocolor/icons/maximize.png
new file mode 100644
index 0000000..4bcbc49
--- /dev/null
+++ b/sources/skins/moonocolor/icons/maximize.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/newpage-rtl.png b/sources/skins/moonocolor/icons/newpage-rtl.png
new file mode 100644
index 0000000..8ad1f0f
--- /dev/null
+++ b/sources/skins/moonocolor/icons/newpage-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/newpage.png b/sources/skins/moonocolor/icons/newpage.png
new file mode 100644
index 0000000..9735c67
--- /dev/null
+++ b/sources/skins/moonocolor/icons/newpage.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/numberedlist-rtl.png b/sources/skins/moonocolor/icons/numberedlist-rtl.png
new file mode 100644
index 0000000..0a14688
--- /dev/null
+++ b/sources/skins/moonocolor/icons/numberedlist-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/numberedlist.png b/sources/skins/moonocolor/icons/numberedlist.png
new file mode 100644
index 0000000..e2279cf
--- /dev/null
+++ b/sources/skins/moonocolor/icons/numberedlist.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/outdent-rtl.png b/sources/skins/moonocolor/icons/outdent-rtl.png
new file mode 100644
index 0000000..c007a74
--- /dev/null
+++ b/sources/skins/moonocolor/icons/outdent-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/outdent.png b/sources/skins/moonocolor/icons/outdent.png
new file mode 100644
index 0000000..97add27
--- /dev/null
+++ b/sources/skins/moonocolor/icons/outdent.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/pagebreak-rtl.png b/sources/skins/moonocolor/icons/pagebreak-rtl.png
new file mode 100644
index 0000000..f3aa92e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/pagebreak-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/pagebreak.png b/sources/skins/moonocolor/icons/pagebreak.png
new file mode 100644
index 0000000..f7bac7d
--- /dev/null
+++ b/sources/skins/moonocolor/icons/pagebreak.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/paste-rtl.png b/sources/skins/moonocolor/icons/paste-rtl.png
new file mode 100644
index 0000000..1957cfc
--- /dev/null
+++ b/sources/skins/moonocolor/icons/paste-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/paste.png b/sources/skins/moonocolor/icons/paste.png
new file mode 100644
index 0000000..1f0a37c
--- /dev/null
+++ b/sources/skins/moonocolor/icons/paste.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/pastefromword-rtl.png b/sources/skins/moonocolor/icons/pastefromword-rtl.png
new file mode 100644
index 0000000..5b61874
--- /dev/null
+++ b/sources/skins/moonocolor/icons/pastefromword-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/pastefromword.png b/sources/skins/moonocolor/icons/pastefromword.png
new file mode 100644
index 0000000..94aa56e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/pastefromword.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/pastetext-rtl.png b/sources/skins/moonocolor/icons/pastetext-rtl.png
new file mode 100644
index 0000000..18b1424
--- /dev/null
+++ b/sources/skins/moonocolor/icons/pastetext-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/pastetext.png b/sources/skins/moonocolor/icons/pastetext.png
new file mode 100644
index 0000000..7b85e08
--- /dev/null
+++ b/sources/skins/moonocolor/icons/pastetext.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/placeholder.png b/sources/skins/moonocolor/icons/placeholder.png
new file mode 100644
index 0000000..95d7721
--- /dev/null
+++ b/sources/skins/moonocolor/icons/placeholder.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/preview-rtl.png b/sources/skins/moonocolor/icons/preview-rtl.png
new file mode 100644
index 0000000..bc5861e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/preview-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/preview.png b/sources/skins/moonocolor/icons/preview.png
new file mode 100644
index 0000000..345131c
--- /dev/null
+++ b/sources/skins/moonocolor/icons/preview.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/print.png b/sources/skins/moonocolor/icons/print.png
new file mode 100644
index 0000000..11ed56a
--- /dev/null
+++ b/sources/skins/moonocolor/icons/print.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/radio.png b/sources/skins/moonocolor/icons/radio.png
new file mode 100644
index 0000000..64e1fc9
--- /dev/null
+++ b/sources/skins/moonocolor/icons/radio.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/redo-rtl.png b/sources/skins/moonocolor/icons/redo-rtl.png
new file mode 100644
index 0000000..0f8bf18
--- /dev/null
+++ b/sources/skins/moonocolor/icons/redo-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/redo.png b/sources/skins/moonocolor/icons/redo.png
new file mode 100644
index 0000000..53db6fb
--- /dev/null
+++ b/sources/skins/moonocolor/icons/redo.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/removeformat.png b/sources/skins/moonocolor/icons/removeformat.png
new file mode 100644
index 0000000..3473eb3
--- /dev/null
+++ b/sources/skins/moonocolor/icons/removeformat.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/replace.png b/sources/skins/moonocolor/icons/replace.png
new file mode 100644
index 0000000..d47bf3b
--- /dev/null
+++ b/sources/skins/moonocolor/icons/replace.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/save.png b/sources/skins/moonocolor/icons/save.png
new file mode 100644
index 0000000..9513064
--- /dev/null
+++ b/sources/skins/moonocolor/icons/save.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/scayt.png b/sources/skins/moonocolor/icons/scayt.png
new file mode 100644
index 0000000..f207caa
--- /dev/null
+++ b/sources/skins/moonocolor/icons/scayt.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/select-rtl.png b/sources/skins/moonocolor/icons/select-rtl.png
new file mode 100644
index 0000000..bdeeaf3
--- /dev/null
+++ b/sources/skins/moonocolor/icons/select-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/select.png b/sources/skins/moonocolor/icons/select.png
new file mode 100644
index 0000000..275d017
--- /dev/null
+++ b/sources/skins/moonocolor/icons/select.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/selectall.png b/sources/skins/moonocolor/icons/selectall.png
new file mode 100644
index 0000000..ae65b5e
--- /dev/null
+++ b/sources/skins/moonocolor/icons/selectall.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/showblocks-rtl.png b/sources/skins/moonocolor/icons/showblocks-rtl.png
new file mode 100644
index 0000000..154c99b
--- /dev/null
+++ b/sources/skins/moonocolor/icons/showblocks-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/showblocks.png b/sources/skins/moonocolor/icons/showblocks.png
new file mode 100644
index 0000000..eff2aff
--- /dev/null
+++ b/sources/skins/moonocolor/icons/showblocks.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/smiley.png b/sources/skins/moonocolor/icons/smiley.png
new file mode 100644
index 0000000..fc76fca
--- /dev/null
+++ b/sources/skins/moonocolor/icons/smiley.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/source-rtl.png b/sources/skins/moonocolor/icons/source-rtl.png
new file mode 100644
index 0000000..faaaba1
--- /dev/null
+++ b/sources/skins/moonocolor/icons/source-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/source.png b/sources/skins/moonocolor/icons/source.png
new file mode 100644
index 0000000..98c7bab
--- /dev/null
+++ b/sources/skins/moonocolor/icons/source.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/specialchar.png b/sources/skins/moonocolor/icons/specialchar.png
new file mode 100644
index 0000000..26e958b
--- /dev/null
+++ b/sources/skins/moonocolor/icons/specialchar.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/spellchecker.png b/sources/skins/moonocolor/icons/spellchecker.png
new file mode 100644
index 0000000..f207caa
--- /dev/null
+++ b/sources/skins/moonocolor/icons/spellchecker.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/strike.png b/sources/skins/moonocolor/icons/strike.png
new file mode 100644
index 0000000..853240b
--- /dev/null
+++ b/sources/skins/moonocolor/icons/strike.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/subscript.png b/sources/skins/moonocolor/icons/subscript.png
new file mode 100644
index 0000000..c614fef
--- /dev/null
+++ b/sources/skins/moonocolor/icons/subscript.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/superscript.png b/sources/skins/moonocolor/icons/superscript.png
new file mode 100644
index 0000000..ecb9746
--- /dev/null
+++ b/sources/skins/moonocolor/icons/superscript.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/table.png b/sources/skins/moonocolor/icons/table.png
new file mode 100644
index 0000000..5890428
--- /dev/null
+++ b/sources/skins/moonocolor/icons/table.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/templates-rtl.png b/sources/skins/moonocolor/icons/templates-rtl.png
new file mode 100644
index 0000000..fdfa5d0
--- /dev/null
+++ b/sources/skins/moonocolor/icons/templates-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/templates.png b/sources/skins/moonocolor/icons/templates.png
new file mode 100644
index 0000000..3781b86
--- /dev/null
+++ b/sources/skins/moonocolor/icons/templates.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/textarea-rtl.png b/sources/skins/moonocolor/icons/textarea-rtl.png
new file mode 100644
index 0000000..135aa42
--- /dev/null
+++ b/sources/skins/moonocolor/icons/textarea-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/textarea.png b/sources/skins/moonocolor/icons/textarea.png
new file mode 100644
index 0000000..aac1630
--- /dev/null
+++ b/sources/skins/moonocolor/icons/textarea.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/textcolor.png b/sources/skins/moonocolor/icons/textcolor.png
new file mode 100644
index 0000000..6453408
--- /dev/null
+++ b/sources/skins/moonocolor/icons/textcolor.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/textfield-rtl.png b/sources/skins/moonocolor/icons/textfield-rtl.png
new file mode 100644
index 0000000..bab07f3
--- /dev/null
+++ b/sources/skins/moonocolor/icons/textfield-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/textfield.png b/sources/skins/moonocolor/icons/textfield.png
new file mode 100644
index 0000000..d366d27
--- /dev/null
+++ b/sources/skins/moonocolor/icons/textfield.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/underline.png b/sources/skins/moonocolor/icons/underline.png
new file mode 100644
index 0000000..f382453
--- /dev/null
+++ b/sources/skins/moonocolor/icons/underline.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/undo-rtl.png b/sources/skins/moonocolor/icons/undo-rtl.png
new file mode 100644
index 0000000..53db6fb
--- /dev/null
+++ b/sources/skins/moonocolor/icons/undo-rtl.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/undo.png b/sources/skins/moonocolor/icons/undo.png
new file mode 100644
index 0000000..0f8bf18
--- /dev/null
+++ b/sources/skins/moonocolor/icons/undo.png
Binary files differ
diff --git a/sources/skins/moonocolor/icons/unlink.png b/sources/skins/moonocolor/icons/unlink.png
new file mode 100644
index 0000000..bb6b043
--- /dev/null
+++ b/sources/skins/moonocolor/icons/unlink.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/arrow.png b/sources/skins/moonocolor/images/arrow.png
new file mode 100644
index 0000000..d72b5f3
--- /dev/null
+++ b/sources/skins/moonocolor/images/arrow.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/close.png b/sources/skins/moonocolor/images/close.png
new file mode 100644
index 0000000..6a04ab5
--- /dev/null
+++ b/sources/skins/moonocolor/images/close.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/hidpi/close.png b/sources/skins/moonocolor/images/hidpi/close.png
new file mode 100644
index 0000000..e406c2c
--- /dev/null
+++ b/sources/skins/moonocolor/images/hidpi/close.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/hidpi/lock-open.png b/sources/skins/moonocolor/images/hidpi/lock-open.png
new file mode 100644
index 0000000..edbd12f
--- /dev/null
+++ b/sources/skins/moonocolor/images/hidpi/lock-open.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/hidpi/lock.png b/sources/skins/moonocolor/images/hidpi/lock.png
new file mode 100644
index 0000000..1b87bbb
--- /dev/null
+++ b/sources/skins/moonocolor/images/hidpi/lock.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/hidpi/refresh.png b/sources/skins/moonocolor/images/hidpi/refresh.png
new file mode 100644
index 0000000..c6c2b86
--- /dev/null
+++ b/sources/skins/moonocolor/images/hidpi/refresh.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/lock-open.png b/sources/skins/moonocolor/images/lock-open.png
new file mode 100644
index 0000000..0476987
--- /dev/null
+++ b/sources/skins/moonocolor/images/lock-open.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/lock.png b/sources/skins/moonocolor/images/lock.png
new file mode 100644
index 0000000..c5a1440
--- /dev/null
+++ b/sources/skins/moonocolor/images/lock.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/refresh.png b/sources/skins/moonocolor/images/refresh.png
new file mode 100644
index 0000000..1ff63c3
--- /dev/null
+++ b/sources/skins/moonocolor/images/refresh.png
Binary files differ
diff --git a/sources/skins/moonocolor/images/spinner.gif b/sources/skins/moonocolor/images/spinner.gif
new file mode 100644
index 0000000..d898d41
--- /dev/null
+++ b/sources/skins/moonocolor/images/spinner.gif
Binary files differ
diff --git a/sources/skins/moonocolor/mainui.css b/sources/skins/moonocolor/mainui.css
new file mode 100644
index 0000000..73ab4df
--- /dev/null
+++ b/sources/skins/moonocolor/mainui.css
@@ -0,0 +1,214 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+mainui.css (part of editor.css)
+=================================
+This file styles the basic structure of the CKEditor user interface - the box
+that holds everything.
+CKEditor offers two main editing modes. The main UI blocks that compose these
+modes are:
+        For "Theme UI" mode, the one most generally used:
+        +-- .cke_chrome ----------------------+
+        |+-- .cke_inner ---------------------+|
+        || +-- .cke_top -------------------+ ||
+        || |                               | ||
+        || +-------------------------------+ ||
+        || +-- .cke_contents --------------+ ||
+        || |                               | ||
+        || +-------------------------------+ ||
+        || +-- .cke_bottom ----------------+ ||
+        || |                               | ||
+        || +-------------------------------+ ||
+        |+-----------------------------------+|
+        +-------------------------------------+
+        For "Inline Editing" mode:
+        +-- .cke_chrome .cke_float------------+
+        |+-- .cke_inner ---------------------+|
+        || +-- .cke_top -------------------+ ||
+        || |                               | ||
+        || +-------------------------------+ ||
+        |+-----------------------------------+|
+        +-------------------------------------+
+Special outer level classes used in this file:
+        .cke_hc: Available when the editor is rendered on "High Contrast".
+*/
+/* The outer boundary of the interface. */
+.cke_chrome
+{
+        /* This is <span>, so transform it into a block.*/
+        display: block;
+        border: 1px solid #b6b6b6;
+        padding: 0;
+        box-shadow: 0 0 3px rgba(0,0,0,.15);
+}
+/* The inner boundary of the interface. */
+.cke_inner
+{
+        /* This is <span>, so transform it into a block.*/
+        display: block;
+        -webkit-touch-callout: none;
+        background: #fff;
+        padding: 0;
+}
+/* Added to the outer boundary of the UI when in inline editing,
+   when the UI is floating. */
+.cke_float
+{
+        /* Make white the space between the outer and the inner borders. */
+        border: none;
+}
+.cke_float .cke_inner
+{
+        /* As we don't have blocks following top (toolbar) we suppress the padding
+           as the toolbar defines its own margin. */
+        padding-bottom: 0;
+}
+/* Make the main spaces enlarge to hold potentially floated content. */
+.cke_top,
+.cke_contents,
+.cke_bottom
+{
+        /* These are <span>s, so transform them into blocks.*/
+        display: block;
+        /* Ideally this should be "auto", but it shows scrollbars in IE7. */
+        overflow: hidden;
+}
+.cke_top
+{
+        /*border: 1px solid #b2b2b2;*/
+        border-bottom: 1px solid #b6b6b6;
+        padding: 6px 8px 2px;
+        /* Allow breaking toolbars when in a narrow editor. (#9947) */
+        white-space: normal;
+        box-shadow: 0 1px 0 #fff inset;
+        background: #cfd1cf;
+        background-image: linear-gradient(to bottom, #f5f5f5, #cfd1cf);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f5f5f5', endColorstr='#cfd1cf');
+}
+.cke_float .cke_top
+{
+        border: 1px solid #b6b6b6;
+        border-bottom-color: #999;
+}
+.cke_bottom
+{
+        padding: 6px 8px 2px;
+        position: relative;
+        border-top: 1px solid #bfbfbf;
+        box-shadow: 0 1px 0 #fff inset;
+        background: #cfd1cf;
+        background-image: linear-gradient(to bottom, #ebebeb, #cfd1cf);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ebebeb', endColorstr='#cfd1cf');
+}
+/* On iOS we need to manually enable scrolling in the contents block. (#9945) */
+.cke_browser_ios .cke_contents
+{
+    overflow-y: auto;
+    -webkit-overflow-scrolling: touch;
+}
+/* The resizer is the small UI element that is rendered at the bottom right
+   part of the editor. It makes is possible to resize the editor UI. */
+.cke_resizer
+{
+        /* To avoid using images for the resizer, we create a small triangle,
+           using some CSS magic. */
+        width: 0;
+        height: 0;
+        overflow: hidden;
+        width: 0;
+        height: 0;
+        overflow: hidden;
+        border-width: 10px 10px 0 0;
+        border-color: transparent #666 transparent transparent;
+        border-style: dashed solid dashed dashed;
+        font-size: 0;
+        vertical-align: bottom;
+        margin-top: 6px;
+        /*      A margin in case of no other element in the same container
+                to keep a distance to the bottom edge. */
+        margin-bottom: 2px;
+        box-shadow: 0 1px 0 rgba(255,255,255,.3);
+}
+.cke_hc .cke_resizer
+{
+        font-size: 15px;
+        width: auto;
+        height: auto;
+        border-width: 0;
+}
+.cke_resizer_ltr
+{
+        cursor: se-resize;
+        float: right;
+        margin-right: -4px;
+}
+/* This class is added in RTL mode. This is a special case for the resizer
+   (usually the .cke_rtl class is used), because it may not necessarily be in
+   RTL mode if the main UI is RTL. It depends instead on the context where the
+   editor is inserted on. */
+.cke_resizer_rtl
+{
+        border-width: 10px 0 0 10px;
+        border-color: transparent transparent transparent #A5A5A5;
+        border-style: dashed dashed dashed solid;
+        cursor: sw-resize;
+        float: left;
+        margin-left: -4px;
+        right: auto;
+}
+/* The editing area (where users type) can be rendered as an editable <div>
+   element (e.g. divarea plugin). In that case, this is the class applied to
+   that element. */
+.cke_wysiwyg_div
+{
+        display: block;
+        height: 100%;
+        overflow: auto;
+        padding: 0 8px;
+        outline-style: none;
+        box-sizing: border-box;
+}
diff --git a/sources/skins/moonocolor/menu.css b/sources/skins/moonocolor/menu.css
new file mode 100644
index 0000000..bbaa213
--- /dev/null
+++ b/sources/skins/moonocolor/menu.css
@@ -0,0 +1,201 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+menu.css (part of editor.css)
+===============================
+This file styles menus used in the editor UI. These menus are the list of
+options available inside some "floating panels", like menu buttons of the
+toolbar or the context menu.
+Note that the menu itself doesn't include the floating element that holds it.
+That element is styles in the panel.css file.
+The following is a visual representation of the main elements of a menu:
+-- .cke_menu -----------------+
+| +-- .cke_menuitem  --------+ |
+| | +-- .cke_menubutton ---+ | |
+| | |                      | | |
+| | +----------------------+ | |
+| +--------------------------+ |
+| +-- .cke_menuseparator ----+ |
+| ...                          |
+------------------------------+
+This is the .cke_menubutton structure:
+(Note that the menu button icon shares with toolbar button the common class .cke_button_icon to achieve the same outlook.)
+-- .cke_menubutton -------------------------------------------------------------------------+
+| +-- .cke_menubutton_inner ---------------------------------------------------------------+ |
+| | +-- .cke_menubutton_icon ---+ +-- .cke_menubutton_label --+ +-- .cke_cke_menuarrow --+ | |
+| | | +-- .cke_button_icon ---+ | |                           | |                        | | |
+| | | |                       | | |                           | |                        | | |
+| | | +-----------------------+ | |                           | |                        | | |
+| | +---------------------------+ +---------------------------+ +------------------------+ | |
+| +----------------------------------------------------------------------------------------+ |
+--------------------------------------------------------------------------------------------+
+Special outer level classes used in this file:
+        .cke_hc: Available when the editor is rendered on "High Contrast".
+        .cke_rtl: Available when the editor UI is on RTL.
+*/
+/* .cke_menuitem is the element that holds the entire structure of each of the
+   menu items. */
+.cke_menubutton
+{
+        /* The "button" inside a menu item is a <a> element.
+           Transforms it into a block. */
+        display: block;
+}
+.cke_menuitem span
+{
+        /* Avoid the text selection cursor inside menu items. */
+        cursor: default;
+}
+.cke_menubutton:hover,
+.cke_menubutton:focus,
+.cke_menubutton:active
+{
+        background-color: #D3D3D3;
+        display: block;
+}
+.cke_hc .cke_menubutton
+{
+        padding: 2px;
+}
+.cke_hc .cke_menubutton:hover,
+.cke_hc .cke_menubutton:focus,
+.cke_hc .cke_menubutton:active
+{
+        border: 2px solid;
+        padding: 0;
+}
+.cke_menubutton_inner {
+        display: table-row;
+}
+.cke_menubutton_icon,
+.cke_menubutton_label,
+.cke_menuarrow {
+        display: table-cell;
+}
+/* The menu item icon. */
+.cke_menubutton_icon
+{
+        background-color: #D7D8D7;
+        opacity: 0.70; /* Safari, Opera and Mozilla */
+        filter: alpha(opacity=70); /* IE */
+        padding: 4px;
+}
+.cke_hc .cke_menubutton_icon
+{
+        height: 16px;
+        width: 0;
+        padding: 4px 0;
+}
+.cke_menubutton:hover .cke_menubutton_icon,
+.cke_menubutton:focus .cke_menubutton_icon,
+.cke_menubutton:active .cke_menubutton_icon
+{
+        background-color: #D0D2D0;
+}
+.cke_menubutton_disabled:hover .cke_menubutton_icon,
+.cke_menubutton_disabled:focus .cke_menubutton_icon,
+.cke_menubutton_disabled:active .cke_menubutton_icon
+{
+        /* The icon will get opacity as well when hovered. */
+        opacity: 0.3;
+        filter: alpha(opacity=30);
+}
+/* The textual part of each menu item. */
+.cke_menubutton_label
+{
+        padding: 0 5px;
+        background-color: transparent;
+        width: 100%;
+        vertical-align: middle;
+}
+.cke_menubutton_disabled .cke_menubutton_label
+{
+        /* Greyed label text indicates a disabled menu item. */
+        opacity: 0.3;
+        filter: alpha(opacity=30);
+}
+.cke_menubutton_on
+{
+        border: 1px solid #dedede;
+        background-color: #f2f2f2;
+        box-shadow: 0 0 2px rgba(0,0,0,.1) inset;
+}
+.cke_menubutton_on .cke_menubutton_icon
+{
+        padding-right: 3px;
+}
+.cke_menubutton:hover,
+.cke_menubutton:focus,
+.cke_menubutton:active
+{
+        background-color: #EFF0EF;
+}
+.cke_panel_frame .cke_menubutton_label
+{
+        display: none;
+}
+/* The separator used to separate menu item groups. */
+.cke_menuseparator
+{
+        background-color: #D3D3D3;
+        height: 1px;
+        filter: alpha(opacity=70); /* IE */
+        opacity: 0.70; /* Safari, Opera and Mozilla */
+}
+/* The small arrow shown for item with sub-menus. */
+.cke_menuarrow
+{
+        background-image: url(images/arrow.png);
+        background-position: 0 10px;
+        background-repeat: no-repeat;
+        padding: 0 5px;
+}
+.cke_rtl .cke_menuarrow
+{
+        background-position: 5px -13px;
+        background-repeat: no-repeat;
+}
+.cke_menuarrow span
+{
+        display: none;
+}
+.cke_hc .cke_menuarrow span
+{
+        vertical-align: middle;
+        display: inline;
+}
diff --git a/sources/skins/moonocolor/notification.css b/sources/skins/moonocolor/notification.css
new file mode 100644
index 0000000..c6292d3
--- /dev/null
+++ b/sources/skins/moonocolor/notification.css
@@ -0,0 +1,168 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/**
+ * Progress notification structure:
+ *
+ * +---div.cke_notification cke_notification_info--------------------------+
+ * |                                                                       |
+ * | +---div.cke_notification_progress-----------------------------------+ |
+ * | |                                                                   | |
+ * | +-------------------------------------------------------------------+ |
+ * |                                                                       |
+ * | +---p.cke_notification_message--------------------------------------+ |
+ * | | Foo                                                               | |
+ * | +-------------------------------------------------------------------+ |
+ * |                                                                       |
+ * | +---a.cke_notification_close----------------------------------------+ |
+ * | | +---span.cke_label----------------------------------------------+ | |
+ * | | | X                                                             | | |
+ * | | +---------------------------------------------------------------+ | |
+ * | +-------------------------------------------------------------------+ |
+ * |                                                                       |
+ * +-----------------------------------------------------------------------+
+ *
+ *
+ * Warning notification structure:
+ *
+ * +---div.cke_notification cke_notification_warning-----------------------+
+ * |                                                                       |
+ * | +---p.cke_notification_message--------------------------------------+ |
+ * | | Foo                                                               | |
+ * | +-------------------------------------------------------------------+ |
+ * |                                                                       |
+ * | +---a.cke_notification_close----------------------------------------+ |
+ * | | +---span.cke_label----------------------------------------------+ | |
+ * | | | X                                                             | | |
+ * | | +---------------------------------------------------------------+ | |
+ * | +-------------------------------------------------------------------+ |
+ * |                                                                       |
+ * +-----------------------------------------------------------------------+
+ *
+ * Success and info notifications have the same structure as warning, but use
+ * `cke_notification_success` and `cke_notification_info` instead of `cke_notification_warning`.
+ */
+.cke_notifications_area
+{
+        /* Prevent notification margin capture clicking. */
+        pointer-events: none;
+}
+.cke_notification
+{
+        pointer-events: auto;
+        position: relative;
+        margin: 10px;
+        width: 300px;
+        color: white;
+        border-radius: 3px;
+        text-align: center;
+        opacity: 0.95;
+        filter: alpha(opacity = 95);
+        box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.3);
+        -webkit-animation: fadeIn 0.7s;
+        animation: fadeIn 0.7s;
+}
+.cke_notification_message a
+{
+        color: #12306F;
+}
+@-webkit-keyframes fadeIn
+{
+        from { opacity: 0.4; }
+        to { opacity: 0.95; }
+}
+@keyframes fadeIn
+{
+        from { opacity: 0.4; }
+        to { opacity: 0.95; }
+}
+.cke_notification_success
+{
+        background: #72B572;
+        border: 1px solid #63A563;
+}
+.cke_notification_warning
+{
+        background: #C83939;
+        border: 1px solid #902B2B;
+}
+.cke_notification_info
+{
+        background: #2E9AD0;
+        border: 1px solid #0F74A8;
+}
+.cke_notification_info span.cke_notification_progress
+{
+        background-color: #0F74A8;
+        display: block;
+        padding: 0;
+        margin: 0;
+        height: 100%;
+        overflow: hidden;
+        position: absolute;
+        z-index: 1;
+}
+.cke_notification_message
+{
+        position: relative;
+        margin: 4px 23px 3px;
+        font-family: Arial, Helvetica, sans-serif;
+        font-size: 12px;
+        line-height: 18px;
+        z-index: 4;
+        text-overflow: ellipsis;
+        overflow: hidden;
+}
+.cke_notification_close
+{
+        background-image: url(images/close.png);
+        background-repeat: no-repeat;
+        background-position: 50%;
+        position: absolute;
+        cursor: pointer;
+        text-align: center;
+        height: 20px;
+        width: 20px;
+        top: 1px;
+        right: 1px;
+        padding: 0;
+        margin: 0;
+        z-index: 5;
+        opacity: 0.6;
+        filter: alpha(opacity = 60);
+}
+.cke_notification_close:hover
+{
+        opacity: 1;
+        filter: alpha(opacity = 100);
+}
+.cke_notification_close span
+{
+        display: none;
+}
+.cke_notification_warning a.cke_notification_close
+{
+        opacity: 0.8;
+        filter: alpha(opacity = 80);
+}
+.cke_notification_warning a.cke_notification_close:hover
+{
+        opacity: 1;
+        filter: alpha(opacity = 100);
+}
diff --git a/sources/skins/moonocolor/panel.css b/sources/skins/moonocolor/panel.css
new file mode 100644
index 0000000..8743d19
--- /dev/null
+++ b/sources/skins/moonocolor/panel.css
@@ -0,0 +1,237 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+panel.css (part of editor.css)
+================================
+Panels are floating elements that can hold different types of contents.
+The following are common uses of it:
+        - The element that toolbar combos display when opening them.
+        - The context menu.
+        - The list of items displayed by "menu buttons" (e.g. scayt).
+        - The panel shown when opening "panel buttons" (e.g. color buttons).
+Panel contents are wrapped into an iframe, so it is possible to have additional
+CSS loaded inside them (e.g. to have more accurate preview on the styles combo).
+The following is a visual representation of the outer elements of a panel:
+-- .cke_panel(*) ---------------------+
+| +-- IFRAME.cke_panel_frame --------+ |
+| | +-- HTML.cke_panel_container --+ | |
+| | | +-- .cke_panel_block ------+ | | |
+| | | |                          | | | |
+| | | |     (contents here)      | | | |
+| | | |                          | | | |
+| | | +--------------------------+ | | |
+| | +------------------------------+ | |
+| +----------------------------------+ |
+--------------------------------------+
+(*) All kinds of panel share the above structure. Menu panels adds the
+    .cke_menu_panel class to the outer element, while toolbar combos add the
+        .cke_combopanel class.
+This file also defines styles for panel lists (used by combos). For menu-like
+panel contents and color panels check menu.css and colorpanel.css.
+*/
+/* The box that holds an IFRAME. It's inserted into a host document and positioned
+   absolutely by the application. It floats above the host document/editor. */
+.cke_panel
+{
+        /* Restore the loading hide */
+        visibility: visible;
+    width: 120px;
+        height: 100px;
+        overflow: hidden;
+        background-color: #fff;
+    border: 1px solid #b6b6b6;
+    border-bottom-color: #999;
+        border-radius: 3px;
+    box-shadow: 0 0 3px rgba(0,0,0,.15);
+}
+/* This class represents panels which are used as context menus. */
+.cke_menu_panel
+{
+        padding: 0;
+        margin: 0;
+}
+/* This class represents panels which are used by rich combos. */
+.cke_combopanel
+{
+    width: 150px;
+    height: 170px;
+}
+/* The IFRAME the panel is wrapped into. */
+.cke_panel_frame
+{
+        width: 100%;
+        height: 100%;
+        font-size: 12px;
+        overflow: auto;
+        overflow-x: hidden;
+}
+/* The HTML document which is a direct descendant of the IFRAME */
+.cke_panel_container
+{
+        overflow-y: auto;
+        overflow-x: hidden;
+}
+/*
+Here we start the definition of panel lists (e.g. combo panels). The following
+is its visual representation:
+-- .cke_panel_block -----------------+
+| +-- .cke_panel_grouptitle --------+ |
+| |                                 | |
+| +---------------------------------+ |
+| +-- .cke_panel_list --------------+ |
+| | +-- .cke_panel_listItem ------+ | |
+| | | +-- a --------------------+ | | |
+| | | | +-- span -------------+ | | | |
+| | | | |                     | | | | |
+| | | | +---------------------+ | | | |
+| | | +-------------------------+ | | |
+| | +-----------------------------+ | |
+| | +-- .cke_panel_listItem ------+ | |
+| | | +-- a --------------------+ | | |
+| | | | +-- span -------------+ | | | |
+| | | | |                     | | | | |
+| | | | +---------------------+ | | | |
+| | | +-------------------------+ | | |
+| | +-----------------------------+ | |
+| | ...                             | |
+| +---------------------------------+ |
+-------------------------------------+
+*/
+/* The list of panel items. */
+.cke_panel_list
+{
+        list-style-type: none;
+        margin: 3px;
+        padding: 0;
+        white-space: nowrap;
+}
+/* The item of .cke_panel_list */
+.cke_panel_listItem
+{
+        margin: 0;
+    padding-bottom: 1px;
+}
+/* The child of .cke_panel_listItem. These elements contain spans which are
+   to display a real name of the property which is visible for an end-user. */
+.cke_panel_listItem a
+{
+        padding: 3px 4px;
+        display: block;
+        border: 1px solid #fff;
+        color: inherit !important;
+        text-decoration: none;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    border-radius: 2px;
+}
+/* IE6 */
+* html .cke_panel_listItem a
+{
+        width : 100%;
+        /* IE is not able to inherit the color, so we must force it to black */
+        color: #000;
+}
+/* IE7 */
+*:first-child+html .cke_panel_listItem a
+{
+        /* IE is not able to inherit the color, so we must force it to black */
+        color: #000;
+}
+.cke_panel_listItem.cke_selected a
+{
+        border: 1px solid #dedede;
+        background-color: #f2f2f2;
+    box-shadow: 0 0 2px rgba(0,0,0,.1) inset;
+}
+.cke_panel_listItem a:hover,
+.cke_panel_listItem a:focus,
+.cke_panel_listItem a:active
+{
+        border-color: #dedede;
+        background-color: #f2f2f2;
+    box-shadow: 0 0 2px rgba(0,0,0,.1) inset;
+}
+.cke_hc .cke_panel_listItem a
+{
+        border-style: none;
+}
+.cke_hc .cke_panel_listItem a:hover,
+.cke_hc .cke_panel_listItem a:focus,
+.cke_hc .cke_panel_listItem a:active
+{
+        border: 2px solid;
+        padding: 1px 2px;
+}
+/* The title of the entire panel which is visible on top of the list. */
+.cke_panel_grouptitle
+{
+        cursor: default;
+        font-size: 11px;
+        font-weight: bold;
+        white-space: nowrap;
+        margin: 0;
+        padding: 4px 6px;
+    color: #474747;
+    text-shadow: 0 1px 0 rgba(255,255,255,.75);
+    border-bottom: 1px solid #b6b6b6;
+    border-radius: 2px 2px 0 0;
+    box-shadow: 0 1px 0 #fff inset;
+    background: #cfd1cf;
+    background-image: linear-gradient(to bottom, #f5f5f5, #cfd1cf);
+    filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f5f5f5', endColorstr='#cfd1cf');
+}
+/* The following styles set defaults of the elements used by the Paragraph
+   Format panel. */
+.cke_panel_listItem p,
+.cke_panel_listItem h1,
+.cke_panel_listItem h2,
+.cke_panel_listItem h3,
+.cke_panel_listItem h4,
+.cke_panel_listItem h5,
+.cke_panel_listItem h6,
+.cke_panel_listItem pre
+{
+        margin-top: 0px;
+        margin-bottom: 0px;
+}
diff --git a/sources/skins/moonocolor/presets.css b/sources/skins/moonocolor/presets.css
new file mode 100644
index 0000000..a4e554b
--- /dev/null
+++ b/sources/skins/moonocolor/presets.css
@@ -0,0 +1,41 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/* "Source" button label */
+.cke_button__source_label,
+.cke_button__sourcedialog_label
+{
+        display: inline;
+}
+/* "Font Size" combo width */
+.cke_combo__fontsize .cke_combo_text
+{
+        width: 30px;
+}
+/* "Font Size" panel size */
+.cke_combopanel__fontsize
+{
+        width: 120px;
+}
+/* Editable regions */
+textarea.cke_source
+{
+        font-family: 'Courier New', Monospace;
+        font-size: small;
+        background-color: #fff;
+        white-space: pre-wrap;
+        border: none;
+        padding: 0;
+        margin: 0;
+        display: block;
+}
+.cke_wysiwyg_frame, .cke_wysiwyg_div
+{
+        background-color: #fff;
+}
diff --git a/sources/skins/moonocolor/readme.md b/sources/skins/moonocolor/readme.md
new file mode 100644
index 0000000..58290a0
--- /dev/null
+++ b/sources/skins/moonocolor/readme.md
@@ -0,0 +1,51 @@
+"Moono" Skin
+====================
+This skin has been chosen for the **default skin** of CKEditor 4.x, elected from the CKEditor
+[skin contest](http://ckeditor.com/blog/new_ckeditor_4_skin) and further shaped by
+the CKEditor team. "Moono" is maintained by the core developers.
+For more information about skins, please check the [CKEditor Skin SDK](http://docs.cksource.com/CKEditor_4.x/Skin_SDK)
+documentation.
+Features
+-------------------
+"Moono" is a monochromatic skin, which offers a modern look coupled with gradients and transparency.
+It comes with the following features:
+- Chameleon feature with brightness,
+- high-contrast compatibility,
+- graphics source provided in SVG.
+Directory Structure
+-------------------
+CSS parts:
+- **editor.css**: the main CSS file. It's simply loading several other files, for easier maintenance,
+- **mainui.css**: the file contains styles of entire editor outline structures,
+- **toolbar.css**: the file contains styles of the editor toolbar space (top),
+- **richcombo.css**: the file contains styles of the rich combo ui elements on toolbar,
+- **panel.css**: the file contains styles of the rich combo drop-down, it's not loaded
+until the first panel open up,
+- **elementspath.css**: the file contains styles of the editor elements path bar (bottom),
+- **menu.css**: the file contains styles of all editor menus including context menu and button drop-down,
+it's not loaded until the first menu open up,
+- **dialog.css**: the CSS files for the dialog UI, it's not loaded until the first dialog open,
+- **reset.css**: the file defines the basis of style resets among all editor UI spaces,
+- **preset.css**: the file defines the default styles of some UI elements reflecting the skin preference,
+- **editor_XYZ.css** and **dialog_XYZ.css**: browser specific CSS hacks.
+Other parts:
+- **skin.js**: the only JavaScript part of the skin that registers the skin, its browser specific files and its icons and defines the Chameleon feature,
+- **icons/**: contains all skin defined icons,
+- **images/**: contains a fill general used images,
+- **dev/**: contains SVG source of the skin icons.
+License
+-------
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+Licensed under the terms of any of the following licenses at your choice: [GPL](http://www.gnu.org/licenses/gpl.html), [LGPL](http://www.gnu.org/licenses/lgpl.html) and [MPL](http://www.mozilla.org/MPL/MPL-1.1.html).
+See LICENSE.md for more information.
diff --git a/sources/skins/moonocolor/reset.css b/sources/skins/moonocolor/reset.css
new file mode 100644
index 0000000..32ddf98
--- /dev/null
+++ b/sources/skins/moonocolor/reset.css
@@ -0,0 +1,115 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+reset.css (part of editor.css)
+================================
+This file holds the "reset" requirements of CKEditor, as well as define the
+default interface styles.
+CKEditor includes two main "reset" class names in the DOM structure created for
+editors:
+        * .cke_reset: Intended to reset a specific element, but not its children.
+          Because of this, only styles that will not be inherited can be defined.
+        * .cke_reset_all: Intended to reset not only the element holding it, but
+           also its child elements.
+To understand why "reset" is needed, check the CKEditor Skin SDK:
+http://docs.cksource.com/CKEditor_4.x/Skin_SDK/Reset
+*/
+/* Reset for single elements, not their children. */
+.cke_reset
+{
+        /* Do not include inheritable rules here. */
+        margin: 0;
+        padding: 0;
+        border: 0;
+        background: transparent;
+        text-decoration: none;
+        width: auto;
+        height: auto;
+        vertical-align: baseline;
+        box-sizing: content-box;
+        position: static;
+        transition: none;
+}
+/* Reset for elements and their children. */
+.cke_reset_all, .cke_reset_all *,
+.cke_reset_all a, .cke_reset_all textarea
+{
+        /* The following must be identical to .cke_reset. */
+        margin: 0;
+        padding: 0;
+        border: 0;
+        background: transparent;
+        text-decoration: none;
+        width: auto;
+        height: auto;
+        vertical-align: baseline;
+        box-sizing: content-box;
+        position: static;
+        transition: none;
+        /* These are rule inherited by all children elements. */
+        border-collapse: collapse;
+        font: normal normal normal 12px Arial,Helvetica,Tahoma,Verdana,Sans-Serif;
+        color: #000;
+        text-align: left;
+        white-space: nowrap;
+        cursor: auto;
+        float: none;
+}
+.cke_reset_all .cke_rtl *
+{
+        text-align: right;
+}
+/* Defaults for some elements. */
+.cke_reset_all iframe
+{
+        vertical-align: inherit;        /** For IE */
+}
+.cke_reset_all textarea
+{
+        white-space: pre-wrap;
+}
+.cke_reset_all textarea,
+.cke_reset_all input[type="text"],
+.cke_reset_all input[type="password"]
+{
+        cursor: text;
+}
+.cke_reset_all textarea[disabled],
+.cke_reset_all input[type="text"][disabled],
+.cke_reset_all input[type="password"][disabled]
+{
+        cursor: default;
+}
+.cke_reset_all fieldset
+{
+        padding: 10px;
+        border: 2px groove #E0DFE3;
+}
+.cke_reset_all select
+{
+        box-sizing: border-box;
+}
+.cke_reset_all table
+{
+        table-layout: auto;
+}
diff --git a/sources/skins/moonocolor/richcombo.css b/sources/skins/moonocolor/richcombo.css
new file mode 100644
index 0000000..5887f6c
--- /dev/null
+++ b/sources/skins/moonocolor/richcombo.css
@@ -0,0 +1,210 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+richcombo.css (part of editor.css)
+=================================
+This file holds the style set of the "Rich Combo" widget which is commonly used
+in the toolbar. It doesn't, however, styles the panel that is displayed when
+clicking on the combo, which is instead styled by panel.css.
+The visual representation of a rich combo widget looks as follows:
+-- .cke_combo----------------------------------------------------------------------+
+| +-- .cke_combo_label --+ +-- .cke_combo_button ---------------------------------+ |
+| |                      | | +-- .cke_combo_text --+ +-- .cke_combo_open -------+ | |
+| |                      | | |                     | | +-- .cke_combo_arrow --+ | | |
+| |                      | | |                     | | |                      | | | |
+| |                      | | |                     | | +----------------------+ | | |
+| |                      | | +---------------------+ +--------------------------+ | |
+| +----------------------+ +------------------------------------------------------+ |
+-----------------------------------------------------------------------------------+
+*/
+/* The box that hold the entire combo widget */
+.cke_combo
+{
+        display: inline-block;
+        float: left;
+}
+.cke_rtl .cke_combo
+{
+        float: right;
+}
+.cke_hc .cke_combo
+{
+        margin-top: -2px;
+}
+/* The label of the combo widget. It is invisible by default, yet
+   it's important for semantics and accessibility. */
+.cke_combo_label
+{
+        display: none;
+        float: left;
+        line-height: 26px;
+        vertical-align: top;
+        margin-right: 5px;
+}
+.cke_rtl .cke_combo_label
+{
+        float: right;
+        margin-left: 5px;
+        margin-right: 0;
+}
+/* The container for combo text and arrow. */
+a.cke_combo_button
+{
+        cursor: default;
+        display: inline-block;
+        float: left;
+        margin: 0 6px 5px 0;
+        border: 1px solid #a6a6a6;
+        border-bottom-color: #979797;
+        border-radius: 3px;
+        box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;
+        background: #e4e4e4;
+        background-image: linear-gradient(to bottom, #ffffff, #e4e4e4);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ffffff', endColorstr='#e4e4e4');
+}
+/* Different states of the container. */
+.cke_combo_off a.cke_combo_button:hover,
+.cke_combo_off a.cke_combo_button:focus
+{
+        background: #ccc;
+        background-image: linear-gradient(to bottom, #f2f2f2, #ccc);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f2f2f2', endColorstr='#cccccc');
+        outline: none;
+}
+.cke_combo_off a.cke_combo_button:active,
+.cke_combo_on a.cke_combo_button
+{
+        border: 1px solid #777;
+        box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 1px 5px rgba(0,0,0,.6) inset;
+        background: #b5b5b5;
+        background-image: linear-gradient(to bottom, #aaa, #cacaca);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#aaaaaa', endColorstr='#cacaca');
+}
+.cke_combo_on a.cke_combo_button:hover,
+.cke_combo_on a.cke_combo_button:focus,
+.cke_combo_on a.cke_combo_button:active
+{
+        box-shadow: 0 1px 6px rgba(0,0,0,.7) inset, 0 1px 0 rgba(0,0,0,.2);
+}
+.cke_rtl .cke_combo_button
+{
+        float: right;
+        margin-left: 5px;
+        margin-right: 0;
+}
+.cke_hc a.cke_combo_button
+{
+        padding: 3px;
+}
+.cke_hc .cke_combo_on a.cke_combo_button,
+.cke_hc .cke_combo_off a.cke_combo_button:hover,
+.cke_hc .cke_combo_off a.cke_combo_button:focus,
+.cke_hc .cke_combo_off a.cke_combo_button:active
+{
+        border-width: 3px;
+        padding: 1px;
+}
+/* The label that shows the current value of the rich combo.
+   By default, it holds the name of the property.
+   See: .cke_combo_inlinelabel */
+.cke_combo_text
+{
+        line-height: 26px;
+        padding-left: 10px;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        float: left;
+        cursor: default;
+        color: #474747;
+        text-shadow: 0 1px 0 rgba(255,255,255,.5);
+    width: 60px;
+}
+.cke_rtl .cke_combo_text
+{
+        float: right;
+        text-align: right;
+        padding-left: 0;
+        padding-right: 10px;
+}
+.cke_hc .cke_combo_text
+{
+        line-height: 18px;
+        font-size: 12px;
+}
+/* The handler which opens the panel of rich combo properties.
+   It holds an arrow as a visual indicator. */
+.cke_combo_open
+{
+        cursor: default;
+        display: inline-block;
+        font-size: 0;
+        height: 19px;
+        line-height: 17px;
+        margin: 1px 7px 1px;
+        width: 5px;
+}
+.cke_hc .cke_combo_open
+{
+        height: 12px;
+}
+/* The arrow which is displayed inside of the .cke_combo_open handler. */
+.cke_combo_arrow
+{
+        cursor: default;
+        margin: 11px 0 0;
+        float: left;
+        /* Pure CSS Arrow */
+        height: 0;
+        width: 0;
+        font-size: 0;
+        border-left: 3px solid transparent;
+        border-right: 3px solid transparent;
+        border-top: 3px solid #474747;
+}
+.cke_hc .cke_combo_arrow
+{
+        font-size: 10px;
+        width: auto;
+        border: 0;
+        margin-top: 3px;
+}
+/* Disabled combo button styles. */
+.cke_combo_disabled .cke_combo_inlinelabel,
+.cke_combo_disabled .cke_combo_open
+{
+        opacity: 0.3;
+}
diff --git a/sources/skins/moonocolor/skin.js b/sources/skins/moonocolor/skin.js
new file mode 100644
index 0000000..01f2de8
--- /dev/null
+++ b/sources/skins/moonocolor/skin.js
@@ -0,0 +1,319 @@
+/**
+ * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or http://ckeditor.com/license
+ */
+/*
+skin.js
+=========
+In this file we interact with the CKEditor JavaScript API to register the skin
+and enable additional skin related features.
+The level of complexity of this file depends on the features available in the
+skin. There is only one mandatory line of code to be included here, which is
+setting CKEDITOR.skin.name. All the rest is optional, but recommended to be
+implemented as they make higher quality skins.
+For this skin, the following tasks are achieved in this file:
+        1. Register the skin.
+        2. Register browser specific skin files.
+        3. Define the "Chameleon" feature.
+        4. Register the skin icons, to have them used on the development version of
+                the skin.
+*/
+// 1. Register the skin
+// ----------------------
+// The CKEDITOR.skin.name property must be set to the skin name. This is a
+// lower-cased name, which must match the skin folder name as well as the value
+// used on config.skin to tell the editor to use the skin.
+//
+// This is the only mandatory property to be defined in this file.
+CKEDITOR.skin.name = 'moonocolor';
+// 2. Register browser specific skin files
+// -----------------------------------------
+// (http://docs.cksource.com/CKEditor_4.x/Skin_SDK/Browser_Hacks)
+//
+// To help implementing browser specific "hacks" to the skin files and have it
+// easy to maintain, it is possible to have dedicated files for such browsers,
+// for both the main skin CSS files: editor.css and dialog.css.
+//
+// The browser files must be named after the main file names, appended by an
+// underscore and the browser name (e.g. editor_ie.css, dialog_ie8.css).
+//
+// The accepted browser names must match the CKEDITOR.env properties. The most
+// common names are: ie, webkit and gecko. Check the documentation for the complete
+// list:
+// http://docs.ckeditor.com/#!/api/CKEDITOR.env
+//
+// Internet explorer is an expection and the browser version is also accepted
+// (ie7, ie8, ie9, ie10), as well as a special name for IE in Quirks mode (iequirks).
+//
+// The available browser specific files must be set separately for editor.css
+// and dialog.css.
+CKEDITOR.skin.ua_editor = 'ie,iequirks,ie7,ie8,gecko';
+CKEDITOR.skin.ua_dialog = 'ie,iequirks,ie7,ie8';
+// 3. Define the "Chameleon" feature
+// -----------------------------------
+// (http://docs.cksource.com/CKEditor_4.x/Skin_SDK/Chameleon)
+//
+// "Chameleon" is a unique feature available in CKEditor. It makes it possible
+// to end users to specify which color to use as the basis for the editor UI.
+// It is enough to set config.uiColor to any color value and voila, the UI is
+// colored.
+//
+// The only detail here is that the skin itself must be compatible with the
+// Chameleon feature. That's because the skin CSS files are the responsible to
+// apply colors in the UI and each skin do that in different way and on
+// different places.
+//
+// Implementing the Chameleon feature requires a bit of JavaScript programming.
+// The CKEDITOR.skin.chameleon function must be defined. It must return the CSS
+// "template" to be used to change the color of a specific CKEditor instance
+// available in the page. When a color change is required, this template is
+// appended to the page holding the editor, overriding styles defined in the
+// skin files.
+//
+// The "$color" placeholder can be used in the returned string. It'll be
+// replaced with the desired color.
+CKEDITOR.skin.chameleon = ( function() {
+        // This method can be used to adjust colour brightness of various element.
+        // Colours are accepted in 7-byte hex format, for example: #00ff00.
+        // Brightness ratio must be a float number within [-1, 1],
+        // where -1 is black, 1 is white and 0 is the original colour.
+        var colorBrightness = ( function() {
+                function channelBrightness( channel, ratio ) {
+                        var brighten = ratio < 0 ? (
+                                        0 | channel * ( 1 + ratio )
+                                ) : (
+                                        0 | channel + ( 255 - channel ) * ratio
+                                );
+                        return ( '0' + brighten.toString( 16 ) ).slice( -2 );
+                }
+                return function( hexColor, ratio ) {
+                        var channels = hexColor.match( /[^#]./g );
+                        for ( var i = 0 ; i < 3 ; i++ )
+                                channels[ i ] = channelBrightness( parseInt( channels[ i ], 16 ), ratio );
+                        return '#' + channels.join( '' );
+                };
+        } )(),
+        // Use this function just to avoid having to repeat all these rules on
+        // several places of our template.
+        verticalGradient = ( function() {
+                var template = new CKEDITOR.template( 'background:#{to};' +
+                        'background-image:linear-gradient(to bottom,{from},{to});' +
+                        'filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr=\'{from}\',endColorstr=\'{to}\');' );
+                return function( from, to ) {
+                        return template.output( { from: from, to: to } );
+                };
+        } )(),
+        // Style templates for various user interface parts:
+        //      * Default editor template.
+        //      * Default panel template.
+        templates = {
+                editor: new CKEDITOR.template(
+                        '{id}.cke_chrome [border-color:{defaultBorder};] ' +
+                        '{id} .cke_top [ ' +
+                                        '{defaultGradient}' +
+                                        'border-bottom-color:{defaultBorder};' +
+                                '] ' +
+                        '{id} .cke_bottom [' +
+                                        '{defaultGradient}' +
+                                        'border-top-color:{defaultBorder};' +
+                                '] ' +
+                        '{id} .cke_resizer [border-right-color:{ckeResizer}] ' +
+                        // Dialogs.
+                        '{id} .cke_dialog_title [' +
+                                        '{defaultGradient}' +
+                                        'border-bottom-color:{defaultBorder};' +
+                                '] ' +
+                        '{id} .cke_dialog_footer [' +
+                                        '{defaultGradient}' +
+                                        'outline-color:{defaultBorder};' +
+                                        'border-top-color:{defaultBorder};' +   // IE7 doesn't use outline.
+                                '] ' +
+                        '{id} .cke_dialog_tab [' +
+                                        '{lightGradient}' +
+                                        'border-color:{defaultBorder};' +
+                                '] ' +
+                        '{id} .cke_dialog_tab:hover [' +
+                                        '{mediumGradient}' +
+                                '] ' +
+                        '{id} .cke_dialog_contents [' +
+                                        'border-top-color:{defaultBorder};' +
+                                '] ' +
+                        '{id} .cke_dialog_tab_selected, {id} .cke_dialog_tab_selected:hover [' +
+                                        'background:{dialogTabSelected};' +
+                                        'border-bottom-color:{dialogTabSelectedBorder};' +
+                                '] ' +
+                        '{id} .cke_dialog_body [' +
+                                        'background:{dialogBody};' +
+                                        'border-color:{defaultBorder};' +
+                                '] ' +
+                        // Toolbars, buttons.
+                        '{id} .cke_toolgroup [' +
+                                        '{lightGradient}' +
+                                        'border-color:{defaultBorder};' +
+                                '] ' +
+                        '{id} a.cke_button_off:hover, {id} a.cke_button_off:focus, {id} a.cke_button_off:active [' +
+                                        '{mediumGradient}' +
+                                '] ' +
+                        '{id} .cke_button_on [' +
+                                        '{ckeButtonOn}' +
+                                '] ' +
+                        '{id} .cke_toolbar_separator [' +
+                                        'background-color: {ckeToolbarSeparator};' +
+                                '] ' +
+                        // Combo buttons.
+                        '{id} .cke_combo_button [' +
+                                        'border-color:{defaultBorder};' +
+                                        '{lightGradient}' +
+                                '] ' +
+                        '{id} a.cke_combo_button:hover, {id} a.cke_combo_button:focus, {id} .cke_combo_on a.cke_combo_button [' +
+                                        'border-color:{defaultBorder};' +
+                                        '{mediumGradient}' +
+                                '] ' +
+                        // Elementspath.
+                        '{id} .cke_path_item [' +
+                                        'color:{elementsPathColor};' +
+                                '] ' +
+                        '{id} a.cke_path_item:hover, {id} a.cke_path_item:focus, {id} a.cke_path_item:active [' +
+                                        'background-color:{elementsPathBg};' +
+                                '] ' +
+                        '{id}.cke_panel [' +
+                                'border-color:{defaultBorder};' +
+                        '] '
+                ),
+                panel: new CKEDITOR.template(
+                        // Panel drop-downs.
+                        '.cke_panel_grouptitle [' +
+                                        '{lightGradient}' +
+                                        'border-color:{defaultBorder};' +
+                                '] ' +
+                        // Context menus.
+                        '.cke_menubutton_icon [' +
+                                        'background-color:{menubuttonIcon};' +
+                                '] ' +
+                        '.cke_menubutton:hover .cke_menubutton_icon, .cke_menubutton:focus .cke_menubutton_icon, .cke_menubutton:active .cke_menubutton_icon [' +
+                                        'background-color:{menubuttonIconHover};' +
+                                '] ' +
+                        '.cke_menuseparator [' +
+                                        'background-color:{menubuttonIcon};' +
+                                '] ' +
+                        // Color boxes.
+                        'a:hover.cke_colorbox, a:focus.cke_colorbox, a:active.cke_colorbox [' +
+                                        'border-color:{defaultBorder};' +
+                                '] ' +
+                        'a:hover.cke_colorauto, a:hover.cke_colormore, a:focus.cke_colorauto, a:focus.cke_colormore, a:active.cke_colorauto, a:active.cke_colormore [' +
+                                        'background-color:{ckeColorauto};' +
+                                        'border-color:{defaultBorder};' +
+                                '] '
+                )
+        };
+        return function( editor, part ) {
+                var uiColor = editor.uiColor,
+                        // The following are CSS styles used in templates.
+                        // Styles are generated according to current editor.uiColor.
+                        templateStyles = {
+                                // CKEditor instances have a unique ID, which is used as class name into
+                                // the outer container of the editor UI (e.g. ".cke_1").
+                                //
+                                // The Chameleon feature is available for each CKEditor instance,
+                                // independently. Because of this, we need to prefix all CSS selectors with
+                                // the unique class name of the instance.
+                                id: '.' + editor.id,
+                                // These styles are used by various UI elements.
+                                defaultBorder: colorBrightness( uiColor, -0.1 ),
+                                defaultGradient: verticalGradient( colorBrightness( uiColor, 0.9 ), uiColor ),
+                                lightGradient: verticalGradient( colorBrightness( uiColor, 1 ), colorBrightness( uiColor, 0.7 ) ),
+                                mediumGradient: verticalGradient( colorBrightness( uiColor, 0.8 ), colorBrightness( uiColor, 0.5 ) ),
+                                // These are for specific UI elements.
+                                ckeButtonOn: verticalGradient( colorBrightness( uiColor, 0.6 ), colorBrightness( uiColor, 0.7 ) ),
+                                ckeResizer: colorBrightness( uiColor, -0.4 ),
+                                ckeToolbarSeparator: colorBrightness( uiColor, 0.5 ),
+                                ckeColorauto: colorBrightness( uiColor, 0.8 ),
+                                dialogBody: colorBrightness( uiColor, 0.7 ),
+                                // Use gradient instead of simple hex to avoid further filter resetting in IE.
+                                dialogTabSelected: verticalGradient( '#FFFFFF', '#FFFFFF' ),
+                                dialogTabSelectedBorder: '#FFF',
+                                elementsPathColor: colorBrightness( uiColor, -0.6 ),
+                                elementsPathBg: uiColor,
+                                menubuttonIcon: colorBrightness( uiColor, 0.5 ),
+                                menubuttonIconHover: colorBrightness( uiColor, 0.3 )
+                        };
+                return templates[ part ]
+                        .output( templateStyles )
+                        .replace( /\[/g, '{' )                          // Replace brackets with braces.
+                        .replace( /\]/g, '}' );
+        };
+} )();
+// %REMOVE_START%
+// 4. Register the skin icons for development purposes only
+// ----------------------------------------------------------
+// (http://docs.cksource.com/CKEditor_4.x/Skin_SDK/Icons)
+//
+// Note: As "moono" is the default CKEditor skin, it provides no custom icons,
+// thus this code is commented out.
+//
+// This code is here just to make the skin work fully when using its "source"
+// version. Without this, the skin will still work, but its icons will not be
+// used (again, on source version only).
+//
+// This block of code is not necessary on the release version of the skin.
+// Because of this it is very important to include it inside the REMOVE_START
+// and REMOVE_END comment markers, so the skin builder will properly clean
+// things up.
+//
+// If a required icon is not available here, the plugin defined icon will be
+// used instead. This means that a skin is not required to provide all icons.
+// Actually, it is not required to provide icons at all.
+//
+// (function() {
+//              // The available icons. This list must match the file names (without
+//              // extension) available inside the "icons" folder.
+//              var icons = ( 'about,anchor-rtl,anchor,bgcolor,bidiltr,bidirtl,blockquote,' +
+//                      'bold,bulletedlist-rtl,bulletedlist,button,checkbox,copy-rtl,copy,' +
+//                      'creatediv,cut-rtl,cut,docprops-rtl,docprops,find-rtl,find,flash,form,' +
+//                      'hiddenfield,horizontalrule,icons,iframe,image,imagebutton,indent-rtl,' +
+//                      'indent,italic,justifyblock,justifycenter,justifyleft,justifyright,' +
+//                      'link,maximize,newpage-rtl,newpage,numberedlist-rtl,numberedlist,' +
+//                      'outdent-rtl,outdent,pagebreak-rtl,pagebreak,paste-rtl,paste,' +
+//                      'pastefromword-rtl,pastefromword,pastetext-rtl,pastetext,preview-rtl,' +
+//                      'preview,print,radio,redo-rtl,redo,removeformat,replace,save,scayt,' +
+//                      'select-rtl,select,selectall,showblocks-rtl,showblocks,smiley,' +
+//                      'source-rtl,source,specialchar,spellchecker,strike,subscript,' +
+//                      'superscript,table,templates-rtl,templates,textarea-rtl,textarea,' +
+//                      'textcolor,textfield-rtl,textfield,uicolor,underline,undo-rtl,undo,unlink' ).split( ',' );
+//
+//              var iconsFolder = CKEDITOR.getUrl( CKEDITOR.skin.path() + 'icons/' + ( CKEDITOR.env.hidpi ? 'hidpi/' : '' ) );
+//
+//              for ( var i = 0; i < icons.length; i++ ) {
+//                      CKEDITOR.skin.addIcon( icons[ i ], iconsFolder + icons[ i ] + '.png' );
+//              }
+// })();
+// %REMOVE_END%
diff --git a/sources/skins/moonocolor/toolbar.css b/sources/skins/moonocolor/toolbar.css
new file mode 100644
index 0000000..afcf117
--- /dev/null
+++ b/sources/skins/moonocolor/toolbar.css
@@ -0,0 +1,387 @@
+/*
+Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+For licensing, see LICENSE.md or http://ckeditor.com/license
+*/
+/*
+toolbar.css (part of editor.css)
+==================================
+This files styles the CKEditor toolbar and its buttons. For toolbar combo
+styles, check richcombo.css.
+The toolbar is rendered as a big container (called toolbox), which contains
+smaller "toolbars". Each toolbar represents a group of items that cannot be
+separated. The following is the visual representation of the toolbox.
+-- .cke_toolbox ----------------------------------------------------------+
+| +-- .cke_toolbar --+ +-- .cke_toolbar --+ ... +-- .cke_toolbar_break --+ |
+| |                  | |                  |     |                        | |
+| +------------------+ +------------------+     +------------------------+ |
+| +-- .cke_toolbar --+ +-- .cke_toolbar --+ ...                            |
+| |                  | |                  |                                |
+| +------------------+ +------------------+                                |
+--------------------------------------------------------------------------+
+The following instead is the visual representation of a single toolbar:
+-- .cke_toolbar ----------------------------------------------------------------+
+| +-- .cke_toolbar_start --+ +-- .cke_toolgroup (*) --+ +-- .cke_toolbar_end --+ |
+| |                        | |                        | |                      | |
+| +------------------------+ +------------------------+ +----------------------+ |
+--------------------------------------------------------------------------------+
+(*) .cke_toolgroup is available only when the toolbar items can be grouped
+    (buttons). If the items can't be group (combos), this box is not available
+        and the items are rendered straight in that place.
+This file also styles toolbar buttons, which are rendered inside the above
+.cke_toolgroup containers. This is the visual representation of a button:
+-- .cke_button -------------------------------------+
+| +-- .cke_button_icon --+ +-- .cke_button_label --+ |
+| |                      | |                       | |
+| +----------------------+ +-----------------------+ |
+----------------------------------------------------+
+Special outer level classes used in this file:
+        .cke_hc: Available when the editor is rendered on "High Contrast".
+        .cke_rtl: Available when the editor UI is on RTL.
+*/
+/* The box that holds each toolbar. */
+.cke_toolbar
+{
+        float: left;
+}
+.cke_rtl .cke_toolbar
+{
+        float: right;
+}
+/* The box that holds buttons. */
+.cke_toolgroup
+{
+        float: left;
+        margin: 0 6px 5px 0;
+        border: 1px solid #a6a6a6;
+        border-bottom-color: #979797;
+        border-radius: 3px;
+        box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;
+        background: #e4e4e4;
+        background-image: linear-gradient(to bottom, #ffffff, #e4e4e4);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ffffff', endColorstr='#e4e4e4');
+}
+.cke_hc .cke_toolgroup
+{
+        border: 0;
+        margin-right: 10px;
+        margin-bottom: 10px;
+}
+.cke_rtl .cke_toolgroup
+{
+        float: right;
+        margin-left: 6px;
+        margin-right: 0;
+}
+/* A toolbar button . */
+a.cke_button
+{
+        display: inline-block;
+        height: 18px;
+        padding: 4px 6px;
+        outline: none;
+        cursor: default;
+        float: left;
+        border: 0;
+}
+.cke_ltr .cke_button:last-child,
+.cke_rtl .cke_button:first-child
+{
+        /* Don't distort parent's rounded border. */
+        border-radius: 0 2px 2px 0;
+}
+.cke_ltr .cke_button:first-child,
+.cke_rtl .cke_button:last-child
+{
+        /* Don't distort parent's rounded border. */
+        border-radius: 2px 0 0 2px;
+}
+.cke_rtl .cke_button
+{
+        float: right;
+}
+.cke_hc .cke_button
+{
+        border: 1px solid black;
+        /* Compensate the added border */
+        padding: 3px 5px;
+        margin: -2px 4px 0 -2px;
+}
+/* This class is applied to the button when it is "active" (pushed).
+   This style indicates that the feature associated with the button is active
+   i.e. currently writing in bold or when spell checking is enabled. */
+a.cke_button_on
+{
+        box-shadow: 0 1px 5px rgba(0,0,0,.6) inset, 0 1px 0 rgba(0,0,0,.2);
+        background: #b5b5b5;
+        background-image: linear-gradient(to bottom, #aaa, #cacaca);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#aaaaaa', endColorstr='#cacaca');
+}
+.cke_hc .cke_button_on,
+.cke_hc a.cke_button_off:hover,
+.cke_hc a.cke_button_off:focus,
+.cke_hc a.cke_button_off:active,
+.cke_hc a.cke_button_disabled:hover,
+.cke_hc a.cke_button_disabled:focus,
+.cke_hc a.cke_button_disabled:active
+{
+        border-width: 3px;
+        /* Compensate the border change */
+        padding: 1px 3px;
+}
+/* This class is applied to the button when the feature associated with the
+   button cannot be used (grayed-out).
+   i.e. paste button remains disabled when there is nothing in the clipboard to
+   be pasted. */
+.cke_button_disabled .cke_button_icon
+{
+        opacity: 0.3;
+}
+.cke_hc .cke_button_disabled
+{
+        opacity: 0.5;
+}
+a.cke_button_on:hover,
+a.cke_button_on:focus,
+a.cke_button_on:active
+{
+        box-shadow: 0 1px 6px rgba(0,0,0,.7) inset, 0 1px 0 rgba(0,0,0,.2);
+}
+a.cke_button_off:hover,
+a.cke_button_off:focus,
+a.cke_button_off:active,
+a.cke_button_disabled:hover,
+a.cke_button_disabled:focus,
+a.cke_button_disabled:active
+{
+        box-shadow: 0 0 1px rgba(0,0,0,.3) inset;
+        background: #ccc;
+        background-image: linear-gradient(to bottom, #f2f2f2, #ccc);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f2f2f2', endColorstr='#cccccc');
+}
+/* The icon which is a visual representation of the button. */
+.cke_button_icon
+{
+        cursor: inherit;
+        background-repeat: no-repeat;
+        margin-top: 1px;
+        width: 16px;
+        height: 16px;
+        float: left;
+        display: inline-block;
+}
+.cke_rtl .cke_button_icon
+{
+        float: right;
+}
+.cke_hc .cke_button_icon
+{
+        display: none;
+}
+/* The label of the button that stores the name of the feature. By default,
+   labels are invisible. They can be revealed on demand though. */
+.cke_button_label
+{
+        display: none;
+        padding-left: 3px;
+        margin-top: 1px;
+        line-height: 17px;
+        vertical-align: middle;
+        float: left;
+        cursor: default;
+        color: #474747;
+        text-shadow: 0 1px 0 rgba(255,255,255,.5);
+}
+.cke_rtl .cke_button_label
+{
+        padding-right: 3px;
+        padding-left: 0;
+        float: right;
+}
+.cke_hc .cke_button_label
+{
+        padding: 0;
+        display: inline-block;
+        font-size: 12px;
+}
+/* The small arrow available on buttons that can be expanded
+   (e.g. the color buttons). */
+.cke_button_arrow
+{
+        /* Arrow in CSS */
+        display: inline-block;
+        margin: 8px 0 0 1px;
+        width: 0;
+        height: 0;
+        cursor: default;
+        vertical-align: top;
+        border-left: 3px solid transparent;
+        border-right: 3px solid transparent;
+        border-top: 3px solid #474747;
+}
+.cke_rtl .cke_button_arrow
+{
+        margin-right: 5px;
+        margin-left: 0;
+}
+.cke_hc .cke_button_arrow
+{
+        font-size: 10px;
+        margin: 3px -2px 0 3px;
+        width: auto;
+        border: 0;
+}
+/* The vertical separator which is used within a single toolbar to split
+   buttons into sub-groups. */
+.cke_toolbar_separator
+{
+        float: left;
+        background-color: #c0c0c0;
+        background-color: rgba(0,0,0,.2);
+        margin: 5px 2px 0;
+        height: 18px;
+        width: 1px;
+        box-shadow: 1px 0 1px rgba(255,255,255,.5);
+}
+.cke_rtl .cke_toolbar_separator
+{
+        float: right;
+        box-shadow: -1px 0 1px rgba(255,255,255,.1);
+}
+.cke_hc .cke_toolbar_separator
+{
+        width: 0;
+        border-left: 1px solid;
+        margin: 1px 5px 0 0px;
+}
+/* The dummy element that breaks toolbars.
+   Once it is placed, the very next toolbar is moved to the new row. */
+.cke_toolbar_break
+{
+        display: block;
+        clear: left;
+}
+.cke_rtl .cke_toolbar_break
+{
+        clear: right;
+}
+/* The button, which when clicked hides (collapses) all the toolbars. */
+a.cke_toolbox_collapser
+{
+        width: 12px;
+        height: 11px;
+        float: right;
+        margin: 11px 0 0;
+        font-size: 0;
+        cursor: default;
+        text-align: center;
+        border: 1px solid #a6a6a6;
+        border-bottom-color: #979797;
+        border-radius: 3px;
+        box-shadow: 0 1px 0 rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.15) inset, 0 1px 0 rgba(255,255,255,.15) inset;
+        background: #e4e4e4;
+        background-image: linear-gradient(to bottom, #ffffff, #e4e4e4);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ffffff', endColorstr='#e4e4e4');
+}
+.cke_toolbox_collapser:hover
+{
+        background: #ccc;
+        background-image: linear-gradient(to bottom, #f2f2f2, #ccc);
+        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#f2f2f2', endColorstr='#cccccc');
+}
+.cke_toolbox_collapser.cke_toolbox_collapser_min
+{
+        margin: 0 2px 4px;
+}
+.cke_rtl .cke_toolbox_collapser
+{
+        float: left;
+}
+/* The CSS arrow, which belongs to the toolbar collapser. */
+.cke_toolbox_collapser .cke_arrow
+{
+        display: inline-block;
+        /* Pure CSS Arrow */
+        height: 0;
+        width: 0;
+        font-size: 0;
+        margin-top: 1px;
+        border-left: 3px solid transparent;
+        border-right: 3px solid transparent;
+        border-bottom: 3px solid #474747;
+        border-top: 3px solid transparent;
+}
+.cke_toolbox_collapser.cke_toolbox_collapser_min .cke_arrow
+{
+        margin-top: 4px;
+        border-bottom-color: transparent;
+        border-top-color: #474747;
+}
+.cke_hc .cke_toolbox_collapser .cke_arrow
+{
+        font-size: 8px;
+        width: auto;
+        border: 0;
+        margin-top: 0;
+        margin-right: 2px;
+}