body, html {
    height: 100%;
    margin: 3px;
    font-weight: 100;
    text-align: center;
    font-family: helvetica;
}

.tabs input[type=radio] {
    position: absolute;
}
.tabs {
  width: 100%;
  float: none;
  list-style: none;
  position: relative;
  padding: 0;
  margin: 5px auto;
}
.tabs dt{
  float: left;
}
.tabs label {
    display: block;
    padding: 5px 25px;
    font-size: 18px;
    font-weight: normal;
    background: #ccc;
    background: linear-gradient(#ccc, #aaa);
    cursor: pointer;
    position: relative;
    top: 0px;
}
 
[id^=tab]:checked + label {
    background: #eee;
    background: linear-gradient(#fff, #ddd);
}
 
[id^=tab]:checked ~ [id^=tab-content] {
    display: block;
}
.tab-content{
  z-index: 2;
  display: none;
  text-align: left;
  width: 100%;
  padding: 15px;
  position: absolute;
  left: 0;
  box-sizing: border-box;
  border:3px solid #ddd;
}

p{width:49%;text-align:justify;}
img {width:49%;float:right;margin:0px;}

figure{width:49%;float:right;margin:0px;}
figure img {width:95%;}

br{clear:both;}
b.img-ref{background-color:yellow;}

/* Definition for docs/tasks/index.html */
div.title  { font-size: 18px;font-weight: bold; }
div.module { padding : 2px; }
div.module p { font-size: 16px; font-weight: bold; }
div.module img { width:30px;height:30px; float:left; padding : 2px; }
div.taskTitle { padding : 2px; padding-left: 50px; }
p.taskDesc {font-size: 12px; font-style:italic; padding-left: 50px; }
div.taskTitle img { width:30px;height:30px; float:left; padding : 2px; }
div.taskTitle p { font-weight: bold; }