html, body {
  width: 100% ; height: 100% ;
  margin: 0 ; padding: 0 ;
}

body {
  display: flex ; flex-direction: column ;
  font-family: sans-serif ;
  background-color: #f9f9f9 ;
}

header {
  display: flex ; flex-direction: row ;
  border-bottom: 1px solid #bbb ;
}
header h1 {
  margin: 8px ;
  height: 32px ;
  font-weight: bold ;
  font-size: 32px ;
  line-height: 32px ;
}
header h1 img {
  vertical-align: top ;
  width: 32px ;
  height: 32px ;
}
header hr {
  flex-grow: 1 ;
  border: none ;
}
header nav {
  display: flex ;
  /* OK */
}
header nav a,
header nav select {
  outline: none ;
  border: 1px solid #BBB ; border-radius: 2px 2px 0 0 ;
  background-color: #EEE ; color: #000 ;
  text-decoration: none ;
  cursor: pointer ;
}
header nav a:hover,
header nav select:hover {
  background-color: #DDD ;
}
header nav a.active,
header nav select.active {
  border-bottom: 1px solid #fff ;
  background-color: #fff ;
}
header nav a {
  margin: 8px 8px -1px 0 ; padding: 4px 4px 12px 4px ;
}
header nav select {
  margin: 8px 8px 8px 0 ;
  border-radius: 2px ;
}
select {
  padding: 4px 36px 4px 4px ;
  line-height: 22px ;
  -webkit-box-sizing: border-box ;
  -moz-box-sizing: border-box ;
  box-sizing: border-box ;
  -webkit-appearance: none ;
  -moz-appearance: none ;
  background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc) ;
  background-position: calc(100% - 16px) 12px, calc(100% - 8px) 12px, calc(100% - 0px) 0 ;
  background-size: 8px 8px, 8px 8px, 32px 32px ;
  background-repeat: no-repeat ;
}
select:focus {
  outline: 0 ;
}
section {
  position: relative ;
  overflow: hidden ;
  flex-grow: 1 ;
}
#content_commands {
  margin: 0 ; padding: 0.5em ;
  width: calc(100% - 1em) ; height: calc(100% - 1em) ;
  background: #fff ;
  border: none ;
  resize: none ;
}
#content_blocks {
  position: absolute ; top: 0 ;
  margin: 0 ; padding: 0 ;
  width: 100% ; height: 100% ;
  background: #fff ;
  border: none ;
  resize: none ;
}

html[dir="RTL"] header nav a{
  margin: 8px 0 -1px 8px ;
}
html[dir="RTL"] header nav select {
  margin: 8px 0 8px 8px ;
}
