body, html {
  margin:0;
  padding:0;
  line-height:0;
}

* {
  box-sizing:border-box;
}

a, a:hover, a:visited, a:active {
  cursor: pointer;
  color: black;
  text-decoration: none;
  font-weight: bold;
}

.all {
  max-width: 600px;
  margin:auto;
  border:1px solid black;
}
.statusBar {
  height:10px;
  background:red;
}

.img {
  display:block;
  width:50%;
  float:left;
  outline: 1px solid black;
  height:0;
  padding-bottom:50%;
}

.credit {
  font-family: Arial;
  margin-top:20px;
  font-size: 14px;
  line-height: 16px;
}

img {
  width:100%;
  height:auto;
}

.img-cont {
  margin-top:1px;
}
.img-cont:hover .img {
  opacity: 0.8;
}
.img:hover {
  opacity:1 !important;
}

.cf:before,
.cf:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.cf:after {
  clear: both;
}