.stage-shelf {
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 0;
    width: 250px;
    padding-top: 30px;
    background-color: #f2f2f2;
}

.nav > li > a:hover, .nav > li > a:focus {
            text-decoration: none;
            background-color: transparent;
            color: black!important;
        }
        .naslovIzdelka:hover{
            color:black;
        }
        .description{
            text-align:justify;
        }

.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}
        .image:hover{
             filter:brightness(50%);
        }

.middle {
  transition: .5s ease;
  opacity: 0;
  position: relative;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%)
}

.container1:hover .image {
  filter:brightness(80%);

}

.container1:hover .middle {
  opacity: 1;
}

.text {
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
  background-color:rgba(0,0,0,0) ;
  color: white;
  font-size: 16px;
  padding: 16px 32px;
    margin-top: -34%
}

        /* ImageGrid */
        #photos {
   /* Prevent vertical gaps */
   line-height: 0;

   -webkit-column-count: 5;
   -webkit-column-gap:   0px;
   -moz-column-count:    5;
   -moz-column-gap:      0px;
   column-count:         5;
   column-gap:           0px;
}

#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

@media (max-width: 1600px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 400px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}
      .centered {
  position: absolute;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}


/* note: this is a hack for ios iframe for bootstrap themes shopify page */
      /* this chunk of css is not part of the toolkit :) */
      /* …curses ios, etc… */
      @media (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2) {
        body {
          width: 1px;
          min-width: 100%;
          *width: 100%;
        }
        #stage {
          height: 1px;

          overflow-x: hidden;
          min-height: 100vh;
          -webkit-overflow-scrolling: touch;
        }
      }

        body{
            overflow-x: hidden;
            background-color: white;
        }
.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
    transform: scale(1.1);
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(25, 26, 27,0);
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: ;
}

.container1:hover .overlay {
  height: 20%;
}

.text {
  white-space: nowrap;
  color: black;
  font-size: 20px;
  position: absolute;
  overflow: hidden;
  top: 90%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
        .block-inverse{
            background-color: white;
        }


        #mainImage{
            position: absolute;

        }
        .languagepicker {
	background-color: #FFF;
	display: inline-block;
	padding: 0;
	height: 40px;
	overflow: hidden;
	transition: all .3s ease;
	margin: 0 50px 10px 0;
	vertical-align: top;
	float: left;
}

.languagepicker:hover {
	/* don't forget the 1px border */
	height: 81px;
}

.languagepicker a{
	color: #000;
	text-decoration: none;
}

.languagepicker li {
	display: block;
	padding: 0px 20px;
	line-height: 40px;
	border-top: 1px solid #EEE;
}

.languagepicker li:hover{
	background-color: #EEE;
}

.languagepicker a:first-child li {
	border: none;
	background: #FFF !important;
}

.languagepicker li img {
	margin-right: 5px;
}

.roundborders {
	border-radius: 5px;
}

.large:hover {
	/*
	don't forget the 1px border!
	The first language is 40px heigh,
	the others are 41px
	*/
	height: 245px;
}
        .fixed-top{
            position: fixed;
            top: 0;
                background-color: rgba(255, 255, 255, 1);
        }
        .affix {
      bottom:0;
      width: 100%;
      z-index: 99999 !important;
  }


#gallery{
height:85vh;
}
#gallery,
#gallery > div{
  position:absolute;
  top:0; left:0; bottom:0;right:0;

}
#gallery > div{
  background: none 50% / contain ;
    background-repeat: no-repeat;
  transform:scale(1.2);
  transition:4s;
  opacity: 0;
}
#gallery > div.on{
  transition-delay: 0.3s;
  transform:scale(1.1);
  opacity: 1;
}
        .centered {
  position: fixed;
  top: 50%;
  left: 50%;
        }

        .filter__item--selected {
    color: #ffffff;
    border-color: #ffffff;
            z-index: 20000;


}
.filter__item{
  font-family: "Work sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
}

        .hvr-grow {
    display: inline-block;
    vertical-align: middle;
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    transition-duration: 0.3s;
    transition-property: transform;
}

.hvr-grow:hover,
.hvr-grow:focus,
.hvr-grow:active {
    transform: scale(1.1);
}
            .black{
                color: black !important;
            }
            .item{
                border-radius: 2px;


            }

        @font-face {
    font-family: "logoTowoodFonts";
    src: url("../fonts/ArcaMajora3-Bold.woff") format('woff');
}
        @font-face {
    font-family: "LogotowoodHeaders";
    src: url("../fonts/phagspab.tff") format('tff');
}
        .logotoHeader{
             font-family: 'Open Sans', sans-serif;
        }
        .naslovIzdelka{
            font-family: 'logoTowoodFonts';
        }
        .noHover:hover{
            -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
-moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
box-shadow: 0px 0px 0px 0px rgba(0,0,0,0);
            border:0px ;
        }
        .bar{
            z-index: 4000;
        }
        .logotwoodLogo{
            font-family: 'Montserrat', sans-serif;
        }