<div class="screenshots_arrows">
   <a class="secondar_left_link" href="#" >
      <img id="screen_left_dungeons2" class="secondar_left" src="https://d30y9cdsu7xlg0.cloudfront.net/png/34-200.png" alt="Left_arrow">
   </a>
   <a class="secondar_right_link" href="#" >
      <img id="screen_right_dungeons2" class="secondar_right" src="https://d30y9cdsu7xlg0.cloudfront.net/png/34-200.png" alt="Right_arrow">
   </a>
</div>

* {
padding: 0px;
margin: 0px;
}
a {
color: #FFFFFF;
text-decoration: none;
}

#project-wrapper img {
vertical-align: top;
}
.secondar_right {
width: 1vw;
height: auto;
}
.secondar_left {
width: 1vw;
height: auto;
transform: scale(-1);
}
.secondar-screenshot a {
width: 0vw;
height: 0vw;
}
.secondar_left_link {
position: relative;
top: 5vw;
left: 7vw;
}
.secondar_right_link {
position: relative;
top: 5vw;
left: 13.5vw;
}