html {margin-top: 0px !important;}

* {
	position: relative; 
	padding: 0px; 
	margin: 0px;
	box-sizing: border-box;
}

.clear {clear: both;}

#toggle {display: none;}



/* font */
@font-face {
    font-family:"Terminal Dosis";
    src: url("TerminalDosis.ttf") /* TTF file for CSS3 browsers */
}
body {
	font-family:'Terminal Dosis';
}

/* klase */
.panel {
	width: 1160px;
	margin: 0 auto;
	position: relative;
	padding: 0 10px;
}
.underline {
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 1px solid #f5f5f5;
}
.underline::after{
	position: absolute;
	content: "";
	background-color: #000;
	height: 3px;
	width: 30px;
	bottom: -1px;
	left: 0;
}	
.more {
	padding: 15px 25px;
	background: #000;
	margin-top: 44px;
	display: inline-block;
	text-decoration: none;
	text-transform: uppercase;
	color: #f2f2f2;
	font-weight: 900;
	font-size: 14px;
	border: 1px solid #000;
	cursor: pointer;
}
	.more:hover {
		background: #d9dae1;
		color: #000;
	}

	
.more-link {
	text-decoration: none;
	color: #999999;
	text-transform: uppercase;
	font-size: 12px;
}	

.align_center {text-align: center;}

/* HEADER */
	.header {
		background-color: #000;
		/* height: 100px; */
		position: relative;
		min-width: 1160px;
	}
		.header .header_top {
			height: 150px; 
		}
			.header .header_top .logo {
				float: left;
				width:30%;	
				padding: 30px 0 0 0;
			}
				.logo h1 a{
					text-decoration: none;
					color: #d9dae1;
					font-size: 42px;
					text-transform: uppercase;
				}
				.logo h1 a span {
					font-size: 18px;
					text-transform: lowercase;
					color: #f5f5f5;
					font-weight: 100;
				}
			
			.header .header_top .header_info{
				float: right;
				width:70%;
				padding: 30px 0 0px 0;
			}
			
			.header .header_top .header_info ul {
				list-style-type: none;
				text-align: right;
			}
				
				.header .header_top .header_info ul li{
					padding-left: 25px;
					cursor: pointer;	
					display: inline-block;
				}
				.header .header_top .header_info ul li:not(:last-child){
					border-right: 1px solid rgba(250, 250, 250, 0.15);
					padding-right: 25px;
				}
				
					.header .header_top .header_info ul li .info .icon {
						display: block;
						float: left;
						margin-right: 20px;
						width: 40px;
						height: 40px;
					}
						.icon1{background-image: url('../images/adresa2.png');}
						.icon2{background-image: url('../images/kontakt2.png');}
						.icon3{background-image: url('../images/radno_vrijeme2.png');}
						
							.icon1:hover{background-image: url('../images/adresa.png');}
							.icon2:hover{background-image: url('../images/kontakt.png');}
							.icon3:hover{background-image: url('../images/radno_vrijeme.png');}
						
					.header .header_top .header_info .info .info_box {
						float: left;
						color: rgb(152, 152, 152);
						font-size: 14px;
					}
						.header .header_top .header_info .info .info_box h4{
							text-transform: uppercase;
							color: #f5f5f5;
							margin-top: 5px;
						}
						.header .header_top .header_info .info .info_box strong {
							text-transform: uppercase;
						}
			
		#main_nav {
			width: 100%;
			z-index: 1000;
		}	
		
		nav.default_nav {
			position: absolute;
			top: 120px;
		}
		/* FIXED NAV class */
		nav.fixed_nav{
			position: fixed;
			top: 0px;
			background-color: #d9dae1;;
		}
		
			nav ul {
				background-color: #d9dae1;
				list-style-type: none;
				text-align: center;
				margin: 0 auto;
			}
				nav ul li {
					display: inline;
				}
				
					nav ul li a {
						text-decoration: none;
						color: #646464;
						text-transform: uppercase;
						font-size: 14px;
						font-weight: 800;
						display: inline-block;
						height: 60px;
						line-height: 56px;
						border-top: 4px solid #d9dae1;
						padding: 0 30px;
						letter-spacing: 1px;
					}
					nav ul li a:hover{
						border-color: #646464;
						color: #000;
					}
					
					nav ul li:not(:last-child) a::before {
						position: absolute;
						content: "";
						width: 1px;
						height: 15px;
						right: 0;
						top: 50%;
						margin-top: -8px;
						background: rgba(0, 0, 0, 0.08);
					}
					
		
