1 files changed, 66 insertions, 66 deletions

diff --git a/css/ninja.css b/css/ninja.css
index ba434f42..f085f6be 100644..100755
--- a/css/ninja.css
+++ b/css/ninja.css
@@ -36,7 +36,7 @@ input[type="search"].nj-skinned::-webkit-search-cancel-button:after { content: "
 
 button.nj-skinned { font-size: 9px; cursor: pointer; display: block; border: 0px; margin: 0px; padding: 4px; border: 1px #313131 solid; background-color: #474747; background-image: -webkit-linear-gradient(top, #505050 0%, #3c3c3c 100%); border-radius: 4px; color: white; text-transform: uppercase; cursor: pointer; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); }
 
-button.nj-skinned:active { background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #505050 100%); }
+button.nj-skinned:active, button.nj-skinned.active { background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #505050 100%); }
 
 button.nj-skinned:hover { -webkit-box-shadow: 0px 0px 3px #b4b4b4; }
 
@@ -74,13 +74,13 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #appWorkspace { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; -webkit-box-sizing: stretch; position: relative; padding: 2px 0px; border: 1px solid #333; overflow: hidden; }
 
-#topMenu { background-color: #474747; position: absolute; height: 28px; width: 100%; top: 0px; left: 0px; z-index: 9999; }
+#topMenu { background-color: #474747; position: absolute; height: 28px; width: 100%; top: 0px; left: 0px; z-index: 6995; }
 
 #topPanelContainer, #leftPanelContainer, #rightPanelContainer, #bottomPanelContainer { background-color: #282828; }
 
 #topPanelContainer { overflow: hidden; margin-bottom: 2px; height: 32px; }
 
-#bottomPanelContainer { background: transparent; min-height: 80px; max-height: 50%; overflow: auto; }
+#bottomPanelContainer { background: transparent; height: 150px; min-height: 80px; max-height: 50%; overflow: auto; }
 
 .panelContainer { display: block; -webkit-box-orient: vertical; position: relative; }
 
@@ -118,9 +118,9 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #sceneBar { height: 70px; background-color: #474747; }
 
-#mainContainer #rulerTop { background: url("../images/temp/ruler-top.png"); height: 15px; margin-bottom: 0px; }
+#mainContainer #rulerTop { background: gray; height: 15px; margin-bottom: 0px; }
 
-#rulerLeft { background: url("../images/temp/ruler-left.png"); width: 16px; }
+#rulerLeft { background: gray; width: 16px; }
 
 #stateBar { height: 20px; background-color: #282828; margin-bottom: 0px; }
 
@@ -164,8 +164,6 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #rightPanelContent { overflow-y: hidden; }
 
-.contextMenu { position: absolute; z-index: 999; }
-
 #openDocumentsTabComponent { height: 25px; position: relative; overflow: hidden; color: white; }
 
 #openDocuments { float: left; height: 25px; width: 100%; font-size: 12px; list-style: none; margin: 0; padding: 0; position: relative; text-decoration: none; }
@@ -176,6 +174,8 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #documentBar { height: 25px; width: 1000px; position: relative; overflow: hidden; color: white; }
 
+.montage-popup-modal-mask { opacity: 1; background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.8) 80%); }
+
 #middleDocArea { -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; -moz-box-flex: 1; -webkit-box-flex: 1; box-flex: 1; margin: 1px; margin-bottom: 3px; border-style: solid; border-width: 1px; }
 
 #mainStageIFrame { border: none; margin: 4px; }
@@ -212,6 +212,10 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #mainContent .CodeMirror-scroll { height: 100%; overflow: scroll; overflow-x: auto; overflow-y: auto; }
 
+.montage-editor-frame { position: absolute; z-index: 7; top: 0; left: 0; display: none; -webkit-user-select: initial; }
+
+.montage-editor { padding: 0px; word-wrap: normal; }
+
 .panelContainer { margin: 0px; padding: 0px 0px; position: relative; overflow: auto; }
 
 .panelDisclosureIcon { background-image: url("../images/panels/panelDisclosureIcon.png"); background-repeat: no-repeat; width: 16px; height: 16px; float: left; -webkit-transition-property: rotate; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: linear; padding-right: 2px; }
@@ -236,7 +240,7 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
 
 #toolPropertiesPanel { height: 32px; margin: 0px; }
 
-#timelinePanel { height: 116px; }
+#timelinePanel { height: 100%; }
 
 .treeComponent { -webkit-user-select: none; font-size: 11px; margin-left: 20px; cursor: default; color: white; }
 
@@ -668,16 +672,12 @@ nav.menuBar ul ul, nav.menuBar ul li:hover ul ul, nav.menuBar ul ul li:hover ul
 
 nav.menuBar ul li:hover ul, nav.menuBar ul ul li:hover ul, nav.menuBar ul ul ul li:hover ul { display: block; }
 
-.toolButton { width: 26px; height: 23px; padding: 0px; margin: 1px; border-width: 1px; border-style: solid; }
+.subToolHolderPanel .toolbutton { float: left; -webkit-transform: scale(0.6); }
 
-.subToolButton { float: left; }
+.subToolHolderPanel .toolbutton:hover, .subToolHolderPanel .toolbutton.active { -webkit-transform: scale(0.75); }
 
 .subOption { float: left; margin-top: 5px; margin-left: 10px; margin-right: 10px; }
 
-.toolButton:active { border-top-width: 1px; border-top-style: solid; border-left-width: 1px; border-left-style: solid; }
-
-.toolButtonSelected { border-top-width: 1px; border-top-style: solid; border-left-width: 1px; border-left-style: solid; }
-
 .toolSeparator { height: 1px; width: 30px; }
 
 .toolSeparatorTop { margin-top: 3px; margin-bottom: 0px; }
@@ -814,90 +814,84 @@ input[type="radio"]:disabled { opacity: .3; background: #282828; border-width: 1
 
 #zoomToolOptionHolder input.zoom-option { background: none; }
 
-.SelectionToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -360px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
-
-.SelectionToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -390px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
-
-.SubselectionToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -420px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
-
-.SubselectionToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -450px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
-
-.RotateTool3DPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: 0px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+#toolsPanelContent { width: 40px; }
 
-.RotateTool3DUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -30px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.toolsList { width: 29px; margin: auto; }
 
-.Translate3DPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -120px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.toolsList hr { border: 0px; border-top: 1px solid #232323; border-bottom: 1px solid #3A3A3A; margin: 2px; }
 
-.Translate3DUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -150px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.toolbutton { width: 29px; height: 29px; background-position: center center; background-repeat: no-repeat; border-radius: 3px; opacity: 1; margin-bottom: 2px; -webkit-transform: scale(0.8); -webkit-transition: 0.15s all cubic-bezier(0.44, 0.19, 0, 0.99); }
 
-.TagToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: 0px -54px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.toolbutton:hover, .toolbutton.active { box-shadow: 0px 0px 2px 2px #999; -webkit-transform: scale(1); opacity: 1; }
 
-.TagToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -30px -54px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.toolbutton:active { background-color: #8c8c8c; }
 
-.PenToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -180px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.toolbutton.active { box-shadow: inset 0px 0px 2px 2px #555; background-color: #363636; }
 
-.PenToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -210px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.SelectionTool { background-image: url("../images/tools/Tool-Selection.png"); }
 
-.TextToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -60px -54px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.SubselectionTool { background-image: url("../images/tools/Tool-Subselect.png"); }
 
-.TextToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -90px -54px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.RotateTool3D { background-image: url("../images/tools/Tool-3DRotate.png"); }
 
-.ShapeContainerPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -120px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.Translate3D { background-image: url("../images/tools/Tool-3DTranslate.png"); }
 
-.ShapeContainerUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -150px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.TagTool { background-image: url("../images/tools/Tool-Tag.png"); }
 
-.OvalToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -120px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.PenTool { background-image: url("../images/tools/Tool-Pen.png"); }
 
-.OvalToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -150px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.TextTool { background-image: url("../images/tools/Tool-Text.png"); }
 
-.RectangleToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -300px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.ShapeContainer { background-image: url("../images/tools/Tool-Rectangle.png"); }
 
-.RectangleToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -330px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.OvalTool { background-image: url("../images/tools/Tool-Oval.png"); }
 
-.LineToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -60px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.RectangleTool { background-image: url("../images/tools/Tool-Square.png"); }
 
-.LineToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -90px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.LineTool { background-image: url("../images/tools/Tool-Line.png"); }
 
-.PencilToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -240px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.PencilTool { background-image: url("../images/tools/Tool-Pencil.png"); }
 
-.PencilToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -270px -27px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.BrushTool { background-image: url("../images/tools/Tool-PaintBrush.png"); }
 
-.BrushToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -240px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.FillTool { background-image: url("../images/tools/Tool-Fill.png"); }
 
-.BrushToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -270px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.EyedropperTool { background-image: url("../images/tools/Tool-EyeDropper.png"); }
 
-.FillToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -300px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.EraserTool { background-image: url("../images/tools/Tool-Erase.png"); }
 
-.FillToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -330px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.RotateStageTool3D { background-image: url("../images/tools/Tool-3DRotateStage.png"); }
 
-.EyedropperToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -420px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.TranslateStageTool3D { background-image: url("../images/tools/Tool-3DTranslateStage.png"); }
 
-.EyedropperToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -450px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.PanTool { background-image: url("../images/tools/Tool-Pan.png"); }
 
-.EraserToolPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -360px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.ZoomTool { background-image: url("../images/tools/Tool-Zoom.png"); }
 
-.EraserToolUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -390px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.InkBottleTool { background-image: url("../images/tools/Tool-FillColor.png"); }
 
-.RotateStageTool3DPressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -60px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 1; }
+.toolsList .colortoolbar { padding-left: 1px; padding-top: 4px; }
 
-.RotateStageTool3DUnpressed { background-image: url("../images/SpriteSheets/NinjaSpriteSheet2_5.png"); background-position: -90px 0px; background-repeat: no-repeat; height: 23px; width: 26px; opacity: 0.7; }
+.toolsList .colortoolbar button { width: 27px; height: 27px; background: black; border: 1px solid #00