/*-----------------------------------------------------------------------------------
	
2 do - ovisi o svakom projektu, potraži tu, 2do isto

-------

XXX - site width

768x1024 - ipad, portrait
1024x768 - ipad, landscape
?? - ipad mini
320x480 - iphone, p. (po defaultu prikazuje kao 980px širine)
480x320 - iphone, l.
320x568 - iphone 5
568x320 - iphone 5


u inc.js treba dodati ovo:

$(document).ready(function(){
	// div oko tabele, radi mobi sajta
	$('.item table').wrap('<div class="tblWrapper">');    	
});


// dok imaš listing dokumenata u stupcima ili fotke, složi da za svaki zadnji i prvi clear jer zna biti problema ako su različite visine (npr. ako su ispod slika autori, pa padne u drugi red kod jedne fotke), vidi:TSD, PIM, vetrinjski, npr.

	.galerijaC figure { 
		width:30.66666666666667%;
		margin:0 4% 2% 0;
	}
	.galerijaC figure:nth-child(3n) {
		clear:right;
	}
	.galerijaC figure:nth-child(3n+1) {
		clear:left;
	}

// listing dokumenata, vetrinjsko

	.itemListed {
		width:45%;
		margin-right:5%;
	}
	.itemListed:nth-of-type(3n) { /* reset *
		clear:none;
		margin-right:5%;
	}
	.itemListed:nth-of-type(3n+1) { /* reset *
		clear:none;
	}
	.itemListed:nth-of-type(2n) {
		margin-right:0;
		clear:right;
	//	float:left;
	}
	.itemListed:nth-of-type(2n+1) { /* first in a row *
		clear:both;
	}		
	
	
// RWD - boxovi (imgs recimo) automatski se slažu, SNG, za slike recimo (ne galerija već ove thumbs u textu)

@media (max-width:480px) {
	.itemImgs, .itemImgs h3 {
		width:100%;
		text-align:center;
	}
	.itemImgs a {
		width:224px; -* real width, ako je još border, daj box-sizing model da bude lakše *-
		display:inline-block;
		margin:5px auto 0;
 		float:none; 
	}
	-* iznimke *-
	.itemTeamer .itemImgs a {
		width:100%;
	}	
}	

------------------------------------------------------------------------------------ */


/* Tablets and phones
------------------------- */
@media (max-width:1020px) {
	img, object, embed, video, iframe { /* not working in IE6, knjiga, stran 50 za Windows */
		max-width:100%;
	}
	.content img { /* fix za IMGs koji imaju dimenzije u HTMLu */
		height:auto!important;
	}	
	.content table.fckTable { /* not working in IE6 */
		max-width:100%;
	}	
	.content .bcmsFckVideo, .content .bcmsFckVideo object, .content .bcmsFckVideo object embed, .content .bcmsFckVideo iframe, .bcmsFckVideoIframe iframe, .itemContent iframe {
/* 		width:100%!important; */
		text-align:center;
	}

	/* RWD YT videos, height goes auto - OVO RADI, SAMO ONDA NE RADI OK natpis ispod slike, pa ga je najbolje sakriti */
	.content .bcmsFckVideo {
		padding-bottom:56.25%; /* 16:9 ratio */ 
		position:relative;
		text-align:left;
		margin-bottom:30px;
	}
	.content .bcmsFckVideo iframe { /* add object and embed if needed */
		position:absolute;
		width:100%;
		height:100%;
		overflow:hidden;
	}
	.content .bcmsFckVideo .bcmsFckVideoDescription {
		display:none;
	}

	.w100In, #bcmsCookieInfo { /* ovisi malo kako imaš u basicu, vidi koje imaš definirane fixnu širinu osnovnu, obično 980px je to 
	iste ove daj i dole, potraži ISTI KAO I GORE!
	*/
		width:92%;
		margin-left:4%;
		margin-right:4%;
	}
	#bcmsCookieInfo {
		padding:20px 0;
	}
/*
	ČEEEEEEEEK!
	
	#bcmsCookieInfo p {
		width:90%;
	}	
*/
	.content, .rcol {
		width:100%;
	}
	div.tblWrapper {
		width:100%;
		overflow:auto;
	}	
}

@media (max-width:930px) {
	#menuRwdH {
		visibility:visible;
	}
/*
	#meniFixed {
		display:none;
	}
*/
	#sctnBck0 .bckImgA {
		top:60px;
	}
}


