html  {
	overflow: hidden;
	color:#eeeeee;
//	border: solid aliceblue;
	background-color:#111111;			/*	PREFER A DARK THEME*/
 
}  
body {
 	    caret-color: orangered;
}
details {
    border: fuchsia;
    border-style: solid ;
    border-width: thin;
}
summary {
    border: darkslategrey;
    border-style: dashed;
    border-width: thin;
}
header {
   position:  absolute;
   background-color: darkblue;
   top: 0;
   width: 90%;
   border-bottom: 1px solid gray;
   color: inherit;
   opacity: 75%;
}
footer {
   position: absolute;
   bottom: 0;
   width: 90%;
   background-color: darkblue;
   color: inherit;
   opacity: 75%;
}


@keyframes blink { 
   50% { border-color: #ff0000; } 
}
caret,
.caret {       //As a span class='caret'
	width: 6px;        
	height: 6px;   
	display: inline;
    border: 3px solid blue;
	animation: blink .5s step-end infinite alternate;
}
.highlight {
  animation: highlight linear 3s;
}

@keyframes highlight {
  from { outline: 1px solid #ff0f; }
  to   { outline: 1px solid #f000; }
}
	.highlight2 { background-color: yellow; color: red;}
	.titlespan {
		float:left;
		display: block;
		
	}
	textarea,pre {
	    -moz-tab-size : 4;
	      -o-tab-size : 4;
		tab-size : 4;
	}
	a {    color: cyan;}
	#title_bar{
		float: left;
	    width:100%;
 
	}
	#idCmdBar  *{/*The command bar*/
		z-index: 10;/*Atitle bar above anythign*/
	}
	#idMessage{
		position: absolute;
		top: 4%;
		width: 90vw;
		background: #610b02;
		font-weight: bold;
		font-style: italic;
		z-index: 10;
	}
	code {
		word-break: break-all;
	}
 	.observe{
		  text-decoration: underline;
  		text-decoration-color: red;
	}
    .hidden{
	    display:none;
	}
	.listing {
    	overflow-y: auto;
		height: 90%;
	}
	.idFilepathcontainer {
		display: flex;
		float: none; 
		background-color: darkblue;
	}
	.idFilepathcontainer>label{
		font-size: 1.3em;
		width: 100%;	
		text-align: center;		
	}
	#idRTFEdit{
		    white-space: normal;
	}
	#idFilepath{
		width: 100%;
	}
	#unsaved_tag{
			background:yellow
	}
	.edit {
		height:98%;
		width:100%;
		overflow: auto;
		line-height: 1 ;
		font-size:16px; 
		padding:1px;
		margin: 1px;
		box-sizing: border-box;
		left:60px;
		color:#eeeeee;
		resize : none;
		float:left;
	}
	#edit_div{
		white-space: nowrap;
		position: relative;
		width: calc(100%);
		 height: calc(100% - 	40px);
	    display: flex;									/*Share the space*/
 
 
	}
    #editor, #edit_line, .edit{
		background: inherit;					/*Use documents background*/	
		color:#eeeeee;
	}
	#editor, #edit_line{
		line-height: 1 ;
		font-size:16px;
		//border:solid aliceblue;
		height:100%;
		padding:1px;
		margin: 1px;
		box-sizing: border-box;
	}
	#edit_line{
		width: 60px;
		overflow:hidden;
		resize : none;
		float:left;
		text-align:right;
		padding: 3px;
	}	            	
/*						RTF FORMATTING     */
h1 {font-size:1.3em;
	page-break-before: auto;
    text-align: center;
    color: yellow;
}
h2 {font-size:1.2em;
	text-decoration: underline;
	page-break-before: auto;
	}
h3 {
	font-size:1.1em;
	page-break-before: auto;
	font-weight: bold;
    font-style: italic;
}
/****************************POSTIT NOTES	********************************/
/* POST IT NOTES*/
	.cPostIt{	/*190920		Resizing*/
		height: auto; 
		opacity:1;
		width: 150px; 
		border:  solid yellow;	
		border-radius: 10px;
		overflow: auto; background: black;
		z-index: 10;
	   resize: auto;
	   background:blue;
	}

	.contents {     /*Rev 190920  */
		height: auto; 
		min-height: 1em;	/*At least one line  height*/
		margin: 2px;   
	}
	.handle {  
		background: blue; 
		font-size:small;
		text-align: left;
		margin: auto;
	}
	.handle::before {
	  content: "⚓";
	}
	.close {  
		float:right; 
		color:white;
		margin: 2px;  
		background: black;         
		opacity:1
		padding: 2px; 
	} 
	#idPostItSVG {			
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 0;
		pointer-events: none;	/*	Dont react to mouse */
		overflow: visible;		/*	Allow all graphics to be displayed*/	
	}
	#idPostItSVG line{
		pointer-events: all;
	}
	

 /*************************************PRINT OUT ***********************************/
@media print {	
	html,* {
		background-color:white;
		color:black;
			visibility: hidden;
	}	  
	/*		NOT TO PRINT */
	#idMessage 
	,#title_bar
	,#warnings {
		 visibility: hidden;
		 display:none;
	}
	#edit_div * {
		 visibility: visible;
		 overflow: visible;
	}
	#edit_div   {
		 visibility: visible;
		         left: 0px;
        top: 0px;
        position:absolute;
    }
    p {
        page-break-before: always;
    }
}	/*END PRINT*/