@media (max-width: 1279px) {
  #wrapper {
    width: 100%;
  }

  .content-left {
    width: auto;
  }

  .proizvodi-wrapper {
    width: 100%;
  }

  .strong-title {
    margin-left: 100px;
  }

  .right-a {
    margin-right: 100px;
  }

  .banner {
    width: 100%;
  }

  .banner-text p {
    margin-left: 17%;
  }

  .about {
    width: 100%;
    height: 780px;
    margin: 0 auto;
    background-image: url(../img/about-background.jpg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
  }

  .about-text {
    float: right;
    width: 54%;
    height: 100%;
  }

  .about-title {
    margin-left: 10%;
  }

  .about-p {
    margin-left: 10%;
  }

  .about-btn {
    margin-left: 10%;
  }
}

@media (max-width: 950px) {
  .nav-bar {
    display: none;
  }

  #menu {
    display: block;
  }

  .hero {
    background-image: url(../img/hero-background-small.jpg);
    background-position: center;
  }

  .content-left {
    width: 100%;
    text-align: center;
  }

  .content-left .logo {
    margin-left: 0px;
    margin-top: 140px;
  }

  .title {
    margin-left: 0px;
    text-align: center;
  }

  .sub-title {
    margin-left: 0px;
  }

  .proizvodi {
    margin-left: 0px;
  }

  .line {
    margin-left: 0px;
  }

  .proizvod {
    display: block;
  }

  .strong-title {
    margin-left: 0px;
    margin-top: 40px;
    text-align: center;
    float: none;
  }

  .light-title {
    margin-left: 0px;
    margin-top: 0px;
    text-align: center;
    float: none;
  }

  .right-a {
    float: none;
    text-align: center;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 30px;
  }

  .proizvod:nth-child(2) {
    margin: 0 auto;
    margin-top: 20px;
  }
  .proizvod:first-child {
    margin: 0 auto;
    margin-top: 40px;
  }
  .proizvod:nth-child(3) {
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 40px;
  }

  .lista-proizvoda {
    width: 100%;
    margin: 0 auto;
  }

  .banner {
    width: 100%;
    height: 360px;
    background-image: none;
  }

  .banner-text {
    display: none;
  }

  .banner-button {
    float: none;
    width: 100%;
  }

  .prodavnica {
    margin-top: 30px;
  }

  .helper-text {
    display: block;
    margin-top: 0px;
  }

  .about {
    width: 100%;
    height: auto;
    background-image: url(../img/about-background-small.jpg);
  }

  .about-text {
    width: 100%;
    text-align: center;
  }

  .about-title {
    margin-left: 0px;
  }

  .about-p {
    margin-left: 0px;
    padding: 0px 20px 0px 20px;
  }

  .about-btn {
    margin-left: 0px;
    margin-bottom: 120px;
  }

  .contact {
    width: 100%;
    height: auto;
  }

  .contact-left {
    width: 100%;
    float: none;
    margin-left: 0px;
  }

  .contact-right {
    width: 100%;
    float: none;
    margin-left: 0px;
    margin-bottom: 40px;
  }

  .footer {
    width: 100%;
    height: auto;
    text-align: center;
  }

  .copyright {
    margin-left: 0px;
  }

  .left-footer {
    width: 100%;
  }

  .right-footer {
    width: 100%;
  }

  .footer ul {
    margin-top: 0px;
    margin-bottom: 60px;
    float: none;
  }
}