Double inner border over image with offsets

Try the below code

 <div class="module">
  </div>

-

body {
 padding: 20px;
 }

.module {
  width: 300px;
  height: 200px;
  position: relative;
  border: 1px solid blue; 
  margin: auto;
  }
.module:after {
  content: "";
  position: absolute;
  top: -3px;
  left: 1px;
  right: 1px;
  bottom: -3px;
  border: 1px solid black;
  margin:auto;
  }

Hope the below code helps

body{
   padding:50px;
}
.box{
  width:300px;
  height:200px;
  border:1px solid red;
  position:relative;
}
.box:after{
  content:"";
  position:absolute;
  top:-4px;
  bottom:-4px;
  left:2px;
  right:2px;
  border:1px solid green;
}

<div class="box" >
</div>

img {
    border: 1px double black;
    padding: 64px;
    outline: 1px solid black;
    box-sizing: border-box;
    outline-offset: 20px;
}

something like this should work for you. You might have to play with the dimensions

body {
    background: black;

}

.bordered-image {
position: relative;
height: 300px;
width: 300px;
border: 1px solid white;
margin: auto;
}

.bordered-image:before {
position: absolute;
left:-6px;
top: 4px;
display: block;
content: ' ';
margin: auto;
height: 290px;
width: 310px;
border: 1px solid white;
}

Try this:

.bordered-image {
background:black;
width:300px;
outline: 1px double white;
outline-offset: -10px;
}
.one {

width:300px;
height:300px;
 position:relative;
 border:1px solid white;
}
.one:after {
         content: "";
    width: 273px;
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: 11px;
    right: 2px;
    border: 1px solid white;
}

<div class="bordered-image">
<div class="one">
</div>
</div>