.transition {
    -webkit-transform: scale(1.2); 
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}
.thumb {
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	-ms-transition: all .4s ease-in-out;
	z-index:500;
}

.thumb {
    width:90%;
    margin:0;
}
.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ff0000' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ff0000' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}


/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

main > .container {
  padding: 60px 15px 0;
}

footer {
  background-color: #f8f9fa;
}

header {
  background-color: #f8f9fa;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

code {
  font-size: 80%;
}



.con {
  position: relative;
  width: 50%;
  #color: yellow;
}
.con:hover{
	border-style:solid;
	border-width:1px;
	border-color:silver;
	background-color:#f2f5f7;
}
.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

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

.con:hover .image {
  opacity: 0.3;
}

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

.text {
  background-color: #4CAF50;
  color: white;
  font-size: 16px;
  padding: 16px 32px;
}


/* https://bootsnipp.com/snippets/Vm7d */
/*
body {
    margin: 30px 0px;
}
.navbar-default .navbar-nav > li.dropdown:hover > a, 
.navbar-default .navbar-nav > li.dropdown:hover > a:hover,
.navbar-default .navbar-nav > li.dropdown:hover > a:focus {
    background-color: rgb(231, 231, 231);
    color: rgb(85, 85, 85);
}
li.dropdown:hover > .dropdown-menu {
    display: block;
}
*/



.black_white {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
}
.nice_color {
	background-color: #e4f8fc;
}

#ad-header {
	min-height: 300px;
}
@media screen and (min-width: 40em) {
	#ad-header {
		min-height: 300px;
	}
}

@media screen and (max-width: 960px) {
  #ad-slot {
    min-height: 300px;
  }
}



.centar_slike {
	 max-inline-size: 100%;
  block-size: auto;
  aspect-ratio: 2/1;
  object-fit: cover;
  object-position: top center;
}

/*
img {
  max-width: 100%;
  height: auto;
}
*/

.iste {
  max-width: 100%;
  max-height: auto;
  position: relative;
  vertical-align: middle;
  left: 50%;
  transform: translate(-50%);
  height: 150px;
  width: 150px;
  object-fit:cover;
}

.top-buffer { 
margin-top:0px;
/*height:280px;*/
}

.main {
    width: 70%;
    margin: 50px auto;
}

/* Bootstrap 4 text input with search icon */

.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}

ins[data-ad-status=unfilled] {display:none!important}

html {
    /*font-size: calc(13px + 0.390625vw);*/
}

.same_image {
    width: 200px; // how much you want
    min-height: 100px;
    float: left;
    margin: 10px;
}

.cropped { 
width: 200px; 
height: 350px; 
} 

.cropped-ofp {
width: 250px; 
height: 350px; 
object-fit: cover;
object-position: 0% 75%; 
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
  .mobileadunit {
      width:320px;
      height:50px;
      position:fixed;
      bottom:0px;
      display:block;
  }
}

#stickyunit { position: fixed; }

.same_height {
    float: left;
    width:  100px;
    height: 100px;
    object-fit: contain;
}

#backToTopBtn {
  /* Fiksna pozicija: ostaje na istom mestu dok skrolujete */
  position: fixed;
  bottom: 20px; /* 20 piksela od dna ekrana */
  right: 30px; /* 30 piksela od desne strane ekrana */
  z-index: 99; /* Da se prikazuje iznad drugog sadržaja */
  
  /* Stil dugmeta */
  border: none;
  outline: none;
  background-color: #555; /* Tamno siva pozadina, možete izabrati bilo koju boju */
  color: white; /* Beli tekst/simbol */
  cursor: pointer;
  padding: 15px;
  border-radius: 10px; /* Blago zaobljene ivice */
  font-size: 18px;
  
  /* Početno sakrivanje dugmeta */
  display: none; 
  /* Opciono: glatka tranzicija */
  transition: opacity 0.3s;
}

#backToTopBtn:hover {
  background-color: #000; /* Crna pozadina na prelazu miša */
}

.modal-backdrop {
  z-index: 1040 !important;
}

.modal {
  z-index: 1050 !important;
}

.modal-body {
  text-align: left;
}

/* Pravila za srednje i velike ekrane (od 768px i naviše) -ADSENSE OGLAS */
@media (min-width: 768px) {
    
    /* 1. Korišćenje STICKY umesto FIXED */
    #oglas-pozicija {
        /* Ključno svojstvo: čini element plivajućim, ali unutar roditelja */
        position: sticky; 
        
        /* Postavite na koliko piksela od vrha prozora treba da se "zalepi" */
        top: 20px;       
        
        z-index: 1000;
        
        /* UKLONITE: width: 300px; - jer sticky element zadržava širinu kolone */
    }

    /* Osigurajte da je kolona vidljiva */
    .sticky-ad-wrapper {
        display: block; 
    }
}

/* Pravila za male ekrane ostaju ista (sakrivanje) */
@media (max-width: 767.98px) {
     .sticky-ad-wrapper {
        display: none !important;
     }
}