*{padding: 0; margin: 0;}

body{
	font-family: 'Open Sans', sans-serif;
	background-color:#8310A2;
	width: 100%;
}
span{
	color: white;
}

.s1{color:black;}

main{
	width: 80%;
	margin: 0 auto;
	min-width: 600px;
}
main h1:nth-child(1){
	width: 10%;
	float: left;
	margin: 3% auto;
}
main nav{
	width: 50%;
	float: right;
	margin: 3% auto;
}
nav ul{
	width: 100%;
}
nav ul li{
	list-style-type: none;
	float: left;
	width: 20%;
}
nav ul li a:link, nav ul li a:visited{
	display: inline-block;
	text-decoration: none;
	text-align: center;
	width: 100%;
	padding: 10% 0;
	font-size: 15px;
	color: white;
}
nav ul li a:hover, nav ul li a:active{
	border-bottom: thin solid #FFF;
}
main header{
	clear: both;
	width: 100%;
	position: relative;
	background-image: url(../images/merlinka.jpeg);
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20% 0;
}




main h1:nth-child(4){
	width: 50%;
	margin: 5% auto;
	text-align: center;
}

main article{
	width: 23.5%;
	float: left;
	margin-bottom: 5%;
	background-color: rgb(226, 226, 226);
}
main article:nth-child(6), main article:nth-child(7), main article:nth-child(8), main img:nth-child(12), main img:nth-child(13), main img:nth-child(14){
	margin-left: 2%;
}
main article:nth-child(5) img{
	width: 29.5%;
}
main article:nth-child(7) img{
	width: 27%;
}
main article:nth-child(8) img{
	width: 29%;
}
article h3{
	width: 80%;
	padding: 2% 5%;
	text-align: center;
	margin: 0 auto;
}
article p{
	padding: 3% 0;
	width: 90%;
	margin: 0 auto;
	text-align: center;
	line-height: 150%;
}
article img{
	width: 30%;
	margin-left: 35%;
	padding: 2% 0;
}
article a:link, article a:visited{
	width: 90%;
	text-align: center;
	display: block;
	color: white;
	text-decoration: none;
	background-color: rgb(104, 164, 196);
	padding: 4% 5%;
}
article a:hover, article a:active{
	background-color: rgb(158, 197, 218);
}

main hr{
	clear: both;
	height: 1px;
	background-color: rgb(104, 164, 196);
	width: 100%;
	margin:  5% auto;
}

	
main > h3{
	padding-bottom: 3%;
}
main > img{
	width: 23.5%;
	float: left;
	padding-bottom: 5%;
}
iframe{
	width: 100%;
	margin: 0 auto;
}

p { text-align:justify;
    margin-right: 140px;
    margin-left: 140px;}

.p1 { align:center; text-align:justify;
    margin-right: 140px;
    margin-left: 140px;
    color: white

}

#mreze {
	alignment-adjust:middle;
	
}



@media screen and (max-width: 1250px){
	body{
		width: 100%;
	}
	main{
		width: 90%;
		min-width: 0;
		margin: 0 auto;
	}
	main h1:nth-child(1){
		width: 100%;
		margin: 2% auto;
		text-align: center;
	}
	main nav{
		width: 100%;
	}
	nav ul{
		width: 100%;
		padding: 0;
		margin: 0;
	}
	nav ul li{
		width: 20%;
		float: left;
		list-style-type: none;
	}
	nav ul li a:link, nav ul li a:visited{
		display: inline-block;
		padding: 3% 20%;
		text-align: center;
		width: 60%;
	}
	nav ul li a:hover, nav ul li a:active{
		border: thin solid rgb(104, 164, 196);
	}
	#divUnutarHeadera a:link, #divUnutarHeadera a:visited{
		width: 80%;
		padding: 2% 10%;
	}
	#divUnutarHeadera p{
		font-size: 8px;
	}
	#divUnutarHeadera h2{
		font-size: 80%;
	}
	main h1:nth-child(4){
		width: 100%;
		margin: 5% auto;
		text-align: center;
	}

	main > article,main > img{
		width: 100%;
	}
	.p1 {text-align:left;margin-left: 0px; margin-right: 0px; padding: 0px 30px;}
}