@charset "utf-8";
/* CSS Document */

/* holder width: 14.6%;  width: 12.2%; experimental  border: #FF8E00 1px solid;   */

#photo {
	padding: 4rem 0 4rem 0;		
}

#video {	
	padding: 4rem 0 1rem 0;
}

.img-holder {
    position: relative;
    width: 12.75%;
    margin: 0.75%;
    float: left;
    display: inline-block;    
}

.img-holder:after {
    content: "";
    display: block;
    padding-bottom: 100%; /* kvadrat */
}

.img-holder img {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
}

.img-holder:hover img {
    filter: sepia(100%) hue-rotate(150deg) saturate(200%);    
}

/** Lightbox markup **/

.lightbox {	
	display: none;
	
	position: fixed;
	z-index: 9999;
	width: 100%;
	height: 100%;
	text-align: center;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.85);	
}

.lightbox img {	
	max-width: inherit;
	max-height: 100%;
	margin-top: 2.5%;
	margin-bottom: 2.5%;			
}

.lightbox:target {	
	outline: none;	
	display: block;
	-webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;		
}

/* Lightbox media screen */
@media screen and (max-width: 1020px) {
  .lightbox img { max-width: 80%; max-height: inherit; }
}

@media screen and (max-width: 660px) {
  .img-holder { float: none; width: 30%; }
}

@media screen and (max-width: 460px) {  
  .img-holder { width: 46%; }
}

@media screen and (max-width: 330px) {  
  .img-holder { width: 92%; margin: 3%; }
}

/* Lightbox images */
#mmax-01 { background: url(../media_files/mir_1.jpg); background-position: center; background-size: cover; }
#mmax-02 { background: url(../media_files/mir_2.jpg); background-position: center; background-size: cover; }
#mmax-03 { background: url(../media_files/mir_3.jpg); background-position: center; background-size: cover; }
#mmax-04 { background: url(../media_files/mir_4.jpg); background-position: center; background-size: cover; }
#mmax-05 { background: url(../media_files/mir_5.jpg); background-position: center; background-size: cover; }
#mmax-06 { background: url(../media_files/mir_6.jpg); background-position: center; background-size: cover; }
#mmax-07 { background: url(../media_files/mir_7.jpg); background-position: center; background-size: cover; }
#mmax-08 { background: url(../media_files/mir_8.jpg); background-position: center; background-size: cover; }
#mmax-09 { background: url(../media_files/mir_9.jpg); background-position: center; background-size: cover; }
#mmax-010 { background: url(../media_files/mir_10.jpg); background-position: center; background-size: cover; }
#mmax-011 { background: url(../media_files/mir_11.jpg); background-position: center; background-size: cover; }
#mmax-012 { background: url(../media_files/mir_12.jpg); background-position: center; background-size: cover; }
#mmax-013 { background: url(../media_files/mir_13.jpg); background-position: center; background-size: cover; }
#mmax-014 { background: url(../media_files/mir_14.jpg); background-position: center; background-size: cover; }
#mmax-015 { background: url(../media_files/mir_15.jpg); background-position: center; background-size: cover; }
#mmax-016 { background: url(../media_files/mir_16.jpg); background-position: center; background-size: cover; }
#mmax-017 { background: url(../media_files/mir_17.jpg); background-position: center; background-size: cover; }
#mmax-018 { background: url(../media_files/mir_18.jpg); background-position: center; background-size: cover; }
#mmax-019 { background: url(../media_files/mir_19.jpg); background-position: center; background-size: cover; }
#mmax-020 { background: url(../media_files/mir_20.jpg); background-position: center; background-size: cover; }
#mmax-021 { background: url(../media_files/mir_21.jpg); background-position: center; background-size: cover; }
#mmax-022 { background: url(../media_files/mir_22.jpg); background-position: center; background-size: cover; }
#mmax-023 { background: url(../media_files/mir_23.jpg); background-position: center; background-size: cover; }
#mmax-024 { background: url(../media_files/mir_24.jpg); background-position: center; background-size: cover; }
#mmax-025 { background: url(../media_files/mir_25.jpg); background-position: center; background-size: cover; }
#mmax-026 { background: url(../media_files/mir_26.jpg); background-position: center; background-size: cover; }
#mmax-027 { background: url(../media_files/mir_27.jpg); background-position: center; background-size: cover; }
#mmax-028 { background: url(../media_files/mir_28.jpg); background-position: center; background-size: cover; }
#mmax-029 { background: url(../media_files/mir_29.jpg); background-position: center; background-size: cover; }
#mmax-030 { background: url(../media_files/mir_30.jpg); background-position: center; background-size: cover; }