* {
	margin:0;
	padding:0;
	}

html{
	height:100%;
	}

body {	
		box-sizing: border-box;
		width:100%;	
		height:100%;		
		min-height:100%;
		font-size: 16px;
		letter-spacing: 0.2px;	 
		font-family: 'Open Sans', sans-serif;
		font-weight:300;
		overflow: hidden;				
	}
		
	
				#slideshow {
				  background:#fff;
				  margin: 20px 0 0 0;
				  position: relative;
				  width:100%;
				  height:70px; 								  
				}

				#slideshow > div {
				  position: absolute;
				}	
				
					.img_back_slideshow {            /* div naslovne slike i bloka */
						width:100%;
						min-height:120px;      
						background-repeat: no-repeat;
						background-attachment: fixed;
						background-position: center; 
						background-size:cover; 
					}	

					.text-block-slideshow {
						position: absolute;
						*width:80%;  
						*height:100%;
						bottom: 0;
						right: 0;
						color: white;
						padding:10px 30px;
						opacity: 0.7;		
					}

					.text-block-slideshow h3{
						color:#eee;
						font-size:18px;
						margin:0;
					}
										
										 

						h1, h2, h3, h4, p{
							color:#666;
							text-decoration: none;				
						}

						h5 {
							font-size:16px;
							color:#777;
							font-weight:100;
							margin:8px 0 ;
						}										

						input[type=text]{					
							width: 100%;
							font-size: 16px;					
							padding: 8px 20px;
							*margin: 8px 0;
							border: 1px solid #999;  
							border-radius: 6px;
							box-sizing: border-box;
							*background:#ffff44;
							color:#000080;					
						}	

						input[type=text]:hover {
							-webkit-box-shadow: 0px 0px 5px #005FFF;
							-moz-box-shadow: 0px 0px 5px #005FFF;
							box-shadow: 0px 0px 5px #005FFF;	
							transition: 0.3s ease-in-out; 	 			
						}
								
						input[type=submit] {
							width: 100%; 
							background-color: #008000; 
							font-size:16px;	
							font-weight:800;										
							color:#fff;
							padding:5px 8px;  
							margin: 8px 0;
							border: none;
							border-radius: 5px;
							cursor: pointer;					
						}

						input[type=submit]:hover { 
							*color: #000090;						
							background-color: #00ff00;  
							-webkit-box-shadow: 2px 2px 5px #333;
							-moz-box-shadow: 2px 2px 5px #333;
							box-shadow: 2px 2px 5px #333;	
							transition: 0.8s ease-in-out;					
						}	
						
						textarea{
							width:100%;
						}
						
	
	hr {
		border-top: 1px solid #ddd;
		margin:10px 0;
		color:#ddd;
		background:#eee;
	}
	
	
			#naslov{
				font-family: Dancing Script;
				font-family: Poiret One ;
				font-family: Parisienne ;	
				font-size:40px;
				text-align:center;
				font-weight:100;
				margin-bottom:20px ; 
			}	
			
				@media screen and (max-width: 800px) {
				  #naslov {
					width: 100%;
					font-size:30px;			
					margin-bottom:20px;
				  }
				}

	
	#omotac{
		width:100%;	
		height:93%;
		min-height:90%;
		color:#666;
		overflow: auto;	
	}

		.omotac_1{
			font-family: 'Montserrat', ;
			font-family: 'Open Sans', ;
			font-family: 'Lato', ;	
			width:100%;	
			color:#666;
			padding:20px 3% 10px 3%; 
			overflow: hidden;	
		}	
	
					/* kartica index */	

					.card {
					  float:left;
					  width: 23%;
					  min-height:270px;
					  margin:1%;
					  text-align: center;
					  padding-bottom:10px;
					  box-shadow: 0 0 15px rgba(80, 80, 80, 0.5); 
					  opacity:1;  
					}

					.card h2{
						color:#555;
						font-size:16px;
						font-weight:800;
						margin:2px 5px;
					}

					.card p{
						color:#555;    
						font-size:13px;
						margin:5px;
					}


					.card:hover {	
					  box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
					  opacity:0.6;
					}

					@media screen and (max-width: 800px) {
					  .card{
						width: 98%;
						margin-bottom:20px;
					  }
					}

					.respon_50{
					  float:left;
					  width:46%;
					  margin:10px 1%;
					}	

					@media screen and (max-width: 800px) {
					  .respon_50 {
						width: 94%; 
					  }
					}
				
				.naslov_video { 
				  position:relative;
				  width: 80%; 
				  margin:30px auto;
				  height: auto;
				}  

				
				#sadrzaj_index{
					position: absolute;
					top:0;
					text-align:center;
					width:100%;
					height:99%;
					background: rgba(0, 0, 0, 0.5);	
				}
				

				#tekst_index{
					position:absolute;
					top:15%;
					left:10%;
					background:rgba(255, 250, 15, 0.1);
					width:70%;
					height:45%;
					color:white;
					text-align: center;
					padding:7% 5% ;
					text-decoration: none;
				}	
				#tekst_index h1{				
					font-size:6vw;
					font-weight:900;
					color:rgba(200, 200, 200, 0.4);			
				}
				#tekst_index hr{
					height:10px;
					width:20%;
					margin:30px auto;
					border:none;
					background:rgba(200, 200, 200, 0.3);
				}
				
				@media screen and (max-width: 800px) {	
					.naslov_video { 
					  position:relative;
					  width: 100%; 
					  margin:10px auto;
					  height: auto;
					}
					
					#tekst_index hr{
						height:3px;
						width:20%;
						margin:10px auto;
						border:none;
						background:rgba(200, 200, 200, 0.3);
					}					
				}	
	
	#clanak{
		width:70%; 
		float:left;
		color:#666;
		padding:1%;
		margin-right:1%;
	}
	
	#clanak h6 {
		font-size:14px;
		font-weight:600;
		margin:10px 0 0 15px;
	}	
	
	#clanak span {
		font-size:16px;		
	}
	
	#clanak p {
		font-size:16px;		
	}
	
		@media screen and (max-width: 800px) {
			  #clanak {
				width: 98%; 
				margin:0;
			  }
			  
		      #clanak h6 {
				font-size:12px;
				font-weight:600;
				margin:10px 0 0 15px;
		      }			  
		}

	#drugi_stupac{
		float:left;	 	
		width:25%;
		color:#666;
		border-top:2px	solid #ddd; 
		padding-top:5px;
		margin-top:10px;
	}
	
					@media screen and (max-width: 800px) {
					  #drugi_stupac {
						width: 96%; /* The width is 100%, when the viewport is 800px or smaller */
					  }
					}	
	
	