/* SLIDER */
	.slider {
		/* height: 430px; */
		width: 100%;
		min-width: 1160px;
	/*	background-image: url('../images/slider_07.jpg'); */
		background-size: cover;
		position: relative;
		z-index: 101;
	}		
		.slider_info {
			display: block;
			position: absolute;
			width: 33.3333%;
			top: 100px;
			height: 200px;
			background-color: rgba(69,69,69,0.9);
			padding: 20px;
			z-index: 500;
		}
			.slider_info h2 a {
				text-decoration: none;
				color: #f7c51e;
				font-size: 32px;
				text-transform: uppercase;
			}
			.slider_info h2 a span{
				font-size: 16px;
				text-transform: lowercase;
				color: #f5f5f5;
				font-weight: 100;
			}
			.slider_info p {
				margin-top: 20px;
				color: #f5f5f5;
			}
			
					/* CLOSE */
					#close {
						position: absolute;
						display: block;
						top: 5px;
						right: 10px;
						cursor: pointer;
						font-weight: 900;
						color: #f5f5f5;
						font-size: 14px;
					}	
					#close:hover {
						color: #999999;
					}
		
/* MIDDLE */
	.middle {
		padding-top: 30px;
		padding-bottom: 30px;
	}
			.three-columns {
				float: left;
				width: 33.3333%;
				padding-right: 30px;		
			}
			
			
			.middle img {border: 1px solid #999999; width: 100%; height: auto;}
			
				.middle .last {padding-right: 0px;}
				
			.middle .three-columns .big_img{
				width: 100%;
			}	
			.middle h2, .middle p {
				margin-top: 10px;
				margin-bottom: 10px;
				color: #333333;
			}
				
				.last_posts li{
					margin-bottom: 15px;
					padding-bottom: 15px;
					border-bottom: 1px solid #ccc;
				}
				.middle .last_posts li:last-child{
					border-bottom: none;
				}
				
				.middle .post .post_img {
					display: block;
					float: left;
					width: 35%;
				}
				.middle .post .text{
					float: right;
					width: 65%;
					padding-left: 20px;
				}
					.middle .post .text h3{
						margin-bottom: 10px;
					}
					.middle .post .text a{
						text-decoration: none;
						color: #333333;
					}
			
	/* TEASER */
		.teaser {
			background-color: rgb(238, 238, 238);
			height: 70px;
			position: relative;
			min-width: 1160px;
		}
		
		#photo {
			padding-left: 20px; 
			padding-right: 20px;
		}
		.photo {
			background: #000;
			padding-top: 20px;
			padding-bottom: 1px;
			position: relative;
			min-width: 1160px;
		}
			
				#photo #least .least-preview img {
					max-width: 700px;
				}
		
		
	/* INFO */
		.info_footer {
			background-image: url(../images/pattern.png);
			background-color: #f2f2f2;
			padding: 30px 0;
			width: 100%;
			min-width: 1160px;
		}	
		
		.info_footer .underline {
			border-bottom: 1px solid #999999;
		}
			.info_footer h4 {
				margin-bottom: 20px;
				font-size: 16px;
				text-transform: uppercase;
				color: #646464;
			}
			.info_footer h6{
				text-decoration: none;
				color: #898989;
				font-size: 36px;
				text-transform: uppercase;
				margin-bottom: 10px;
			}
				.info_footer h6 span {
					font-size: 14px;
					text-transform: lowercase;
					color: #999999;
					font-weight: 100;
				}
				
			.info_footer .djelatnosti {
				list-style-type: circle;
				margin-left: 20px;
				margin-top: 20px;
			}	
				.info_footer .djelatnosti  li {
					margin-bottom: 5px;
				}
			
			
			#googleMap {
				width: 100%;
				height: 200px;
			}
			.address {
				margin-bottom: 20px;
			}
			
		
	/* FOOTER */
		.footer {
			background-color: #000;
			padding: 15px 0;
			font-size: 14px;
			text-align: center;
			width: 100%;
			min-width: 1160px;
			color: #ccc;
		}
		
		
		
		
