#right-column-tabulator *, #display * {
  color:black; 
}
#manageMenuArea {
  display:none;
}
#far-left-column {
  width:2rem;
  max-width:2rem !important;
  text-align:center;
  float:left;
}
#left-column {
  position:absolute;
  top:0;
  right:22rem;
  bottom:0;
  left:2.5rem;
  background:transparent;
  overflow-y:auto;
  overflow-x:hidden;
  display:block;
}
.hiddenMenu #left-column {
  display:none;
}
#display {
  background:beige;
  background:#7799b7;
  background:#88aac8;
  height:48vh;
  max-height:48vh !important;
  position:absolute;
  top:0;
  margin:0 !important;
}
#right-column-tabulator, #display, #right-column {
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:22rem;
}
.hiddenMenu #right-column-tabulator, .hiddenMenu #display, .hiddenMenu #right-column {
  left:2.5rem;
}


#right-column-tabulator {
  background:white !important;
  overflow:auto;
}



#menuArea button, #manageMenu button, #toolsMenu button {
  display:block;
  margin:1rem;
  padding:0.5rem !important;
  width:17rem;
  color:#d0d0ff !important;
  background:#557795 !important;
}
#settings, #settings select, #left-column select, #left-column div {
  width:18rem !important;
}
#sidebar {
  margin-left:1rem;
}
body, #shadowBody {
    overflow:hidden;
    margin:0;
    padding:0;
    background:#002240;
    font-size:16px;
}
#shadowBody { display:none; z-index:0; }
#shadowBody.loading { z-index:200001; display:block;  height:100vh; width:100vw; }

#settings button {
  display:block;
  margin:0.5rem !important;
  margin-left:1rem !important;
  margin-right:1rem !important;
  width:85%;
}
#settings,#editors {
  margin-left:0.5em;
}
#settings { 
   margin-top:0;
   margin-bottom:0.5rem;
   color:#ddddff;
}
  button {
    cursor:pointer !important;
    background:#c0c0ff !important;
  }
.menu input {
    color:#0074da;
background:transparent;
font-weight:bold;
}

* { 
  box-sizing : border-box !important;
  font-family:Verdana,Arial,Helvetica,Sans-Serif; 
}
iframe { margin-left:0; left:0;}
.button {
    cursor:pointer;
    color:gray;
    font-size:1.25rem;
  }
.previous, .next {
  display:inline-block;
  margin-right:0.6rem;
  margin-top:0.5rem;
  font-weight:bold;
}
.next {
//  margin-right:1.2rem;
}
#left-column.project .previous, #left-column.project .next { display:none; }

.screen.button button,
.menu.button ,
.menu.button button {
    display:inline-block;
    margin-top:0.5rem;
    padding:0 !important;
    background:transparent !important;
    cursor:pointer;
    color:gray;
  display:block;
    margin-bottom:0.4rem;
    font-size:1.25rem;
}
body.help .screen.button,
body.help .screen.button:after {
  margin-right:0 !important;
  padding-right:0 !important;

}
.gear.button:after {
  content: "\2699"; /* gear */
  font-size:1.75rem;
  display:block;
  color:gray;
  margin-bottom:0.5rem;
}
.wrench.button:after {
  content: "\1F527"; /* wrench */
  font-size:1.25rem;
  display:block;
  margin-left:0.3rem !important;
  margin-bottom:1rem;
}
.help.button:after {
  content: "?";
  font-size:1.5rem;
  display:block;
  color:gray;
  margin-left:0.3rem !important;
  margin-bottom:1rem;
}
.menu.button:after {
  content: "\2630"; /* hamburger menu */
}
.screen.button:after {
//  content: "\2180"; /* split circle */
  content: "\2318"; /* place of interest */
  font-size:1.5rem;
  display:block;
  margin-bottom:0.4rem;
  color:gray;
}
.screen.button {
  margin:0.5rem !important;
  margin-bottom:1rem !important;
}
.menu .url {
    color:orange;
}
#load:after {
  content: "\21c8"; /* two up arrows */
}
#save.button {
  color:orange !important;
  font-weight:bold;
}
#save:after, #save2:after {
  content: "\21ca"; /* two down arrows */
  content: "\21e9"; /* thick down arrow */
}
/*
270F	PENCIL
2714	HEAVY CHECK MARK
✓	2713	CHECK MARK
*/
body.display #display { bottom:0; height:100vh; max-height:100vh !important; }

#currentFileUrl {
  display:table-cell;
  font-size:small;
}

body {
  color:#ddddff;
  padding-top:0 !important;
  margin-top:0 !important;
}

.formArea {                                                                    
    text-align:right;                                                          
    display:none;                                                              
    line-height:2em;                                                           
    margin-top:1em;                                                            
    margin-left:1em;                                                           
    border-radius:5px;                                                         
    padding:1em;                                                               
    background-color:rgba(125,180,200,2);                                      
    border:1px solid rgba(50,75,90,10);                                        
    height:auto;                                                               
}                                                                              
.formButtons {                                                                 
    margin-top:1em;                                                            
    text-align:center;                                                         
}                                                                              
.formButtons button {                                                          
    margin-right:1em;                                                          
}           
.SolidSignInOrSignupBox {
  padding:0 !important;
  background:transparent;
}
#login input{
  display:inline-block;
  margin-top:0.6rem;
  margin-left:0.25rem;
  margin-bottom:0.6rem;
  border:1px solid #c0c0ff !important;
  border-radius:0.2rem !important;
  padding:0.25rem !important;
  background:transparent !important;
  color:#c0c0ff !important;
  padding-left:0.25rem !important;
  padding-right:0.25rem !important;
  cursor:pointer;
}

#top-menu {
  margin:0.5em;
  background:#557795;
  color  !important;
  border:1px solid transparent;
  border-radius:0.2rem;
  text-align:left !important;
}
#top-menu div {
  padding-left:0.5rem;
  margin-top:0.5rem;
}
#top-menu button {
  text-align:left !important;
  background:transparent !important;
  color:black !important;
  font-size:100% !important;
  padding:1rem;
  display:block;
  width:100%;
  margin-left:1rem;
}
#top-menu button.selected {
  text-decoration:underline;
}

.uic-form H3 {
  margin-top:0 !important;
  margin-bottom:0 !important;
}
.uic-form div.hovercontrol {
  margin-top:1rem;
}

#display { 
  color:black;
  background-color:white;
  overflow:auto; 
}

/* SELECT/OPTION DROPDOWNS
*/
#hostSelector option, #containerSelector option {
  background:#88aac8 !important;
}
#settings select, #left-column select {
   width:100%;
   margin-top:0.5rem;
   margin-bottom:0.5rem;
   background:#557795 !important;
   font-size:100%;
}
#settings select option {
    padding-top:0.25rem !important;
  }
#itemSelector {
  margin-top:0.5rem;
  width:95%;
  border-left:none !important;
}
#itemSelector * {
  border-left:none !important;
}
#itemSelector li {
  border:none !important;
  border-bottom:1px solid black !important;
}
#itemSelector * {
    background:#88aac8;
    background:white;
    background:#557795;
    color:black !important;
    font-size:100%;
}
select,input,button,input[type="button"] {
    border:1px solid transparent !important;
    padding:0.2rem !important;
    border-radius:0.2rem !important;
}
.suic-anchor-list a {
  display:block;
  color:black;
  background:#557795;
  padding: 0.25em;
  margin-top:0.5em;
}