/*	Članak glavna slika članka */
	
			.container {
				position: relative;
				margin: 0 auto;  
			}
			
			.container_naslov {
				text-decoration: none;		
				color:#666;
				font-size:14pt;
				margin:0;
				padding:10px;
				font-weight:300;    
				vertical-align: middle;	
				background-color: #f9f6fe; 
			}			

			.container img{
				width:100%;
			}
			
			.container .content {
			  position: absolute;
			  top:0;
			  background: rgb(0, 0, 0); /* Fallback color */
			  background: rgba(0, 10, 10, 0.5); /* Black background with 0.5 opacity */
			  color: #ddd;
			  width: 94%;
			  font-size:18px;
			  padding: 10px 3%;
			}
			
			.container .content h1, h2, h3,h4,h5{
				color:#999;
			}				

				.container .content h1{
					font-size:28px;
					color:#fff;
					font-weight:100;
				}

					@media screen and (max-width: 1100px) {
					  .container .content h1{
					   font-size:4vw;
						margin-top:0;
					  }
					}

					

	.sadrzaj{
		padding:10px;
		font-size:14px;
	}

		.sadrzaj table {
		  border-collapse: collapse;
		  width: 100%;
		}

		.sadrzaj td, .sadrzaj th {
		  border: 1px solid #999;
		  padding:10px;
		}

		.sadrzaj tr:hover {background-color: #ddd;}

		.sadrzaj th {
		  padding-top: 12px;
		  padding-bottom: 12px;
		  text-align: left;
		  background-color: #4CAF50;
		  color: white;
		}

	
				/* index okviri u stupcima članci i novosti  */	
	
				div.gallery {                  
					min-height:10px;
					margin:1% 0;
					padding:5px;  
				}

					div.gallery:hover {
						box-shadow: 0 0 10px #ccc;
					}					

					div.gallery img {
						max-width: 100%;						
						height:auto;					
						box-shadow: 8px -2px 13px -8px #aaa;
					}					
					
					div.index_img_clanak {
						float:left;
						max-width: 20%;						
						height:auto;					
						box-shadow: 8px -2px 13px -8px #aaa;
					}										

					div.desc_clanak {       
						float:left;
						max-width: 76%;	
						padding:0 1% 0 3%;
						vertical-align: middle;	
					}

					div.desc_clanak h4{
							text-decoration: none;		
							color:#666;
							font-size:11pt;
							margin:0; 
							font-weight:200;
							vertical-align: middle;	
						}
						
					div.index_img_vijest {
						float:left;
						max-width: 30%;						
						height:auto;
						box-shadow: 8px -2px 13px -8px #aaa;
					}						

					div.desc_vijesti {
						float:left;  
						max-width: 65%;	
						padding:0 1% 0 3%;
						vertical-align: middle;	
						font-size:10pt;
						
					}
					
					
					div.desc_vijesti h4{
							float:left;
							text-decoration: none;		
							font-weight:900;
							color:#666;
							font-size:9pt;
							margin:0; 	
							
						}					
					
					div.desc_vijesti p{
						float:left;
						font-weight:200;
						color:#999;
						font-size:8pt;
					}					
						

					
					
	.footer {	
		font-family: Poiret One;			
		width: 100%;	
		background-color: #fff;
		color: #999;
		text-align: center;
		font-size: 12px;  
		padding:1% 0;
		margin-top:50px;
		box-shadow: 0 -6px 10px #ddd;					
	}

	.footer h2{
		font-size:18px;
		color:#000040;		
	}

	.footer h4{
		font-size:16px;	
		color:#000040;		
	}	
	
	.footer h4 a{
		font-size:20px;			
		color:#000040;
		text-decoration: none;				
	}
	
	.footer h4 a:hover{
		color:red;
		font-weight:800;
		text-decoration: none;		
	}		

		@media screen and (max-width: 800px) {		
			.footer h2{
				font-size:15px;
				color:#000040;		
			}

			.footer h4{
				font-size:12px;	
				color:#000040;		
			}					
		}