<div class="page">

<div class="left">

1

</div>

<div class="right">

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

<div class="card">

card

</div>

</div>

</div>

div {

  border: 1px solid red;

  overflow: hidden;

}

.left {

  width: 150px;

  float: left;

}

.right {

  width: calc(100% - 200px);

  float: right;

  padding: 15px;

}

.card {

  width: 150px;

  height: 70px;

  float: left;

  margin: 15px 15px;

}

@media only screen and (max-width: 500px) {

  body {

    background-color: lightblue;

  }

  div{

    border:1px solid green;

  }

  .right{

    width: 100%;

    float:left;

  }

}