/* stylesheets\layout.css */
html
{
	font-size: 150%;
  margin: 0;
	font-family: calibri, sans-serif;
	background: #101010;
	color: #f0f0f0;
	margin: 0;
}
body
{
  min-width: 10em;
	margin: 0;
}
h1
{
  font-size: 120%;
  margin-bottom: 0.5em;
  margin-left: 1em;
}
p
{
  font-size: 80%;
}
form.login
{
  background: #303030;
  width: 7em;
  text-align:center;
  padding: 0.5em;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1em;
}
form.login input[name="pin"]
{
  font-size: 100%;
  text-align: center;
}
p.ledger
{
  float: right;
  margin-top: -2.5em;
  margin-right: 1em;
}
a, a:link, a:hover, a:visited
{
  text-decoration: none;
  color: #f0f0f0;
}
p.error
{
  background: #d0d0d0;
  color: #a00000;
  padding: 0.2em;
  margin-left: 1em;
  margin-right: 1em;
}
.about
{
  padding: 1em;
  width: 40em;
}
.about img
{
  float: right;
  clear: both;
}
/* Common */
div#header
{
  height: 2em;
  background: #202020;
  padding: 0.1em;
  margin: 0;
}
div#header h2
{
  margin-left: 0.4em;
  font-size: 70%;
}
div#header h3
{
  margin-top: 0;
  margin-left: 0.4em;
  font-size: 60%;
  font-weight: normal;
}
div#header p.logout
{
  float: right;
  margin-top: -1.5em;
}
div#header p a
{
  background: #404040;
  padding: 0.2em 0.4em 0.2em 0.4em;
}
div.main
{
  padding: 1em;
}
table {border-right: #808080 1px;border-top: #808080 1px solid;border-left: #808080 1px solid;border-bottom: #404040 1px;background-color: #505050;margin-bottom: 1em;font-size:80%}
table tr{vertical-align: top;}
table th{text-align: left;font-weight: bold;background-color: #303030;padding: 4px;margin: 0px;border-right: #404040 1px solid;border-bottom: #404040 1px solid;}
table td{padding: 4px;margin: 0px;border-right: #404040 1px solid;border-bottom: #404040 1px solid;}

div#editor
{
  position: absolute;
  background: rgb(64,64,64);
  top: 120px;
  height: 400px;
  width: 90%;
}
div#editor div.console
{
  position: absolute;
  margin: 0;
  top: -75px;
  left: 0px;
  height: 70px;
  width: 100%;
  background-color: #505050;
}
div#editor div.console p.button
{
  display: inline-block;
  padding: 2px;
  padding-left: 8px;
  padding-right: 8px;
  min-width: 30px;
  text-align: center;
  background-color: #303030;
  margin: 3px;
}
div#editor div.help
{
  font-size: 80%;
  position: absolute;
  bottom: 0;
  color: rgba(200,200,200,1);
}
div#editor p.timecode
{
  font-size: 80%;
  position: absolute;
  top: 0px;
  left: 200px;
  height: 320px;
  border-left: 1px solid rgba(255,255,255,0.6);
  padding-left: 0.3em;
}
div#editor div.timeline
{
  font-size: 100%;
  position: absolute;
  top: 60px;
  left: 0;
  height: 320px;
  width: 99%;
  overflow: hidden;
}
div#editor div.timeline div.layer
{
  position: relative;
  height: 30px;
  border-bottom: 1px solid gray;
}
div#editor div.timeline div.layer div.cue
{
  position: absolute;
  display: inline-block;
  border-left: 2px solid gray;
  height: 25px;
  padding-left: 4px;
  padding-top: 1px;
}
div#editor div.timeline div.layer div.cue.selected
{
  border: 1px solid rgba(255,255,255,0.5);
  padding-top: 0px;
}
div#editor div.timeline div.layer.t1 div.cue /* Lyrics */
{
  border-bottom: 3px solid rgba(255,255,255,0.6);
  background: rgb(64,64,64);
}
div#editor div.timeline div.layer.t1 div.cue.end /* Lyrics: End of line */
{
  padding-right: 7px;
  border-right: 3px solid rgba(255,255,255,0.6);
}
div#editor div.timeline div.layer.t2 /* Shots */
{
  height: 60px;
}
div#editor div.timeline div.layer.t2 div.cue /* Shots */
{
  height: 55px;
}
div#editor div.timeline div.layer.t2 div.cue p.text
{
  margin-left: 35px;
  margin-bottom: 2px;
}
div#editor div.timeline div.layer.t2 div.cue p.comment
{
  color: #F0F0B0;
  margin-left: 35px;
  margin-top: 0px;
  margin-bottom: 2px;
}
div#editor div.timeline div.layer div.cue p.source
{
  position: absolute;
  width: 30px;
  font-size: 120%;
}
div#editor div.timeline div.layer div.cue p.index
{
  position: absolute;
  top: 30px;
  width: 30px;
}
div#editor div.timeline div.layer div.cue p.transition
{
  color: Lime;
  position: absolute;
  top: 40px;
  width: 30px;
  left: 20px;
  font-size: 40%;
}
div#editor div.popup
{
  position: absolute;
  top: 100px;
  left: 100px;
  width: 500px;
  background: rgba(144,144,144,0.85);
  padding: 20px;
}
div#editor div.popup p.button
{
  display: block;
  background: #505050;
  padding: 3px;
  padding-left: 10px;
  padding-right: 10px;
  bottom: 3px;
  float: right;
  margin: 5px;
}
div#editor div.popup p.button.delete
{
  float: left;
  background: #ff0000;
  color: #ffffff;
}
div#editor div.popup td
{
  font-size: 80%;
  padding-right: 3px;
  padding-bottom: 3px;
}
div#editor div.popup input,
div#editor div.popup select
{
  font-family: calibri, sans-serif;
  font-size: 80%;
}
div.about img
{
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 1em;
}
div.about img[n=2]
{
  float: right;
}
div.about p
{
  margin-top: 1em;
  margin-bottom: 2em;
  line-height: 1.4em;
}
div.about h2
{
  margin-top: 3em;
}
div.about a
{
  text-decoration: underline;
}