/*First SASS page*/
*, *:before, *:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0; }

body {
  font-size: 100%; }

img {
  max-width: 100%; }

/*isotopes*/
.grid-item {
  width: 24%;
  min-height: 300px;
  background-color: aqua;
  background-size: cover;
  background-position: center;
  margin: 1px; }

.grid-item-width2 {
  width: 49%;
  background-color: aquamarine;
  min-height: 300px;
  background-size: cover;
  background-position: center; }

button {
  min-width: 100px;
  height: 50px;
  background-color: white;
  border-radius: 15px;
  padding: 5px;
  color: darkgoldenrod; }

.cat1 {
  background-image: url(images/cat1.png); }

.cat2 {
  background-image: url(images/cat2.jpg); }

.dog1 {
  background-image: url(images/pup1.jpg); }

.dog2 {
  background-image: url(images/pup2.jpg); }

/* Tablet */
@media screen and (min-width: 501px) and (max-width: 900px) {
  .grid-item {
    width: 49%; } }
/* Mobile */
@media screen and (max-width: 500px) {
  .grid-item {
    width: 100%; } }

/*# sourceMappingURL=style.css.map */