style.less

@description-width:  320; 


.rounded-corners (@radius: 5px) {
  border-radius: @radius;
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
}

*, body {
  margin:0;
  padding:0;
}
input {
  border:0px;
  
}
input.title{
    width: 300px;
  }
input.description {
  width: @description-width*1px;
}
input.optimus, input.nominal, input.worst {
  width:40px;
}
div.newtask {
  text-align:center;
  font-size:11px;
}
ul {
  list-style:none;
  li.header {
    font-size:11px;
  }
}
span.O {
  margin-left: (@description-width + 60)*1px;
}
span.N, span.P {
  padding-left:30px;
}
div.right, div.left {
  width:15%;
  height:100%;
  float:left;
}
div.content {
  min-width: 600px;
  float:left;
  margin-top:20px;
  .rounded-corners(20px);
}
div.summary {
  color:orange;
  font-size:22px;
  float:right;
  font-weight:bold;
  text-align:center;
  width:180px;
  height:70px;
  margin-right:40px;
}
.content {
  background-color: lightgreen;
  div.tasks {
    margin-top:10px;
    padding-left:20px;
    .sum {
      padding: 0 10px 0 10px;
    }
  }
  h1 {
    margin-top:10px;
    padding-left:30px;
    padding-bottom:30px;
  }
  div.lower {
    padding-top:25px;
  }
}
input.error {
  color:red;
}
div.explanation {
  font-size:11px;
  p {
    margin-left:-68px;
    padding-top:40px;
    text-align:center;
  }
}
div.catcher {
  font-size:11px;
  cursor:pointer;
}
div.sum {
  margin-left:5px;
}
div.tasks ul {
  padding-left:50px;
}
img.delete, img.add {
  cursor:pointer;
}
img.download {
  cursor:pointer;
  float:right;
  margin-right:50px;
}
img.clear {
  cursor:pointer;
  padding-left:50px;
}
.tooltip {
  display:none;
  background-color:#ffffaa;
  border:1px solid #cccc99;
  padding:3px;
  font-size:13px;
  -moz-box-shadow:2px 2px 11px #666666;
  -webkit-box-shadow:2px 2px 11px #666666;
}