@import url(https://fonts.googleapis.com/css?family=Open+Sans);
@import url(https://fonts.googleapis.com/css?family=Fira+Sans);
@import url(https://fonts.googleapis.com/css?family=Montserrat);
@import url(https://fonts.googleapis.com/css?family=Droid+Sans);
body {
	  font-family: 'Fira Sans';
	  background-color: #eee;
}

p {
	color: #666;
	line-height: 1.7em;
}

li {
	color: #666;;
}

p {
	text-align: justify !important;
}


#sendmail input, textarea {
	border: 0px none  !important;
	border-bottom: 1px solid #bbb !important;
	width: 100%;
	margin-bottom: 10px;
}

.carousel-caption {
	text-shadow: 2px 2px 4px black !important;
}
.carousel-caption h1 {
	background-color: rgba(0, 0, 0, 0.2) !important;
}
.carousel-caption h2 {
	background-color: rgba(0, 0, 0, 0.2) !important;
}
.carousel-indicators li {
	border: 1px solid #aaa !important;
}
.carousel-indicators {
	margin-bottom: -20px;
}

.dropdown-menu > li > a:hover {
	color: black !important;
}

.navbar-inverse {
	background-image: -webkit-linear-gradient(top, #0073b5 0, #8ecaed 100%) !important;
	background-image: -o-linear-gradient(top, #0073b5 0, #8ecaed 100%) !important; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#0073b5), to(#8ecaed)); 
	background-image: linear-gradient(to bottom, #0073b5 0, #8ecaed 100%) !important; 
	
	border-color: #0073b5 !important; 
	}
.navbar-inverse a {
	color: #eee !important;
}
.navbar-inverse a:hover {
	color: #fff !important;
}
.active {
	background-color: #f66 !important;
}
.products-imgs {
	/* height: 500px; */
}
.products-imgs a:hover {
	color: #fff;
}
.products-imgs div {
}
.kategorija-img-naslov {
	background-color: #ddd;
    position: relative;
    color: #fff;
    text-shadow: 1px 1px 1px #222;
    font-weight: bold;
	letter-spacing: 1px;
}
	.kategorija-img-naslov::before,
	.kategorija-img-naslov::after {
	    content: '';
	    position: absolute;
	    top: 0;
	    right: 0;
	    border-color: transparent;
	    border-style: solid;
	}
	
	.kategorija-img-naslov::before {
	    border-width: 1.5em;
	    border-right-color: #fff;
	    border-bottom-color: #fff;
	}




.products-imgs img {
	width: 100%;
}
.dropdown-menu {
	background-color: #005688 !important;
}
.dropdown-menu li a:hover {
		background-color: #005688 !important;
}

.caption {
	font-size: 12px !important;
}


.obavestenja-tip {
	color: #0073b5;
}

.obavestenja-naslovna {
	background-image: linear-gradient(to bottom, #cdedff 0, #fff 40%) !important; 
}


.artikal-sifra {
	color: white !important;
}


/* xs < 768 */
@media screen and (max-width: 767px) {
    body {
        font-size: 1.5em !important;
    }
    .force-left {
	    text-align: left !important;
    }
    #mk-search-group {
	    
    }
}

/* sm */
@media screen and (min-width: 768px) {
    body {
        font-size: 1.6em !important;
    }
    .force-left {
	    text-align: left !important;
    }

}

/* md */
@media screen and (min-width: 992px) {
    body {
        font-size: 1.5em !important;
    }
    .force-left {
	    text-align: right !important;
    }
}

/* lg */
@media screen and (min-width: 1200px) {
    body {
        font-size: 1.8em !important;
    }
    #mk-search-group {
	    width: 200px;
    }
}








/* from proizvodi.php */

.products-imgs .akcija-container {
	position: absolute;
	top: 3em;
	right: 1em;
}
.pswp__caption2 .akcija-container {
	position: absolute;
	bottom: 20px !important;
	right: -4em;
}
.akcija_title {
	font-size: 0.5em;
}
/* https://www.w3schools.com/howto/howto_css_image_overlay.asp */
.text-detaljnije {
	font-size: 0.9em;
	text-shadow: 1px 1px 1px white;
	padding: 4px;
	color: #333;
	text-align: center;
	position: absolute;
	bottom: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	opacity: 0;
	background-color: #ccc;
	border: 1px solid #ddd;
}
.products-imgs:hover img {
	opacity: 0.3;
	transition-property: all;
	transition-duration: 1s;
	transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}
.products-imgs:hover .text-detaljnije {
	opacity: 1;
}
.naziv-opisa {
	color: #111;
}
h2 {
	margin: 0px !important;
	padding: 0px !important;
	font-size: 24px;
	font-weight: bold;
}
h4 {
	line-height: 1.4em;
}
.pswp__caption__center2 {
	text-shadow: 1px 1px 2px #fff;
}



.proizvod {
	cursor: pointer; 
	display: block; 
	margin-right: 20px; 
	margin-top: 10px; 
	margin-bottom: 10px; 
	border: 1px solid #bbb; 
	box-shadow: 2px 2px 5px #ddd;
}