<h3>Vanuatu</h3>

<div class="flag vanuatu">
  <div class="vanuatu__black_triangle"></div>
  <img src="https://imgur.com/rRUSzNt.png" height="54" alt="" />
  <div class="vanuatu__center_strip"></div>
</div>

* {
  box-sizing: border-box;
  margin: 0;
}

body {
  width: 100%;
  height: 100vh;
  background-color: rgb(221, 239, 255);
  display: grid;
  place-items: center;
  font-family: cursive;
  font-weight: bold;
}

h3 {
  position: absolute;
  text-align: center;
  top: 20px;
}

/* Main Style Stars from here  */
.flag {
  position: relative;
  width: 300px;
  height: 200px;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
  overflow: hidden;
}

.vanuatu {
  background: linear-gradient(#d21034 50%, #009543 0);
}

/* Outer Black Triangle */
.vanuatu::before {
  position: absolute;
  content: "";
  border: 100px solid transparent;
  border-left: 170px solid black;
}

/* Inner Yellow Triangle */
.vanuatu::after {
  position: absolute;
  content: "";
  border: 85px solid transparent;
  border-left: 145px solid #fdce12;
  top: 15px;
}
/* Inner Black Triangle */

.vanuatu__black_triangle {
  position: absolute;
  border: 70px solid transparent;
  border-left: 120px solid black;
  top: 30px;
  z-index: 1;
}

.vanuatu > img {
  position: absolute;
  left: 6%;
  top: 37%;
  z-index: 1;
}

.vanuatu__center_strip {
  height: 40px;
  width: 60%;
  position: absolute;
  right: 0;
  background-color: #fdce12;
  border: solid black;
  border-width: 13px 0;
  top: calc(50% - 20px);
}