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




@media only screen and (min-width: 100px) and (max-width: 299px) {
	  }

@media only screen and (min-width: 300px) and (max-width: 499px) {
	
	 #wrapper {
	background-image: url(../img/bg/bg2.jpg);
	background-repeat:repeat;
	height: 3700px;
	width: 100%;
	left: -10px;
	top: -10px;
	font-family: Oswald, Arial, sans-serif;
	color: #FFF;
  }
  
  
  		#bodycontent {
	padding-top: 7%;
	float: left;
	height: 2000px;
	width: 100%;
	text-align: center;

	
}
  

#firstImage{
	left: auto;
	right: auto;
}
  

  #contact {
	float: left;
	height: auto;
	width: 100%;
	padding-top: 100px;
	font-family: 'Oswald', sans-serif;
	font-size: 3.2vw;
	font-weight: 300;
}



#contact li {
    opacity: .5;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
}

#contact li:hover {
    opacity: 1;
}


  #otrgovini {
	padding-top: 200px;
	float: left;
	height: auto;
	width: 100%;
	font-family: 'Oswald', sans-serif;

}


  #title {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 0 0 40px 0;

}


  #title2 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 200px 0 0 0;

}


  #title3 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 150px 0 10px 0;
	color: #fff;

}


#title3 h1 {
	font-family: 'Oswald', sans-serif;
	font-weight:400;
	font-size: 6vw;
	line-height: 180%;
}

#textTrgovina1 {

	width:60vw;
	margin-right: auto;
	margin-left: auto;
	color: #FFF;
	padding: 20px;
	
	}
#textTrgovina1 p{
	font-size: 4vw;
	font-weight: 300;	
}
	
	
	h1{
		font-family: 'Oswald', sans-serif;
		font-size: 7vw;
		text-align: center;
}


  #filatelija {
	float: left;
	height: auto;
	width: 100%;
}

	#logo1 {
	
	 
   

}



/*svg {
    position: fixed;
    top: 0;
    left: 0;
	height: 350px;
	width: 800px;


	/*display: none;*/

	/*}
	
	
	
	
	/* ********************** ICONS ********************* */


	#threeicons {
		width: 100%;
		height: auto;
		float: left;
		padding: 20px;
		text-align: left;
		

}

#threeicons h3{
		font-family: 'Oswald', sans-serif;
		font-size: 5vw;
		text-align: center;
		font-weight: 400;
		line-height: 80%;
		right: clear;
		color: #Ff0;
}

#threeicons p{
		font-family: 'Oswald', sans-serif;
		font-size: 3.2vw;
		text-align: center;
		line-height: 50%;
}


#threeicons ol{
		font-family: 'Oswald', sans-serif;
		font-size: 3.2vw;
		text-align: center;
		line-height: 50%;
		padding: 0 0 -300px 0;
}


	#thefirst {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height:560px;
		float: left;
		padding: 50px 0 0 0;
		

}

#thefirst img{
	width: 40vw;
	height: 40vw;
	float: left;
	padding: 0 15vw 0 15vw;
	
}





#thefirsttext{
		width: 60vw;
		height: 13.5vw;
		float: left;
		padding: 0 5vw 0 5vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		
}







	#thesecond {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 300px;
		float: left;
		padding: 50px 0 0 0;
}

#thesecond img{
	width: 40vw;
	height: 40vw;
	float: left;
	padding: 0 15vw 0 15vw;
	
}




#thesecondtext{
		width: 60vw;
		height: 13.5vw;
		float: left;
		padding: 0 5vw 0 5vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		

}

#thesecondtext p{
			line-height: 180%;
}

	#thethird {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 300px;
		float: left;
		padding: 50px 0 0 0;
}

#thethird img{
	width: 40vw;
	height: 40vw;
	float: left;
	padding: 0 15vw 0 15vw;
	
}




#thethirdtext{
		width: 60vw;
		height: 13.5vw;
		float: left;
		padding: 0 5vw 0 5vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
	
	

}

#thethirdtext p{
			line-height: 180%;
}



#thethirdtext a:link {
	color: #FF0;
}

#theline{
	width:60%;
	height:1px;
	background-color: #fff;
	margin: 20px;
	float: left;
	margin: 15% 20% 10px 20%;

}
	
	
	
	#oib{
	float: left;
	width: 90%;
	height: auto;
	margin-top: 100px;
	margin-bottom:100px;
	padding: 5% 5% 5% 5%;
	background-color: black;
	font-size: 3vw;
}
	
	
	#novosti{
		widht: 100%;
	color: white;
	font-size: 5vw;
	padding-top: 200px;
	text-align: left;
}

