html, body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

body {
  background-color: black;
  display: flex;
  justify-content: center;
  align-items: center;
}

#download {
 
  position: absolute;
  top: 1px;
  background-color: #6ba5d9;
}

#download.visible {
  display: block;
}
.outsideWrapper{ display:block; 
height: 700px;
    width: 700px;
   }
.insideWrapper{ display:block; height:100%; 
    position:relative;
	overflow:hidden;}
.coveredImage{  ; 
    position:relative; top:-1115px; left:-420px;
	overflow:hidden;
}
.coveringCanvas{ 
    width:100%; height:100%; 
    position:absolute; top:-1115px; left:-420px;
    background-color: rgba(255,0,0,.1);
}
#img {

}
#theCanvas {
height:100%;
display:block;
justify-content: center;
align-items:centre;}