Make a larger image (from sprite) fit in a smaller div?

I have a large image (image sprite) with size 1030px-510px that contains two small images (515px-515px). I want to get two small images from the sprite and set background for two tags. I using this code:

HTML:

CSS: .img-1, .img-2 { width: 515px; height: 515px; background: url(images/large.jpg) no-repeat; }

.img-1 {
  background-position: 0px 0px;
}

.img-2 {
  background-position: -515px 0px;  
}

But the two images larger than my two div (class="col-sm-6"). So, Are there any ways to fit my two small images in my two divs? I don't want to change my two divs to larger (class="col-sm-7"). Thank you in advance!