#novosti h1{
	font-size: 6vw;
	color: white;
}
#novosti p{
	color: white;
	font-size:5vw;
}

	
	
	
	
	
	
	
	
	}

	
	  

@media only screen and (min-width: 500px) and (max-width: 799px) {
	


	 #wrapper {
	background-image: url(../img/bg/bg2.jpg);
	background-repeat:repeat;
	height: 3700px;
	width: 100%;
	left: -10px;
	top: -10px;
	font-family: Oswald, Arial, sans-serif;
	color: #FFF;
  }
  
  
  		#bodycontent {
	padding-top: 7%;
	float: left;
	height: 3300px;
	width: 100%;
	text-align: center;
	

	
}
  

#firstImage{
	left: auto;
	right: auto;
}
  

  #contact {
	float: left;
	height: auto;
	width: 100%;
	padding-top: 100px;
	font-family: 'Oswald', sans-serif;
font-size: 14pt;
	font-weight: 300;
}



#contact li {
    opacity: .5;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
}

#contact li:hover {
    opacity: 1;
}


  #otrgovini {
	padding-top: 200px;
	float: left;
	height: auto;
	width: 100%;
	font-family: 'Oswald', sans-serif;

}


  #title {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 0 0 40px 0;

}


  #title2 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 200px 0 0 0;

}


  #title3 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 150px 0 10px 0;
	color: #fff;

}


#title3 h1 {
	font-family: 'Oswald', sans-serif;
	font-weight:400;
	font-size: 5vw;
	line-height: 120%;
}

#textTrgovina1 {

	width:60vw;
	margin-right: auto;
	margin-left: auto;
	color: #FFF;
	padding: 20px;
	
	}
#textTrgovina1 p{
	font-size: 3vw;
	font-weight: 300;	
}
	
	
	h1{
		font-family: 'Oswald', sans-serif;
		font-size: 5vw;
		text-align: center;
}


  #filatelija {
	float: left;
	height: auto;
	width: 100%;
}

	#logo1 {
	
	 
   

}



/*svg {
    position: fixed;
    top: 0;
    left: 0;
	height: 350px;
	width: 800px;

	/*display: none;*/

/*	}
	
	
	
	
	
	
	/* ********************** ICONS ********************* */


	#threeicons {
		width: 100%;
		height: auto;
		float: left;
		padding: 20px;
		text-align: left;

}

#threeicons h3{
		font-family: 'Oswald', sans-serif;
		font-size: 2.5vw;
		text-align: center;
		font-weight: 400;
		line-height: 80%;
		right: clear;
		color: #Ff0;
}

#threeicons p{
		font-family: 'Oswald', sans-serif;
		font-size: 2.3vw;
		text-align: center;
		line-height: 50%;
}


#threeicons ol{
		font-family: 'Oswald', sans-serif;
		font-size: 2.3vw;
		text-align: center;
		line-height: 50%;
		padding: 0 0 -300px 0;
}


	#thefirst {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height:560px;
		float: left;
		padding: 50px 0 0 0;
		

}

#thefirst img{
	width: 25vw;
	height: 25vw;
	float: left;
	padding: 0 25vw 0 25vw;
	
}








#thefirsttext{
		width: 55vw;
		height: 13.5vw;
		float: left;
		padding: 0 10vw 0 10vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		
}







	#thesecond {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 300px;
		float: left;
		padding: 50px 0 0 0;
}

#thesecond img{
	width: 25vw;
	height: 25vw;
	float: left;
	padding: 0 25vw 0 25vw;
	
}




#thesecondtext{
		width: 55vw;
		height: 13.5vw;
		float: left;
		padding: 0 10vw 0 10vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		

}

#thesecondtext p{
			line-height: 180%;
}

	#thethird {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 300px;
		float: left;
		padding: 50px 0 0 0;
}

#thethird img{
	width: 25vw;
	height: 25vw;
	float: left;
	padding: 0 25vw 0 25vw;
	
}




#thethirdtext{
		width: 55vw;
		height: 13.5vw;
		float: left;
		padding: 0 10vw 0 10vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
	
	

}

#thethirdtext p{
			line-height: 180%;
}



#thethirdtext a:link {
	color: #FF0;
}

#theline{
	width:50%;
	height:1px;
	background-color: #fff;
	margin: 20px;
	float: left;
	margin: 20px 25% 10px 25%;

}
	
	
	
	
	



#oib{
	float: left;
	width: 90%;
	height: 100px;
	margin-top: 300px;
	margin-bottom:100px;
	padding: 5% 5% 5% 5%;
	background-color: black;
}
	
	
	#novosti{
	color: white;
	font-size: 3vw;
	padding-top: 200px;
	text-align: left;
}

#novosti h1{
	font-size: 4vw;
	color: white;
}
#novosti p{
	color: white;
	font-size:3vw;
}





	
	
	
	}



