p.caption {
  color: #777;
  margin-top: 10px;
}
p code {
  white-space: inherit;
}
pre {
  word-break: normal;
  word-wrap: normal;
}
pre code {
  white-space: inherit;
}
div {
  text-align: justify;
  text-justify: inter-word;
}
div.objectives {
  background-color: #C3FDB2;
  width:90%;
  padding:2em;
  display:block;
  min-height: 100px;
  margin: 0 2em 2em 1em;
  background: linear-gradient(top, rgba(0,0,0,.05), rgba(0,0,0,.25));
  box-shadow: 5px 5px 10px -2px rgba(33,33,33,.3);
  transform: rotate(1deg);
  transform: skew(-.05deg,.05deg);
}
div.objectives2 {
  margin: 2em 1em 2em 0;
  padding: 15px 20px;
  background: #fafafa;
}
div.warning, div.tip, div.tryit, div.challenge, div.explore, div.base {
  border: 4px #dfedff; /* very light blue */
  border-style: solid;
  padding: 1em;
  margin: 1em 0;
  padding-left: 100px;
  background-size: 70px;
  background-repeat: no-repeat;
  background-position: 15px center;
  min-height: 120px;
  color: #00274c; /* blue text */
  background-color: #bed3ec; /* light blue background */
}
div.warning {
  background-image: url("img/warning.png");
  background-color: #f7f7f7; /* gray97 background */ 
}
div.explore {
  background-image: url("img/explore.png");
  background-color: #d0faee; /* green card background */
}
div.base {
  background-image: url("img/bases.png");
  background-color: #F3F2F2; /* green card background */
}
div.writing {
  background-color: #FFFD75;
  padding:2em;
  display:block;
  min-height: 100px;
  margin: 0 2em 2em 1em;
  background: linear-gradient(top, rgba(0,0,0,.05), rgba(0,0,0,.25));
  box-shadow: 5px 5px 10px -2px rgba(33,33,33,.3);
  transform: rotate(1deg);
  transform: skew(-.05deg,.05deg);
}
div.glossario {
  padding: 1em;
  margin: 1em 0;
  padding-left: 100px;
  background-size: 70px;
  min-height: 120px;
  background-repeat: no-repeat;
  background-position: 15px center;
  background-image: url("img/glossary.png");
  background-color: #FFFD75;
  display:block;
  min-height: 100px;
  margin: 0 2em 2em 1em;
  background: linear-gradient(top, rgba(0,0,0,.05), rgba(0,0,0,.25));
  box-shadow: 5px 5px 10px -2px rgba(33,33,33,.3);
  transform: skew(-.05deg,.05deg);
}

