body {
  background-color: #ddd;
  font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
  padding: 20px;
}

img {
  vertical-align: middle;
}

input {
  font: inherit;
  font-family: inherit;
  margin: 0;
}

.content {
  max-width: 960px;
}

.span-save {
  text-decoration: none;
  vertical-align: middle;
}

.margins {
  margin-top: 2px;
  margin-bottom: 3px;
  margin-left: 3px;
  margin-right: 3px;
}

.padding {
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 7px;
  padding-top: 2px;
}

.rounded-box {
  border-width: 0px;
  border-radius: 4px;
}

button {
  margin: 0em;
  font: -webkit-small-control;
  color: initial;
  letter-spacing: normal;
  word-spacing: normal;
  text-transform: none;
  text-indent: 0px;
  text-shadow: none;
  display: inline-block;
  text-align: start;
}

.btn {
  display: inline-block;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid ;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  color: #ccc;
  background-color: #203040;
  border-color: #102030;
}

.btn:hover, .btn:focus, .btn:active  {
  color: #fff;
  border-color: #102030;
  background-color: #506070;
}

.dark-blue-bg {
  background-color: #203040;
}

.medium-blue-bg {
  background-color: #304050;
}

.text-on-blue {
  color: #ccc;
}

.sidebar-heading {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left: 7px;
  font-size: 1.3em;
}

.sidebar-heading-skin {
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #071720;
}

.sidebar-item-borders {
  color: inherit;
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #304050;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #071720;
  border-right-width: 0px;
  border-left-width: 0px;
}

.sidebar-item-borders:last-child {
  border-bottom-width: 0px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.sidebar-item {
  display: block;
  padding: 5px 15px;
  position: relative;
  color: inherit;
  text-decoration: inherit;
}

.sidebar-item-inactive {
  cursor: pointer;
}

/* highlight hovered item a bit... */
a:hover.sidebar-item {
  color: #eee;
  text-decoration: inherit;
}
/* ...but not if it is already selected */
a:hover.sidebar-item-active {
  color: inherit;
  text-decoration: inherit;
}

/* needs to be defined after sidebar-item */
.sidebar-item-active {
  font-weight: bold;
  border-top-color: #031017;
  border-bottom-color: #203040;
  background-image: none;
  background-color: #102030;
  cursor: default;
}

/* in headline */
.current-item {
  font-size: 18px;
  font-weight: bold;
  height: 28px;
  line-height: 36px;
}

.current-item-edit {
  width: 80%;
  color: #333;
  line-height: 18px;
}

.todo-text {
  height: 200px;
  background-color: #eee;
}

.todo-text-edit {
  width: 97%;
}

.footer {
  font-size: small;
  width: 100%;
  text-align: center;
}
