.apart-photo {
  background-image: url(http://apart115.pl/img/wizualizacja.jpg);
}

/* changed here */
.batory-gdynia-photo {
  background-image: url("../img/nowe-karwiny/new/4s.jpg");
}
.zielony-zakatek-torun-photo {
  background-image: url("../img/zielony-zakatek/MIEJSCE.jpg");
}
.kasprusie-zakopane-photo {
  background-image: url("../img/ZAKOPANE TOP.jpg");
}
.staromiejskie-grudziadz-photo {
  background-image: url("../img/staromiejskie/01.jpg");
}
.zielone-korony-plock-photo {
  background-image: url("../img/zielone-korony-nowe/glowna_zielone_korony.jpg");
}
.nowy-park-wloclawek-photo {
  background-image: url("../img/osiedle-nowy-park-wloclawek-2-etap-hp-image-min.jpg");
}
.solis-sopot-photo {
  background-image: url("../img/solissopotmodal.jpg");
}
.lokietka-plock-photo {
  background-image: url("../img/lokietkaplockmodal.jpg");
}
.sobieski-wloclawek-photo {
  background-image: url("../img/sobieskiwloclawekmodal.jpg");
}
.chrobry-plock-photo {
  background-image: url("../img/chrobryplockmodal.jpg");
}
.chrobry-zazamcze-wloclawek-photo {
  background-image: url("../img/chrobryzazamczewloclawekmodal.jpg");
}
.magnat-plock-photo {
  background-image: url("../img/magnatplockmodal.jpg");
}
.chrobry-zagajewskiego-wloclawek-photo {
  background-image: url("../img/chrobryzagajewskiegowloclawekmodal.jpg");
}
@media only screen and (max-width: 992px) {
  .estates {
    width: 100%;
  }
  .estate {
    width: 100%;
  }
  .estate-photo {
    height: 60vw;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    width: 100%;
  }
  .estate-info {
    box-sizing: border-box;
    padding: 15vw;
    /*         height: 50vh; */
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .estate-header {
    display: flex;
    align-items: center;
    justify-content: right;
    margin-bottom: 11vw;
  }
  p {
    line-height: 6vw;
    font-size: 5vw;
    font-weight: 300;
    margin-bottom: 9vw;
    text-align: center;
  }
  .estate-logo {
    width: 30vw;
    padding-right: 5vw;
  }
  .estate-city {
    height: 15vw;
    line-height: 15vw;
    border-left: 1px solid #e3e3e3;
    padding-left: 5vw;
    font-weight: 300;
    font-size: 8vw;
    color: #223343;
  }
  .estate-logo img {
    width: 100%;
  }
  .stats {
    margin: auto;
    width: 54vw;
    text-align: left;
    font-weight: 300;
    color: #797979;
    font-size: 5vw;
    margin-bottom: 6vw;
  }
  .stat {
    /*         display: inline-block; */
    height: 6vw;
    line-height: 7vw;
    /*         display: block; */
  }
  .stat:not(:last-of-type) {
    margin-bottom: 1vw;
  }
  .stats span {
    font-size: 6vw;
    letter-spacing: -0.3vw;
  }
  .estate-info-inner {
    text-align: center;
  }
  .estate-info-inner button {
    font-weight: 300;
    font-size: 5vw;
    color: white;
    margin: 5vw auto;
    background: black;
    border: none;
    text-transform: uppercase;
    padding: 2vw 5vw;
  }
  .bit-higher {
    height: 60vw;
  }
}

@media only screen and (min-width: 992px) {
  .bit-higher {
    height: 30vw;
  }
  .estates {
    width: 100%;
  }
  .estate {
    width: 100%;
    height: 25.5vw;
  }
  .estate-photo {
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    width: 50%;
  }
  .estate-info {
    box-sizing: border-box;
    padding: 3.2vw 4.4vw;
    height: 100%;
    width: 50%;
    display: flex;
    /* justify-content: center; */
    align-items: center;
  }
  .estate-header {
    display: flex;
    align-items: center;
    margin-bottom: 1.8vw;
  }
  .to-left .estate-header {
    display: flex;
    align-items: center;
    justify-content: right;
    margin-bottom: 1.8vw;
  }
  .to-right p {
    width: 29.6vw;
    font-size: 1vw;
    font-weight: 300;
    margin-bottom: 1.6vw;
  }
  .to-left {
    box-sizing: border-box;
    padding: 3.2vw 4.4vw;
    height: 100%;
    width: 50%;
    display: flex;
    justify-content: right;
    align-items: center;
  }
  .to-left .estate-info-inner {
    text-align: right;
  }
  .to-left p {
    float: right;
    text-align: right;
    width: 29.6vw;
    font-size: 1vw;
    font-weight: 300;
    margin-bottom: 1.6vw;
  }
  .to-left .stats {
    float: right;
    width: 100%;
  }
  .to-left button {
    float: right;
  }
  .estate-logo {
    width: 8.6vw;
    float: left;
    padding-right: 2vw;
  }
  .estate-city {
    height: 4vw;
    line-height: 4vw;
    border-left: 1px solid #e3e3e3;
    padding-left: 2vw;
    font-weight: 300;
    font-size: 1.7vw;
    color: #223343;
  }
  .estate-logo img {
    width: 100%;
  }

  .to-left {
    float: left;
  }
  .to-left .estate-header {
    float: right;
  }
  .to-right {
    float: right;
  }
  .stats {
    font-weight: 300;
    color: #797979;
    font-size: 1.2vw;
    margin-bottom: 1.9vw;
  }
  .stat {
    display: inline-block;
    height: 3.2vw;
    line-height: 3.2vw;
  }
  .stat:not(:last-of-type) {
    border-right: 1px solid #797979;
    padding-right: 1.3vw;
    margin-right: 1.3vw;
  }
  .stats span {
    font-size: 1.8vw;
    letter-spacing: -0.1vw;
  }
  .estate-info-inner {
    width: 100%;
  }
  .estate-info-inner button {
    font-weight: 300;
    font-size: 1.2vw;
    color: white;
    /*         margin: 0 auto; */
    background: black;
    border: none;
    text-transform: uppercase;
    padding: 0;
    position: relative;
    display: block;
  }
}

.to-left.in-view {
  animation: fadeInLeftBig;
  animation-duration: 1s;
  animation-delay: 0s;
  animation-fill-mode: both;
  backface-visibility: hidden;
}

.to-right.in-view {
  animation: fadeInRightBig;
  animation-duration: 1s;
  animation-delay: 0s;
  animation-fill-mode: both;
  backface-visibility: hidden;
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    transform: translate3d(-100px, 0, 0);
    filter: grayscale(100%);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInLeftBig {
  animation-name: fadeInLeftBig;
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    transform: translate3d(100px, 0, 0);
    filter: grayscale(100%);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInLeftBig {
  animation-name: fadeInRightBig;
}
