a {
position: relative;
display: inline-block;
z-index: 2;
}

.hide {
display: none;
}

.test {
display: block;
}

.display-none {
      display:none;
}

body {
  margin: 0;
  padding: 5px;
}

.container{
    display:flex;
}

.column-1 {
  flex-basis: 40%;
}

.column-2 {
  flex-grow: 65%;
  flex-basis: 50%;
}

.column-3 {
  flex-grow: 65%;
  flex-basis: 50%;
}

.fun1 {
background-color: #014F8A;
}

.box {
  background-color: #FFFFFF;
  padding: 10px;
  border-radius: 12px;
  border: 0px solid rgb(0, 37, 110);
  margin: 5px;
  box-shadow: 0px 0px 0px #000;
}

.box3 {
  background-color: #FFFFFF;
  padding: 10px;
  border-radius: 12px;
  border: 0px solid rgb(0, 37, 110);
  margin: 5px;
  box-shadow: 0px 0px 0px #000;
}

.box2 {
  background-color: #F2F6F9;
  padding: 10px;
  border-radius: 12px;
  border: 0px solid rgb(0, 37, 110);
  margin: 5px;
  box-shadow: 0px 0px 0px #000;
}

@media only screen and (max-width: 480px) {
  .container {
      /* it place the items in vertical direction */
    flex-direction: column;
  }

  .box {
    margin: 0 0 1rem;
  }
}