@import url("fonts.css");
@import url("materialize.min.css");

* { margin: 0; padding: 0; box-sizing: border-box }

body {
  text-align: center;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  font: 16px "Open Sans"
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

.main {
  flex: 1 0 auto;
}

.main ul.browser-default {
  padding: 12px 0 0 24px
}

.main img.right {

}

footer {
  font-size: 11px
}

footer a {
  color: #9e9e9e;
  text-decoration: underline
}

p {
  margin-bottom: 24px
}

nav {
  box-shadow: none;
  height: auto;
}

nav .brand-logo {
  position: static;
  padding-top: 12px !important;
  display: block
}

nav ul li {
  float: none;
  display: inline-block;
}

nav ul a {
  line-height: 48px;
  text-transform: uppercase
}

nav ul a:hover {
  background: none;
  border-bottom: 3px solid #2196F3;
}

nav ul li.active {
  background: transparent;
  border-bottom: 3px solid #ffc107
}

nav ul li.active a {
  color: #ffc107 !important
}

nav ul li.active a:hover {
  border-bottom: none
}

nav ul#nav-mobile {
  width: 60%;
}

nav ul#nav-mobile li {
  display: block;
  text-align: left;
  text-overflow: ellipsis;
  width: 100%;
  height: 48px;
  overflow: hidden;
  white-space: nowrap
}

nav ul#nav-mobile li a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidenav li a:hover {
  border: none
}

.sidenav li.active {
  background: #2196F3;
  border: none
}
.sidenav li.active a{
  color: white !important
}

.main {
  padding-top: 24px;
  text-align: left;
}

.clear {
  clear: both
}

@media all and (max-width: 992px) {
  nav .brand-logo {
    display: inline-block
  }
  nav .brand-logo img {
    height: 64px;
    width: auto;
  }
}

@media all and (max-width: 600px) {
  .ponovna-upotreba-reciklaznih-materijala .row.clear .col {
    margin-bottom: 24px
  }
  .main .mobile-center {
    float: none !important;
    text-align: center
  }
  .main img {
    max-width: 100%;
    height: auto
  }
}