Bootstrap - 按钮被按下一排

Question

我的bootstrap代码有问题。当我重新调整屏幕大小时，按钮被按下在行和容器之外。似乎容器类甚至没有被使用。我在哪里错了？谢谢。

#cta-center {
  line-height: 90px;
}

#cta-bg {
  background: gray;
  height: 90px;
}

.cta p {
  text-align: center;
  font-size: 35px;
  font-weight: 600;
  color: #fff;
}

.btn-primary {
  width: 200px;
  height: 50px;
  background: yellow;
}

.btn-primary p {
  color: #000;
  line-height: 34px;
  font-size: 25px;
  font-weight: 600;
}

<div id="cta-center">
  <div id="cta-bg">
    <div class="container">
      <div class="row">
        <div class="cold-md-12">
          <div class="col-md-8">
            <div class="cta">
              <p>Get a FREE Quote NOW</p>
            </div>
          </div>

          <div class="col-md-4">
            <a href="#" class="btn btn-primary">
              <p>CLICK HERE</p>
            </a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

图像：