body {
   margin: 0px;
   padding: 10px;
   font-family:sans-serif;
   height: 100vh;
}

h1 {
   font-variant: small-caps;
   border-bottom: solid 2px #d00;
   color: #d00;
   padding: 10px;
   margin: 10px;
}

th {
   text-align: left;
}

#songsList {
  width: 350px;
  position: absolute;
  left: 20px;
  height: 100%;
}

#snippet--verses {
/*  width: 500px;
  position: absolute;
  left: 400px;
  top: 400px;
  z-index: 1;*/
}

pre {
  margin: 0px;
}

em {
  display: block;
  width: 80%;
  font-style: italic;
  border: 1px solid blue;
  color: blue;
  margin: 10px auto 10px auto;
  padding: 5px;
  text-align: center;
}

#snippet--links dt {
  font-weight: bold;
  display: list-item;
  list-style: circle outside none;
  margin: 10px 5px 2px 5px;
}
#snippet--links dt a{
  color: blue;
}
#snippet--links dt a img{
  vertical-align: middle;
}

#snippet--links dd {
  display: block;
  margin: 0px 5px 10px 5px;
  padding: 2px 2px 2px 40px;
}

#bookpage {
  position: absolute;
  width: 450px;
  right: 20px;
  z-index: 0;
}

#page-control {
   text-align: center;
}
#page-control a{
   text-align: center;
   display: inline-block;
   width: 20px;
   height: 20px;
   padding: 5px;
   margin: 1px 5px 1px 5px;
   border: black solid 1px;
   font-size: 14pt;
   color: black;
   background: white;
   text-decoration: none;
}
#page-control a:hover{
   color: #d00;
   border-color: #d00;
}

#snippet--verses dt {
   float: left;
}

h3 {
   font-variant: small-caps;
   font-weight: bold;

}

#lilyNotes {
   display: block;
   margin: 10px auto 10px auto;
}

#lilyState {
   display: inline-block;
   margin: 5px;
   vertical-align: top;
}

div.lilyButtons {
   margin: 5px auto 5px auto;
   text-align: center;
}

#lilyButton,#lilyButtonSave{
   display: inline-block;
}


#lilyCode {
   display: inline-block;
   width: 750px;
   min-width: 750px;
   max-width: 750px;
   height: 450px;
}

.content-tabs {
   display: inline-block;
   position: absolute;
   width: 900px;
   left: 400px;
}

#userLogin {
  display: block;
  position: absolute;
  font-size: 18px;
  text-align: right;
  top: 30px;
  right: 20px;
  width: 400px;
}
#userLogin a {
  display: inline-block;
  text-align: center;
  width: 100px;
  border: #d00 solid 1px;
  color: #d00;
  text-decoration:none;
  padding: 5px;
  margin: 5px
}
#userLogin a:hover {
  color: white;
  background: #d00;
}

#loginBlock {
  display: block;
  width: 500px;
  margin: 100px auto 100px auto;
  padding: 5px;
  border: #d00 solid 2px;
}

#loginBlock h2 {
  text-align: center;
  margin: -5px -5px 10px -5px;
  padding: 5px;
  background: #d00;
  color:white;
}

.flash {
  display: inline-block;
  position: relative;
  text-align: center;
  margin: 0px;
  padding: 5px 30px 5px 30px;
/*  border: #d00 solid 3px;*/
  background-color: #d00;
  color: white;
  min-height: 20px;
  vertical-align: middle;
}

#snippet--flashsnip {
  display: block;
  position: absolute;
  width: 40%;
  text-align: center;
  left:30%;
  top: 30px;
  margin: 0px auto 0px auto;
  padding: 0px;
  z-index: 10;
}

table {
  width: 100%;
}

.inplace {
  display: block;
  background-image: url("../images/edit.png");
  background-repeat: no-repeat;
  background-postion: left center;
  padding: 2px 2px 2px 21px;
}

.inplace:hover {
  border: blue dashed 1px;
}

.editable-container {
  display: block;
}
.editable-input {
  display: inline-block;
}
.editable-input input{
  width: 400px;
}
.editable-buttons {
  display: inline-block;
  width: 74px;
}

#firstTextSpan {
  width: 100%;
  height: 4em;
}

div.links:hover{
  background-color: #eee;
}

div.links img.del {
  display: inline-block;
  float: right;
  position: relative;
  border: solid rgba(0,0,0,0) 2px;
  padding: 2px;
}
div.links img.del:hover {
  border: solid red 2px;
  background-color:white;
}

table.table-bordered td {
  border: solid 1px #aaa;
  margin: 0px;
  padding: 5px;
}

table.table-bordered {
  border-collapse: collapse;
}

table.table-bordered tr.data:hover {
  background-color: #f99;
}

table.table-bordered th {
  text-align: center;
}

.table-song-name {
  white-space: nowrap;
}