/* ==========================================================
 * MangoLight Editor 0.1
 * http://www.mangolight.com/labs/mangolight_editor
 * ==========================================================
 * Copyright 2014 MangoLight / http://www.mangolight.com
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 * ========================================================== */
body{margin:0;padding:0;font-family:'Oxygen',sans-serif;font-size:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;}
body.wait *{cursor:wait;}
input,button,select{font-family:'Oxygen',sans-serif;outline:0!important;box-sizing:border-box;}
#top_bar,#project_selector,#browser,#tabs,#editor,#functions_search,#functions,#log{position:fixed;height:100%;}
#browser,#tabs,#functions_search,#functions,#log{overflow-y:scroll;}
#browser,#tabs,#editors{height:auto;bottom:0;}
#top_bar{top:0;left:0;width:100%;height:35px;}
#logo{margin-left:1px;}
#logo img{width:35px;float:left;}
#logo span{font-size:19px;padding:0;float:left;font-weight:bold;margin:3px;font-family:'Oxygen';}
#top_bar .fa{margin:5px;font-size:25px;cursor:pointer;}
#top_bar .toolbar{float:right;}
#project_selector{top:35px;left:0;height:25px;width:14%;opacity:0.4;}
#project_selector .fa-refresh{font-size:18px;cursor:pointer;margin-left:3px;margin-top:3px;}
#browser{top:82px;left:0;width:14%;font-size:14px;line-height:1.4;background:#111;z-index:999;}
#browser:hover{width:33%;}
#browser ul{padding-left:7px;}
#browser > ul{padding-left:5px;}
#browser ul li{list-style:none;}
#browser ul li img{float:left;margin-right:3px;}
.open_file,.open_folder{display:inline-block;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:100px;}
.open_folder.site{margin-bottom:5px;}
#search_files{top:60px;left:0;position:fixed;width:14%;padding:1px 5px 1px 25px;}
.search_box{opacity:0.4;border-radius:10px;border:1px solid grey;}
.search_box:focus,select{opacity:1;outline:0;}
#tabs{top:35px;left:80%;width:10%;font-size:11px;overflow-x:hidden;z-index:2;}
#tabs ul,#functions ul{margin:0;padding:0;}
#tabs li{cursor:pointer;display:inline-block;white-space:nowrap;width:100%;margin:0;padding:6px 8px;list-style:none;background:#444;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),inset 0 -1px 0 rgba(0,0,0,0.2);opacity:0.7;vertical-align:top;position:relative;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;}
#tabs li.active{background:#555;opacity:1!important;border-left:3px solid;}
#tabs li[data-site^="mangolight_editor_browser"],.editor[data-site^="mangolight_editor_browser"] .bar{background:#E90F5D;}
.button,.close{position:absolute;top:2px;width:20px;height:20px;border-radius:3px;background:rgba(255,255,255,0.5);color:#000;font-size:15px;text-align:center;border:1px solid #000;line-height:20px;cursor:pointer;opacity:0.2;}
.button:hover,.close:hover{opacity:1!important;}
.close .fa{padding-top:2px;}
.maximize .fa{padding-top:3px;}
.close{right:2px;display:none;}
.maximize{right:26px;}
.to_right,.to_left{font-size:19px;}
.to_right{right:50px;}
.to_left{right:74px;}
.to_left .fa{margin-left:-1px;}
.to_right .fa{margin-left:1px;}
.minimize{right:98px;}
.minimize .fa{margin-top:3px;}
#tabs li:hover{opacity:0.9;}
#tabs li:hover .close{display:block;opacity:0.9;}
.close:hover{opacity:1!important;}
#editor{top:35px;left:14%;width:auto;z-index:2;right:20%;bottom:0;height:auto;}
#editor.fullmode{left:0!important;}
#mangolight_editor{position:relative;top:0;left:0;width:100%;height:100%;display:none;}
.bar{background:#444;display:block;width:100%;height:26px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,0.2),inset 0 -1px 0 rgba(0,0,0,0.2);cursor:-webkit-grab;}
.bar.grabbing{cursor:-webkit-grabbing;}
.editor.active .button{opacity:0.5;}
.window_title{font-size:14px;padding:3px 6px;vertical-align:top;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding-right:120px;}
.bar .close{display:block;}
.content{width:100%;height:100%;}
.image_viewer{background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAaElEQVR42p2SYQpAIQiDu//V9E4v+jEYj5XTQEqzj5muiPgyU9q5q9biZD7DHwHYLwHqIWKtEpSKVgljwKsLtoIXpARUCbf5gNkA7gzDxgqwlwBOVipsgBo0u4Rbl+xPVADE2p/4L2ED+UCvRbBvbZgAAAAASUVORK5CYII=');position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;}
.browser iframe{width:100%;height:100%;border:0;background:white;}
#functions_search{top:35px;left:90%;width:10%;height:25px;}
#functions_search input{font-size:12px;width:100%;padding:2px 5px 2px 19px;}
#functions{top:60px;left:90%;width:10%;font-family:'Oxygen Mono';font-size:12px;height:auto;bottom:200px;line-height:1.4;}
#functions li{list-style:none;cursor:pointer;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#log{bottom:0;left:90%;width:10%;height:200px;font-family:'Oxygen Mono';font-size:10px;letter-spacing:-1px;line-height:1.1;overflow-x:hidden;word-break:break-all;box-sizing:border-box;}
.success{color:darkgreen;}
.error{color:darkred;}
.layer{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999999999;display:none;}
.menu{position:fixed;width:150px;top:200px;left:200px;display:none;z-index:999999999;margin:0;padding:0;font-size:15px;}
.menu li{list-style:none;padding:2px;cursor:pointer;}
.menu .sep{padding:0;cursor:normal;}
.menu .fa{width:20px;text-align:center;}
#upload_form,#upload_frame{display:none;}
.fa-search{position:fixed;color:#333;position:fixed;z-index:1;}
.icon_search_files{top:63px;left:5px;font-size:14px;}
.icon_search_text{bottom:11px;}
.icon_search_functions{font-size:13px;top:40px;margin-left:5px;}

::-webkit-scrollbar{width:10px;height:10px;}

.ui-resizable{position:absolute;}
.ui-resizable-handle{position:absolute;font-size:0.1px;display:block;}
.ui-resizable-disabled .ui-resizable-handle,.ui-resizable-autohide .ui-resizable-handle{display:none;}
.ui-resizable-n{cursor:n-resize;height:5px;width:100%;top:0;left:0;}
.ui-resizable-s{cursor:s-resize;height:5px;width:100%;bottom:0;left:0;}
.ui-resizable-e{cursor:e-resize;width:5px;right:0;top:0;height:100%;}
.ui-resizable-w{cursor:w-resize;width:5px;left:0;top:0;height:100%;}
.ui-resizable-se{cursor:se-resize;width:10px;height:10px;right:0;bottom:0;}
.ui-resizable-sw{cursor:sw-resize;width:10px;height:10px;left:0;bottom:0;}
.ui-resizable-nw{cursor:nw-resize;width:10px;height:10px;left:0;top:0;}
.ui-resizable-ne{cursor:ne-resize;width:10px;height:10px;right:0;top:0;}

.window{display:block;width:200px;margin:auto;padding:10px;}
#login_layer.config_not_set{display:none!important;}
#login_form{width:300px;margin-top:100px;}
#settings_form{width:550px;margin-top:50px;}
#about_layer .window{width:520px;margin-top:50px;}
.layer input,.layer button,.layer select{padding:5px 10px;}
.layer button{cursor:pointer;margin-top:10px;}
.layer textarea{font-size:12px;width:100%;display:block;resize:vertical;}
#login_form input{width:300px;margin:5px 0 10px;}
#login_form button{width:100%;}
#settings_form fieldset{margin-bottom:10px;}
#settings_form .user,#settings_form .theme{display:inline-block;vertical-align:top;box-sizing:border-box;}
#settings_form .user{width:276px;}
#settings_form .theme{margin-left:10px;width:254px;}
#settings_form label{display:inline-block;width:110px;}
#settings_form input{width:140px;}
#settings_form input[type="checkbox"]{width:10px;}
#settings_form select{width:118px;}
#settings_form tr .actions{padding-left:4px;opacity:0;cursor:pointer;}
#settings_form tr:hover .actions{opacity:1;}
#settings_form table{width:100%;}
#settings_form tbody{display:block;height:114px;overflow-y:scroll;}
#settings_form td:nth-child(1){padding-right:5px;}
#settings_form td:nth-child(2){width:100px;}
#settings_form td:nth-child(3){width:35px;}
#settings_form table input{width:100%;padding:5px;}
#settings_form button{width:100px;}
#settings_form button:last-child{float:right;}
#about_layer{text-align:center;}

#search_results{position: absolute;bottom: 10%;left: 12%;background: #1a1a1a;width: 76%;height: 30%;z-index: 99;box-shadow: 0 0 10px black;}
#search_results ul{margin:0;padding:0;height:100%;overflow-y:scroll;}
#search_results li{list-style:none;margin-left:13px;}
#search_results li:first-child{margin-top:10px;}
#search_results li:last-child{margin-bottom:10px;}
.search_loading{position:absolute;left:50%;margin-left:-50px;top:50%;margin-top:-50px;}
.close_search{display: block;cursor: pointer;background: #ddd;border-radius: 100px;margin: -10px;padding: 5px;color: black;text-align: center;box-shadow: inset 0 -3px 4px rgba(0,0,0,0.2);width: 20px;height: 20px;top: 0;right: 0;position: absolute;font-weight: bold;}
.close_search:hover{background-color:#eee;}
.open_search{display: inline-block;cursor: pointer;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;min-width: 100px;}
.open_search img{float:left;margin-right:3px;}
.open_search:hover{color:#ff6f1c;}
.no_result{text-align: center;color: red;font-style: italic;}

.ace_editor{font-family:'Oxygen Mono',monospace;font-size:12px;}
.ace_dark .ace_search{background-color:#333;border:1px solid #222;}
.ace_dark .ace_search_form,.ace_dark .ace_replace_form{border:1px solid #666;}
.ace_dark .ace_search_field{background-color:#555;border-right:1px solid #555;color:#bbb;}
.ace_dark .ace_searchbtn,.ace_dark .ace_replacebtn{background-color:#333;border-left:1px solid #555;color:#777;}
.ace_searchbtn, .ace_replacebtn{padding:0 5px!important;}
.ace_dark .ace_button{border:1px solid #555;color:#777;}
.ace_dark .ace_button:hover{background-color:#444;}
.ace_tooltip{height:auto;white-space:normal!important;max-width:200px!important;font-size:13px;}

@media (max-width:700px){
    .close{display:block;}
    #tabs{width:70px;left:0;}
    #tabs li{width:44px;}
    #functions_search,#functions,#log{display:none;}
    #editor{right:0;left:70px;}
    #project_selector,#search_files,#browser{width:100%;background-color:#222;}
    .search_box{opacity:1;}
    .ace_editor{font-size:9px!important;}
}