.uiIcon{
    display: inline-block;     
	position:fixed;
	overflow:none;
	width:30px;
	height:30px;	
	background-color: #FFFFFF;
	border: 2px solid #000000;
	cursor:default;
    	border-radius:50%;
	font-size:25px;
    	color:#000000;
      	text-align: center;
	display: inline-block;
  	vertical-align: middle;   
	margin:0px;
	padding:0px;
	line-height:100%;
	  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.uiDefault
{
    background-color: #343a40;
    color: #fff !important;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    overflow:hidden;
}

.uiHidden
{
    display:none !important;
}

.uiPaletteIcon
{
	right:30px;
	top:120px;
}


.uiOutlineIcon
{
	right:30px;
	bottom:30px;
}

.uiToolIcon
{
	right:30px;
	bottom:30px;
}


.uiIcon:hover{
	position:fixed;
	overflow:none;
	width:30px;
	height:30px;	
	background-color: #6c757d;
	border: 2px solid #000000;
	cursor:default;
    	border-radius:50%;
   	font-size:25px;
    	color:#ffffff;
      	text-align: center;
	display: inline-block;
  	vertical-align: middle;   
	margin:0px;
	padding:0px;
	line-height:100%;
	cursor:pointer;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.uiBox
{
  border-radius: 20px;
  background-color: #343a40;
  padding: 20px;
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  box-shadow: 10px 10px 5px #aaaaaa;
}

.uiEditorBox
{
    max-height: 35%;
}

.uiModal
{  
  background-color: #343a40 !important;
  -webkit-border-radius: 30px !important;
  -moz-border-radius: 30px !important;
  border-radius: 30px !important;
  color: #fff !important;
}

.uiPropertiesColumn
{
    min-width:150px;
}


.uiInputField
{
    width:95%;
}

.uiInputFieldNumeric
{
    width:95%;
}

.uiInputFIeldNumericButtons
{
    height:25px !important;
    width:25px !important;
}

.uiModalCloseButton
{
    color:#fff !important;;
}



.uiIcon:active{
	position:fixed;
	overflow:none;
	width:30px;
	height:30px;	
	background-color: #ddd;
	border: 2px solid #000000;
	cursor:default;
    	border-radius:50%;
   	font-size:25px;
    	color:#000000;
      	text-align: center;
	display: inline-block;
  	vertical-align: middle;   
	margin:0px;
	padding:0px;
	line-height:100%;
	cursor:pointer;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.uiPalette {
  display: inline-flex; 
  position:fixed;
  overflow:hidden;
  right:33px;
  top:155px;
  border-radius: 20px;
  background: #ccc;
  padding: 20px;
  font-family:Arial;
}

.uiTreeViewIcon
{
	left:30px;
	top:120px;
}

.uiPropertiesIcon
{
	left:30px;
    bottom:30px;
}

.propertiesBox
{
  display:inline-flex;
  position:fixed;
  text-align:center;
  left:33px;
  bottom:50px;
  color: #fff;
  overflow:hidden;
}

.propertiesTable
{
    width:100%;
    height:100%;
}


.uiScrollBox
{
    display:inline-flex;
    overflow:auto; 
    padding-right: 10px;
    margin:0px;    
}


.treeViewBox
{
    display:inline-flex;
    position:fixed;
    left:33px;
    top:155px; 
    padding: 20px;  
    overflow-x:hidden;
    overflow-y:hidden;
}

.treeViewContainer
{
    display:inline-flex;
    padding: 10px;
    margin:0px;
    overflow:auto;
}


.propertiesViewContainer
{
    display:inline-flex;
    padding: 0px;
    margin:0px;
    overflow:auto;
    justify-content: center;
    align-content: stretch;
}

.uiActive{
	background-color: #fff;
}


.outlineBox
{
  position:fixed;
  overflow:hidden;
  right:33px;
  bottom:50px;
  width:200px;
}

.outlineCanvas
{
	background-color:#fff;
	border: 2px solid #000000;
}


.uiAttachedPane {
	position: relative;
	background: #88b7d5;
	border: 4px solid #c2e1f5;
}

.uiPointer:after .uiPointer:before{
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none; 
}

.uiPointer:after {
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #88b7d5;
	border-width: 50px;
	margin-top: -50px;
}

.uiPointer:before {
	border-color: rgba(194, 225, 245, 0);
	border-right-color: #c2e1f5;
	border-width: 56px;
	margin-top: -56px;
}

.uiLayout{
    width:50%;
    position: fixed;
}

.uiLeft {
    display: inline-block;
    position: absolute;
    left: 0;
    margin-top:10px; 
}

.uiRight {
    font-family:Sans-Serif;
    margin-top:10px; 
    display: inline-block;
    position: absolute;
    right: 0;
}

.uiCloseButton
{
  border: none;
  padding: 0;
  background: none;
}

.uiSideButton
{   
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    text-align: center;
    width: 120px;
    height: 30px;
    background-color: rgba(52, 58, 64,0.5);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.uiSideButtonLeft
{
    -moz-border-radius: 0px 0px 10px 10px;
    -webkit-border-radius: 0px 0px 10px 10px;
    border-radius: 0px 0px 10px 10px;
}

.uiSideButtonRight
{
    -moz-border-radius: 10px 10px 0px 0px;
    -webkit-border-radius: 10px 10px 0px 0px;
    border-radius: 10px 10px 0px 0px;
}


.uiPaletteSideButton
{
    display: inline-block; 
	position:fixed;
	overflow:none;
    right:-45px;
    top:200px;
}

.uiOutlineSideButton
{
    display: inline-block; 
	position:fixed;
	overflow:none;
    right:-45px;
    bottom:95px;
}

.uiTreeSideButton
{
    display: inline-block; 
	position:fixed;
	overflow:none;
    left:-45px;
    top:200px;
}

.uiDetailsSideButton
{
    display: inline-block; 
	position:fixed;
	overflow:none;
    left:-45px;
    bottom:95px;
}

.uiActiveSideButton
{
    background-color: rgba(52, 58, 64,1);
}

.unsavedIcon {
    height: 10px;
    width: 10px;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
  }