@media only screen and (min-width: 800px) and (max-width: 1000px) {
	



 #wrapper {

	background-image: url(../img/bg/bg2.jpg);
	background-repeat:repeat;
	height: 3700px;
	width: 100%;
	left: -10px;
	top: -10px;
	font-family: Oswald, Arial, sans-serif;
	color: #FFF;
  }
  
  
  		#bodycontent {
	padding-top: 7%;
	float: left;
	height: 1000px;
	width: 100%;
	text-align: center;

	
}
  

#firstImage{
	left: auto;
	right: auto;
}
  

  #contact {
	float: left;
	height: auto;
	width: 100%;
	padding-top: 100px;
	font-family: 'Oswald', sans-serif;
font-size: 14pt;
	font-weight: 300;
}



#contact li {
    opacity: .5;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
}

#contact li:hover {
    opacity: 1;
}


  #otrgovini {
	padding-top: 200px;
	float: left;
	height: auto;
	width: 100%;
	font-family: 'Oswald', sans-serif;

}


  #title {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 0 0 40px 0;

}


  #title2 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 200px 0 0 0;

}


  #title3 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 150px 0 10px 0;
	color: #fff;

}


#title3 h1 {
	font-family: 'Oswald', sans-serif;
	font-weight:400;
	font-size: 4vw;
	line-height: 120%;
}

#textTrgovina1 {

	width: 600px;
	margin-right: auto;
	margin-left: auto;
	color: #FFF;
	padding: 20px;
	
	}
#textTrgovina1 p{
	font-size: 14pt;
	font-weight: 300;	
}
	
	
	h1{
		font-family: 'Oswald', sans-serif;
		font-size: 4vw;
		text-align: center;
		
}


  #filatelija {
	float: left;
	height: auto;
	width: 100%;
}

	#logo1 {
	
	 
   

}

<object type="image/svg+xml" id="logo">
     width: 100%;
</object>


svg {
    position: fixed;
    top: 0;
    left: 0;
	width: 100%;

	/*display: none;*/

}



/* ********************** ICONS ********************* */


	#threeicons {
		width: 100%;
		height: auto;
		float: left;
		padding: 20px;
		text-align: left;

}

#threeicons h3{
		font-family: 'Oswald', sans-serif;
		font-size: 3vw;
		text-align: center;
		font-weight: 400;
		line-height: 80%;
		right: clear;
		color: #Ff0;
}

#threeicons p{
		font-family: 'Oswald', sans-serif;
		font-size: 2vw;
		text-align: center;
		line-height: 50%;
}


#threeicons ol{
		font-family: 'Oswald', sans-serif;
		font-size: 2vw;
		text-align: center;
		line-height: 50%;
		padding: 0 0 -300px 0;
}


	#thefirst {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height:600px;
		float: left;
		padding: 50px 0 0 0;
		

}

#thefirst img{
	width: 25vw;
	height: 25vw;
	float: left;
	padding: 0 25vw 0 25vw;
	
}








#thefirsttext{
		width: 55vw;
		height: 13.5vw;
		float: left;
		padding: 0 10vw 0 10vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		
}







	#thesecond {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 300px;
		float: left;
		padding: 50px 0 0 0;
}

#thesecond img{
	width: 25vw;
	height: 25vw;
	float: left;
	padding: 0 25vw 0 25vw;
	
}




#thesecondtext{
		width: 55vw;
		height: 13.5vw;
		float: left;
		padding: 0 10vw 0 10vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		

}

#thesecondtext p{
			line-height: 180%;
}

	#thethird {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 300px;
		float: left;
		padding: 50px 0 0 0;
}

#thethird img{
	width: 25vw;
	height: 25vw;
	float: left;
	padding: 0 25vw 0 25vw;
	
}




#thethirdtext{
		width: 55vw;
		height: 13.5vw;
		float: left;
		padding: 0 10vw 0 10vw;
		text-align: center;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
	
	

}

#thethirdtext p{
			line-height: 180%;
}



#thethirdtext a:link {
	color: #FF0;
}

#theline{
	width:50%;
	height:1px;
	background-color: #fff;
	margin: 20px;
	float: left;
	margin: 100px 25% 10px 25%;

}

#oib{
	float: left;
	width: 100%;
	height: 50px;
	margin-top: 100px;
	margin-bottom:100px;
	padding: 20px 0 20px 0;
	background-color: black;
}

#novosti{
	color: white;
	font-size: 2vw;
	padding-top: 200px;
}

#novosti h1{
	font-size: 2.5vw;
	color: white;
}
#novosti p{
	color: white;
	font-size: 2vw;
}



	 }