/* KONTAKT */

			#kontakt {
				padding-top: 30px;
			}
		
		#kontakt #map {
			margin-top: 30px;
			width: 100%;
			height: 500px;
			min-width: 1160px;
		}


			#kontakt form {
				margin-top: 30px;
			}
			
				#kontakt .contact_left {
				float: left;
				width: 50%;
				padding: 10px;
				}	
				#kontakt .contact_right {
					float: right;
					width: 50%;
					padding: 10px;
				}	
					#kontakt form input {
						display: block;
						border: 1px;
						border-style: solid;
						border-color: #ccc;
						width: 100%;
						height: 50px;
						padding-left: 10px; 
						font-size: 16px;
						box-sizing: border-box;
						margin-bottom: 20px;
					}
							#kontakt form input:hover {
								background: #f7c51e;
							}
							#kontakt form input:focus {
								background: #f7c51e;
							}
							
					#kontakt form textarea {
						display: block;
						width: 100%;
						padding: 10px;
						box-sizing: border-box;
						border: 1px;
						border-style: solid;
						border-color: #ccc;
						height: 230px;
						font-size: 16px;
					}
							#kontakt form textarea:hover {
								background: #f7c51e;
							}
							#kontakt form textarea:focus {
								background: #f7c51e;
							}
							
							#kontakt form input.more {
								font-weight: 300;
							}
							#kontakt form input.more:hover {
								background: #e8b60f;
							}

						
					#kontakt .contact_info_box {
						padding: 20px;
						background: #ccc;
						height: 80px;
						margin-bottom: 20px;
					}
					
					#kontakt .more{
						margin-top: 30px;
					}
	
	
/* SINGLE POST */
		#izdvojena_vijest {
			padding-top: 60px;
			padding-bottom: 30px;
		}	
		.nine-columns {
			float: left;
			width: 66.6667%;
		}
		
		#izdvojena_vijest .single_post h4 {
			font-size: 22px;
			text-transform: uppercase;
			margin-bottom: 30px;
		}
			#izdvojena_vijest .single_post h4 em {
				font-size: 14px;
				font-weight: 100;
			}
			
			#izdvojena_vijest .single_post img {
				width: 100%;
				height: auto;
				display: block;
			}
			#izdvojena_vijest .single_post p {
				text-align: justify;
			}
	
	
/* SVI POSTOVI */
		.news {
			padding-top: 60px;
			padding-bottom: 30px;
		}
		
			.news .moj_post {
				display: inline-block;
				width: 50%;
				float: left;
				margin-bottom: 50px;
			}
			.news li.moj_post:nth-child(2n){
				padding-left: 20px;
			}
			.news li.moj_post:nth-child(2n+1){
				padding-right: 30px;
			}
				.moj_post header {
					margin-bottom: 15px;
				}
					.moj_post header h3 {
						font-size: 24px;
						text-transform: uppercase;
					}
					.moj_post header span {
						font-size: 16px;
						text-transform: lowercase;
						font-weight: 100;
					}
					
						.moj_post article img {
							display: block;
							float: left;
							margin-right: 20px;
							width: 30%;
							height: auto;
						}
						.moj_post article p {
							text-align: justify;
						}
				
					.moj_post .more {
						margin-top: 20px;
						padding: 10px 15px;
					}
					.moj_post .underline {
						border-color: #999999;
					}
	
	
	.post {margin-bottom: 15px;}