
/* CSS Document */



html, body {
overflow-x: hidden !important;
overflow-y: hidden !important;
padding: 0px; margin: 0px; border: 0px;
top: 0px; left: 0px; right: 0px; bottom: 0px; width: 100vw; height: 100vh;
min-width: 100vw !important; min-height: 100vh !important; max-width: 100vw;
line-height: 100%; background-color: transparent !important; background-color: rgba(0,0,0,0.85)!important;}

html
{background-size: 1px 1px !important; 
background-image: url("img/A9.webp"), 
url("img/I1.webp"), 
url("img/I2.webp") !important; }


body {box-sizing: border-box; }



p { font-family: 'League Spartan', sans-serif; 
font-weight: 600 !important; 
font-size: 1.65vh;
line-height: 1.65vh;
color: rgba(255,255,255,0.85);}

a:link, a:visited, a:hover, a:active {text-decoration: none !important; color: rgba(255,255,255,0.85);}

.nula {opacity: 0; }




#gal23 { z-index: 5; 
height: 100%; box-sizing: border-box !important;
position: fixed;
top: 0vh; left: 0px;
width: 100vw; min-width: 100vw!important;
margin: 0px;
background-position: center center;
background-size:cover; display: block; background-color:  transparent !important;}	


.galerijaslika { top:0vh; position: absolute; background-position: 50% 50%; background-size: cover; 
background-color: rgba(255,255,255,0.01); !important; }


#gal23 {counter-reset: ins -1;}

#gal23 div.brojanje::before {
counter-increment: ins;
content:counter(ins) "/3";}
	

	
#gal23 div.brojanje::before {	display: block; z-index:15;
color: rgba(255, 255, 255, 0.8); font-family: 'League Spartan', sans-serif;  font-weight:600;
font-size: 4.2vh;line-height: 4.2vh;letter-spacing: 0px;
bottom: 0.25vh; margin-left: 3vh; position: absolute; 
background-color: rgba(40, 50, 50, 0.55); background-color: rgba(15, 40, 90, 0.85);
padding: 0.85vh 1.5vh 0.45vh 1.5vh;
border-radius: 0.25vh; 

font-size: 3.3vh; line-height: 3.3vh; margin-left: 1.5vh; bottom: 0.75vh;
}





.sl1 { background-image: url(img/A9.webp)!important; background-position: 67% 60%!important;}
.sl2 { background-image: url(img/I1.webp)!important; background-position: 50% 25%!important;}
.sl3 { background-image: url(img/I2.webp)!important; background-position: 50% 100%!important;}



#Openin {opacity: 1; display:none; display:block; 
 margin:0vw; right:1.5vh; margin-top: 1.5vh; background-color: rgba(0,0,0,0.5); background-color: rgba(191, 20, 7, 0.9);
color: rgba(255,255,255,1.0);
position: absolute;
font-weight: 600; font-size: 2.1vh; line-height: 2.1vh; letter-spacing: -0.07vh;
font-family: 'League Spartan', sans-serif; 

height:2.1vh; width: auto; padding: 1.0vh 1.5vh 0.9vh 1.5vh; border-radius:0.5vh;
transition: all .2s ease-in-out;
transform-origin: top right;
text-decoration: none; cursor: pointer; z-index:7;}


#Openin:hover { 
background-color: rgba(191, 20, 7, 0.9);
-webkit-transform: scale(1.1); 
-moz-transform: scale(1.1); 
-ms-transform: scale(1.1);  
-o-transform: scale(1.1); 
transform: scale(1.1);}



@media all and (orientation: landscape) and (max-height: 767px) {

#gal23 div.brojanje::before {	
color: rgba(255, 255, 255, 0.9);
font-size: 5.5vh;line-height: 5.5vh;letter-spacing: 0px;
bottom: 0.0vh; 
margin-left: -moz-calc(50vw - 6.5vh);
margin-left: -webkit-calc(50vw - 6.5vh);
margin-left: calc(50vw - 6.5vh);

width: 13vh; bottom:0vh;
border-radius: 0.5vw 0.5vw 0vh 0vh; text-align: center!important;
padding: 1.35vh 0vh 0.75vh 0vh;
background-color: rgba(15, 40, 90, 0.85);
}

#Openin {font-size: 3.0vh; line-height: 3.0vh; height: 3vh;
padding: 1vh 2vh; border-radius: 0.5vh; margin:0vw; right:1vh;
margin-top:1.0vh; }	

}



@media all and (orientation: landscape) and (max-height: 550px) {

div.brojanje {	display:block; top:0vh; position:absolute; margin:0vh; height: 100vh; width: 100vw;}

#gal23 div.brojanje::before {	
font-size: 7.5vh;line-height: 7.5vh;
margin-left: -moz-calc(50vw - 10.5vh);
margin-left: -webkit-calc(50vw - 10.5vh);
margin-left: calc(50vw - 10.5vh);

width: 21vh; height:9.0vh;
border-radius: 0.5vw 0.5vw 0vh 0vh; 
padding: 2.5vh 0vh 0vh 0vh;
bottom:0vh;
}

#Openin {font-size: 6.25vh; line-height: 6.25vh; height: 6.25vh;
padding: 2vh 3.0vh; border-radius: 0.5vh; margin:0vw; right:2vh;
margin-top:2.0vh;}
	
}


@media all and (orientation: portrait) and (min-width: 768px) { 

#Openin {font-size: 3.5vw; line-height: 3.5vw; letter-spacing: 0vw; 
height:3.5vw; padding: 1.5vw 1.75vw 1vw 1.75vw; border-radius:1.0vw; margin:0vw; right:1vh;
margin-top:1.0vh; position:absolute;}
	
}


@media all and (orientation: portrait) and (max-width: 767px) { 

#Openin {font-size: 5vw; line-height: 5vw; letter-spacing: 0vw; 
height:5vw; padding: 2.5vw 3vw 2vw 3vw; border-radius:0.75vw; margin:0vw; right:1vh;
margin-top:1.0vh;}
	
}




@media all and (orientation: portrait) {		
	
#gal23 div.brojanje::before {	
color: rgba(255, 255, 255, 0.9);
font-size: 4.2vh;line-height: 4.2vh;letter-spacing: 0px;

margin-left: -moz-calc(50vw - 5.0vh);
margin-left: -webkit-calc(50vw - 5.0vh);
margin-left: calc(50vw - 5.0vh);


width: 10vh; bottom:1vh;
border-radius: 0.5vh 0.5vh 0.5vh 0.5vh; text-align: center!important;
padding: 1.0vh 0vh 0.8vh 0vh;
background-color: rgba(15, 40, 90, 0.85);
}
	
.sl2 { background-position: 72% 60%!important;}	
.sl3 { background-position: 90% 100%!important;}		
}