@media only screen and (min-width: 1001px) and (max-width: 2000px) {
	
	svg {
    position: fixed;
    top: 0;
    left: 0;
	height: 800px;
	width: 800px;
	top: 15%;
	/*display: none;*/

}
	
	  #wrapper {

	background-image: url(../img/bg/bg2.jpg);
	background-repeat:repeat;
	height:3300px;
	width: 100%;
	left: -10px;
	top: -10px;
	font-family: Oswald, Arial, sans-serif;
	color: #FFF;
  }
  
  
  		#bodycontent {
	padding-top: 7%;
	float: left;
	height:1000px;
	width: 100%;
	text-align: center;

}



  #contact {
	float: left;
	height: auto;
	width: 100%;
	padding-top: 100px;
	font-family: 'Oswald', sans-serif;
font-size: 14pt;
	font-weight: 300;
}



#contact li {
    opacity: .5;
    transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
}

#contact li:hover {
    opacity: 1;
}


  #otrgovini {
	padding-top: 200px;
	float: left;
	height: auto;
	width: 100%;
	font-family: 'Oswald', sans-serif;

}


  #title {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 0 0 40px 0;

}


  #title2 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 200px 0 0 0;

}


  #title3 {
	float: left;
	height: 50px;
	width: 100%;
	font-family: 'Oswald', sans-serif;
	background-image: url(../img/bg/orange80op.png);
	padding: 0 0 10px 0;
	margin: 150px 0 10px 0;
	color: #fff;

}
#title3 h1 {
	font-family: 'Oswald', sans-serif;
	font-weight:400;
	font-size: 3vw;
	line-height: 100%;
}


#textTrgovina1 {

	width: 600px;
	margin-right: auto;
	margin-left: auto;
	color: #FFF;
	padding: 20px;
	
	}
#textTrgovina1 p{
	font-size: 14pt;
	font-weight: 300;	
}
	
	
	h1{
		font-family: 'Oswald', sans-serif;
		font-size: 2.5vw;
		text-align: center;
}


  #filatelija {
	float: left;
	height: auto;
	width: 100%;
}

	



	#logo1 {
		


	 
   

}















/* ********************** ICONS ********************* */


	#threeicons {
		width: 100%;
		height: auto;
		float: left;
		padding: 20px;
		text-align: left;

}

#threeicons h3{
		font-family: 'Oswald', sans-serif;
		font-size: 1.3vw;
		text-align: left;
		font-weight: 400;
		line-height: 80%;
		right: clear;
		color: #Ff0;
}

#threeicons p{
		font-family: 'Oswald', sans-serif;
		font-size: 1vw;
		text-align: left;
		line-height: 50%;
}


#threeicons ol{
		font-family: 'Oswald', sans-serif;
		font-size: 1vw;
		text-align: left;
		line-height: 50%;
		padding: 0 0 -300px 0;
}


	#thefirst {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 250px;
		float: left;
		padding: 50px 0 0 0;
		

}

#thefirst img{
	width: 16vw;
	height: 16vw;
	float: left;
}








#thefirsttext{
		width: 35vw;
		height: 13.5vw;
		float: left;
		padding: 20px;
		text-align: left;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
		-webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}







	#thesecond {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 250px;
		float: left;
		padding: 50px 0 0 0;

}

#thesecond img{
	width: 16vw;
	height: 16vw;
	float: left;
}




#thesecondtext{
		width: 35vw;
		height: 13.5vw;
		float: left;
		padding: 20px;
		text-align: left;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		

}

#thesecondtext p{
			line-height: 180%;
}

	#thethird {
		width: 100%;
		margin: 0 auto 0 auto;
		left: 10%;
		right: 10%;
		position: relative;
		height: 250px;
		float: left;
		padding: 50px 0 0 0;

}

#thethird img{
	width: 16vw;
	height: 16vw;
	float: left;
}




#thethirdtext{
		width: 35vw;
		height: 13.5vw;
		float: left;
		padding: 20px;
		text-align: left;
		font-family: 'Oswald', sans-serif;
		font-size: 8pt;
		font-weight: 300;
		line-height: 80%;
	
	

}

#thethirdtext p{
			line-height: 180%;
}



#thethirdtext a:link {
	color: #FF0;
}

#theline{
	width:auto;
	height:1px;
	background-color: #fff;
	display: none;
}

#oib{
	float: left;
	width: 100%;
	height: 50px;
	margin-top: 300px;
	margin-bottom:100px;
	padding: 20px 0 20px 0;
	background-color: black;
}

#novosti{
	color: white;
	font-size: 1.5vw;
	padding-top: 200px;
}

#novosti h1{
	font-size: 2vw;
	color: white;
}
#novosti p{
	color: white;
	font-size: 1.5vw;
}
	  }