@charset "UTF-8";
html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

header ul {
  list-style-type: none;
}

body {
  background-color: #eee;
}

html {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

a {
  font-size: 1.5rem;
}

.tel {
  font-size: 1.5rem;
  color: #fff;
  text-decoration: none;
  outline: none;
}

header span {
  font-size: 2.5rem;
  color: #1e3d33;
}

header .sticky-header__h1 {
  background: -webkit-gradient(linear, left top, right bottom, from(#43eb8e), to(#777));
  background: linear-gradient(to right bottom, #43eb8e, #777);
  text-align: center;
  color: #fff;
  line-height: 2.5rem;
}

header h1 {
  text-transform: uppercase;
  padding: 3rem;
  margin-top: 0;
}

header .rad {
  text-decoration: underline;
}

header ul {
  text-align: center;
  margin: 0;
  padding-left: 0;
  line-height: 4.5rem;
  background: url(img/kombi.jpg) center center/90% no-repeat;
}

header li {
  display: inline-block;
  margin: 0 4rem;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

header li:hover {
  -webkit-transform: scale(1.2) translateY(-0.1rem);
          transform: scale(1.2) translateY(-0.1rem);
}

header li:hover:active {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

header li a {
  text-decoration: none;
  color: #fff;
  background: -webkit-gradient(linear, left top, right bottom, from(#7ed56f), to(#777));
  background: linear-gradient(to right bottom, #7ed56f, #777);
  padding: .5rem;
  border-radius: 3px;
  -webkit-box-shadow: 0 0.5rem 1rem #000;
          box-shadow: 0 0.5rem 1rem #000;
  border: 1px solid #fff;
}

main .onama {
  line-height: 2.5rem;
  font-size: 1.5rem;
  text-align: center;
  background: -webkit-gradient(linear, left top, right bottom, from(#55c57a), to(#999));
  background: linear-gradient(to right bottom, #55c57a, #999);
  color: #fff;
  padding: .5rem;
  margin-top: 1.5rem;
  text-transform: uppercase;
}

main .onama span {
  color: #1e3d33;
  font-weight: bold;
}

main .onama .slike1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 70%;
  margin: 0 auto;
}

main .onama .slike1 div {
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  height: 40vw;
  margin-bottom: 1rem;
  border: 4px solid #fff;
}

main .onama .slike1__1 {
  background: url(img/ljudi.jpg) center center/100% no-repeat;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
}

main .onama .slike1__1:hover {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}

main .onama .slike1__2 {
  background: url(img/vrece.jpg) center center/100% no-repeat;
  -webkit-transition: -webkit-transform .3s;
  transition: -webkit-transform .3s;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s;
}

main .onama .slike1__2:hover {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}

main .icons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

main .icons h3 {
  color: #55c57a;
  margin-top: 0;
  text-transform: uppercase;
}

main .icons p {
  color: #333;
}

main .icons__box {
  -ms-flex-preferred-size: 43%;
      flex-basis: 43%;
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

main .icons__box img {
  padding-right: 1rem;
}

main .icons__box-text {
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
}

main .usluge {
  line-height: 3rem;
  font-size: 1.5rem;
  text-align: center;
  background: -webkit-gradient(linear, left top, right bottom, from(#55c57a), to(#999));
  background: linear-gradient(to right bottom, #55c57a, #999);
  color: #fff;
  padding: .5rem;
  text-transform: uppercase;
}

main .usluge span {
  color: #1e3d33;
  font-weight: bold;
}

main .usluge .medo {
  font-size: 2rem;
}

main .usluge .slike2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  padding-bottom: 2rem;
  margin: 0 2rem 0 2rem;
}

main .usluge .slike2 div {
  -ms-flex-preferred-size: 45%;
      flex-basis: 45%;
  background-color: red;
  height: 30vW;
  margin: 1rem;
  border: 4px solid #fff;
  -webkit-transition: -webkit-transform .2s;
  transition: -webkit-transform .2s;
  transition: transform .2s;
  transition: transform .2s, -webkit-transform .2s;
}

main .usluge .slike2 div:hover {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}

main .usluge .slike2__1 {
  background: url(img/laminat.jpg) center center/cover;
}

main .usluge .slike2__2 {
  background: url(img/limovi.jpg) center center/cover;
}

main .usluge .slike2__3 {
  background: url(img/otpad.jpg) center center/cover;
}

main .usluge .slike2__4 {
  background: url(img/kombi.jpg) center center/cover;
}

main .usluge .slike2__5 {
  background: url(img/ormari.jpg) center center/cover;
}

main .usluge .slike2__6 {
  background: url(img/limovi.jpg) center center/cover;
}

main .usluge .slike2__7 {
  background: url(img/knjige.jpg) center center/cover;
}

main .usluge .slike2__8 {
  background: url(img/gramofonske-ploče.jpg) center center/cover;
}

footer {
  line-height: 2.5rem;
  background-color: #333;
  text-align: center;
  padding: 1.5rem;
}

footer h1 {
  color: #55c57a;
  text-transform: uppercase;
}

footer h1 span {
  color: #fff;
  font-size: 2.5rem;
}

footer .rad {
  text-decoration: underline;
}

@media (max-width: 767px) {
  main .usluge .slike2 div {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
  }
}

@media (max-width: 477px) {
  main .icons .icons__box {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
  }
}
/*# sourceMappingURL=style.css.map */