/* Tablet to desktop
------------------------- */
@media (min-width:768px) and (max-width:980px) {
}


/* Tablet
------------------------- */
@media (max-width:768px) {
	.content {
		width:100%;
	}
	body { /* allow long words to be broken */
		word-wrap:break-word;
	}	
/*
	blockquote {
		width:25%;
		padding:1em;
		word-wrap:break-word;
	}
*/	
}

@media (max-width:700px) {
	.facebookCont {
		width:100%;
		margin:0 0 20px;
		padding:0;
	}
	.addThisCont {
		float:left;
		width:100%;
		text-align:left;
	}
}

@media (max-width:650px) {
	footer .infoCopy {
		margin-bottom:30px;
	}
	footer .utilNav {
		clear:right;
	}
}

@media (max-width:600px) {
	.content { /* 2 do */
		font-size:15px;
		font-size:1.5rem;
	}
}
	

/* iPhone 5
------------------------- */
@media (max-width:568px) {
	.itemContent, .shareBox, .rcol {
		width:100%;
	}
	.item table.tblRwd td, .item table.tblRwd td.tdHalf, .tblGigs td, .tblGigs th {
	   display:block;
	   padding-left:0;
	   padding-right:0;
	   width:100%;
	}	
	.item table.tblRwd td.tdHalf, .tblGigs td.tdGigsDate {
   	padding-bottom:20px;
	}
	.tblGigs td.tdGigsPlace {
   	padding-bottom:45px;
	
}

@media (max-width:550px) {
/*
	#menuRwdH {
		visibility:visible;
	}
*/
	.hmeni, #hmeniTop {
		display:none;
	}
	#introH {
		width:auto;
	}	
	#logo {
		width:350px;
		height:100px;
		background-size:100%;		
	}
	#sctnBck0 .w100In {
		background-position:0 0;
	}
	footer .infoCopy {
		margin-bottom:25px;
		line-height:1.5em;
	}	
	footer .utilNav {
		clear:both;
		margin-bottom:20px;
	}
	footer .utilNav li {
		margin-bottom:10px;
	}
	h1.h1Kat, h2.h2Rght {
		font-size:35px;
	}
	#meniFixed .hmeni ul li {
		margin-left:10px;
	}
	#meniFixed .hmeni a {
		padding:0;
		font-size:10px;
	}		
}	


/* Phones
------------------------- */
@media (max-width:480px) {
/*
	blockquote {
		font-size:1.231em;
	}
*/
	.w100In, #bcmsCookieInfo { /* ISTI KAO I GORE! */
		width:90%;
		margin-left:5%;
		margin-right:5%;
	}
	.itemImgs, .itemTxtImg {
		width:100%;
		margin-left:0;
		margin-right:0;
	}
/*
	.itemImgs figcaption {
		display:inline-block;
	}
*/
	.itemListed .itemImgs {
		margin-bottom:15px;
	}	
	.fckAvtorji img {
		float:none;
		margin-bottom:10px;
	}	
	.itemHalfL, .itemHalfR {
		float:left;
		width:100%;
	}
	#bcmsCookieInfo form {
		background-image:none;
		padding-left:0;
	}	
}


@media (max-width:440px) {
	#logo {
		width:250px;
		height:72px;
	}
}

@media (max-width:400px) {
	.content ul.bcmsPaging li {
		margin-bottom:15px;
	}
   body section.w100 {
   	background-image:none;
   }
   .bckImgA {
   	display:none;
   }	
	body section#sctnBck0 {
/* 		background-image:url(bck/bck_img_0_s.jpg); */
	}   
/*
   body {
   	width:100%;
		min-height:100%;
		position:relative;
		background-repeat:no-repeat;
		background-position:50% 0;
	   -webkit-background-size:100%; 
	   -moz-background-size:100%; 
	   -o-background-size:100%; 
	   background-size:100%; 		
		-webkit-background-size:cover;
		-moz-background-size:cover;
		-o-background-size:cover;
		background-size:cover;
		z-index:1;
		background-attachment:fixed;
		background-image:url(bck/bck_img_0_s.jpg);
   }
*/	
}

/* Phones, portrait
------------------------- */
@media (max-width:320px) {
}


/* hi-res
------------------------- */
@media (-webkit-min-device-pixel-ratio:1.1), 
screen and (min--moz-device-pixel-ratio:1.1) {
}