body {
  background-color: #C1DDD8;
  color: #333;
}

hr {

  border-top: 1px dashed #09C;

}


img {
  margin-bottom: 24px;

}

container {
  width: 80%;
  margin: auto 0 auto 0;
  padding: 80 px 0;
  
}

.box {
  width: 150 px;
  height: 150 px;
  margin: 0px 14 px;
  transition: .5s;
  z-index: -1;

}
.box img {border-radius: 6px;}

.box:hover {
  /* position: absolute; */
  transform: scale(1.1);
  z-index: 1000;
  overflow: hidden;
}


/*.img {
  width: 150 px;
  height: 150 px;
  margin: 0px 14 px;
  transition: .5s;
  z-index: -1;
}
.img img {
  border-radius: 16px;
}
.hover {
  position: absolute;
  top: 0;
  display: none;
}
.img:hover + .hover {
  display: block;
}
.img:hover {
  transform: scale(1.25);
  z-index: 1000;
}*/

  top: -15px\0/; /* ie8 and 9 */
  right:-32px\0/; /* ie8 and 9 */
  width: 100px;
  -ms-transform:rotate(45deg); /* IE9 */
  -moz-transform: rotate(45deg);  /* FF3.5/3.6 */
  -o-transform: rotate(45deg);  /* Opera 10.5 */
  -webkit-transform: rotate(45deg);  /* Saf3.1+ */
  transform: rotate(45deg);  /* Newer browsers */
  /*filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476); *//* IE6,IE7, but produces nasty results, so I disabled it */
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)"; /* IE8 */
}

:root .element { top: 15px\0/IE9; }  /* back to right value in IE9 */