* {
	margin: 0px;
	padding: 0px;
}

html {
	scroll-behavior: smooth;
}

body {
	background-color: #25274d;
	min-height: 100vh;
}

/* -----------CSS NAV BARA----------- */
.hederMeni {
	width: 100%;
	height: 100px;
	background: #aaabb8;
	position: fixed;
	z-index: 100;
}

.hederMeni p {
	font-family: 'Roboto Slab', serif;
	font-style: italic;
	color: #29648a;
	font-size: 24px;
	line-height: 55px;
	float: left;
	padding: 5px 100px;
}

.hederMeni p img {
	width: 200px;
}

.hederMeni .meni {
	float: left;
}

.hederMeni .meni li {
	float: left;
	list-style: none;
	position: relative;
}

.pocetna{
	margin-left: 50px;
}

.hederMeni .meni li a {
	display: block;
	font-family: 'Raleway', sans-serif;
	color: #29648a;
	font-size: 13px;
	padding: 45px 30px;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: 700;
	letter-spacing: 2px;
}

.hederMeni .meni li a:hover{
	color: #25274d;	
	text-decoration: none;
}

.hederMeni .meni li ul {
	display: none;
	position: absolute; 	
	background-color: #fdfdff;
	padding: 5px;
	border-radius: 0px 0px 4px 4px;
}

.hederMeni .meni li:hover ul {
	display: block;
}

.hederMeni .meni li ul li {
	width: 250px; /*bilo 130*/
	border-radius: 4px;
}

.hederMeni .meni li ul li a {
	padding: 8px 14px;
}

.hederMeni .meni li ul li a:hover {
	background-color:#F8F8F8;
}

.hederMeni .meni li img {
	width: 80px;
	display: none;
}

.sadrzaj {
	padding-top:70px;
}

.jumbotron {
	height: 500px;
	padding-top: 200px;
	background-color: #29648a;
	color:white;
	margin-left: -500px;
	margin-bottom: -0px;
}

.jumbotron .levo {
	float:left;
	margin-right: 150px;
}

.jumbotron .desno {
	float:left;
	margin-right: -600px;
	margin-top: -130px;
} 

.jumbotron img {
	width: 700px;
}

.content {
	margin: 0px 200px;
}

.content .prvi {
	margin-bottom: 100px;
}

.content .prvi .prvi_paragraf {
	float: left;
	color: white;
	width: 700px;
	margin-right: 300px;
	padding: 200px 10px 10px 10px; 
	text-align: justify;
	font-size: 20px;
}

.content .prvi img {
	margin-top: 50px;
	height: 600px;
}

.content .drugi {
	margin-bottom: 400px;
}

.content .drugi img {
	float: left;
	width: 500px;
}

.content .drugi .drugi_paragraf {
	float: left;
	color: white;
	width: 700px;
	margin-left: 300px;
	padding: 30px 10px 10px 10px; 
	text-align: justify;
	font-size: 20px;
}

.content .treci img {
	float: left;
	width: 500px;
}

.content .treci .treci_paragraf {
	float: left;
	color: white;
	width: 700px;
	margin-left: 300px;
	padding: 50px 10px 10px 10px; 
	text-align: justify;
	font-size: 20px;
}

.content .treci {
	margin-bottom: 800px;
}

.content .cetvrti {
	clear: left;
}

.content .cetvrti h1 {
	color: white;
}


.content .cetvrti .lista_leva {
	color: white;
	font-size: 20px;
	margin-right: 150px;
	list-style-position: inside;
	float:left;
}

.content .cetvrti .lista_desno {
	float:left;
	color: white;
	font-size: 20px;
	list-style-position: inside;
	float:left;
}

.content .cetvrti {
	margin-bottom: 500px;
}

.container1{
	/*background:linear-gradient(45deg,  #29648a, #aaabb8);*/
	padding:15px 15%;
	padding-bottom: 100px;
}

.container1 .heading{
	text-align: center;
	padding-bottom: 15px;
	color:#fff;
	text-shadow: 0 5px 10px rgba(0,0,0,.2);
	font-size: 40px;
}

.container1 .box-container{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
	gap:20px;
}

.container1 .box-container .box{
	box-shadow: 0 5px 10px rgba(0,0,0,.2);
	border-radius: 5px;
	background: #464866;
	text-align: center;
	padding: 30px 20px;
}

.container1 .box-container .box img{
	height: 80px;
}

.container1 .box-container .box h3{
	color: #fff;
	font-size: 22px;
	padding: 10px 0;
}

.container1 .box-container .box p{
	color: #A9A9A9;
	font-size: 15px;
	line-height: 1.8;
}

.container1 .box-container .box .btn{
	margin-top: 10px;
	display: inline-block;
	background:#333;
	color:#fff;
	font-size: 17px;
	border-radius: 5px;
	padding: 8px 25px;
}

.container1 .box-container .box .btn:hover{
	letter-spacing: 1px;
}

.container1 .box-container .box:hover{
	box-shadow: 0 10px 15px rgba(0,0,0,.3);
	transform: scale(1.03);
}

@media (max-width:768px){
	.container{
		padding:20px;
	}
}

.row {
	margin-bottom: 50px;
}

.row div img {
	margin-top: 50px;
}


footer {
	/*position: fixed;*/
	padding: 60px 0px;
	width: 100%;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 1rem;
	text-align: center;
	background-color: #393d3f;
	padding: 30px 0px 60px 0px;
}

footer p{
	padding:0;
	font-size: 0.8em;
	color: hsla(0, 50%, 100%, 0.35);
	margin: 1em 0;
	font-size: 1rem;
}
footer ul{
	list-style: none;
	display: flex;
	margin: 1em 0; 
}
footer ul li a{
	padding: 1em; 
	text-decoration: none;
	color: rgba(255, 255, 255, 0.904);
	transition: 100ms;
}
footer ul li a:hover{
	color: var(--primary);
}

footer{
	width: 100%;
	background: #180041;
	color: #fff; 
	display: grid;
	place-items: center;
	padding: 2em; 
	font-size: 1.2rem;
}

footer ul li a:hover {
	color: #89CFF0;
}

.sticky-footer{
	position: sticky;
	top: 100%;
}

@media screen and (max-width: 768px){
	.hederMeni {
		width: 100%;
		height: 100px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
	}

	.hederMeni p {
		font-family: 'Roboto Slab', serif;
		font-style: italic;
		color: #29648a;
		font-size: 10px;
		line-height: 55px;
		float: left;
		padding: 20px 20px;
	}

	.hederMeni p img {
		width: 100px;
		margin-right: -20px;
	}

	.hederMeni .meni {
		float: left;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 50px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		/*color: white;*/
		font-size: 8px;
		padding: 50px 5px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}


	.hederMeni .meni li:hover ul {
		display: block;
	}

	.hederMeni .meni li img {
		display: none;
	}

	.jumbotron {
		height: 500px;
		padding-top: 250px;
		background-color: #29648a;
		color: white;
		margin-left: 0px;
		margin-bottom: -0px;
	}

	.jumbotron .levo {
		float: none;
		/*margin-right: 10px;
		margin-left: 60px;*/
		margin:auto;
		margin-top: 60px;
	}

	.jumbotron .desno {
		width: 90%;
		float: none;
		margin: auto;
		margin-top: -400px;
	}

	.jumbotron h1 {
		font-size: 30px;
	} 

	.jumbotron img {
		width: 300px;
	}

	.content {
		margin: 0px 10px;
	}

	.content .prvi {
		margin-bottom: 150px;
	}

	.content .prvi .prvi_paragraf {
		float: none;
		color: white;
		margin-right: 0px;
		/*padding: 50px 50px 10px 80px; */
		margin: auto;
		text-align: justify;
		font-size: 20px;
		margin-top: -50px;
		width: 330px;
	}

	.content .prvi img {
		/*margin-top: 50px;
		margin-left: 80px;*/
		display: block;
		margin: auto;
		height: 600px;
		margin-top: 30px;
		width: 250px;
	}

	.content .drugi {
		margin-bottom: 50px;
		margin: auto;
	}

	.content .drugi img {
		float: none;
		width: 250px;
		display: block;
		margin: auto;
	}

	.content .drugi .drugi_paragraf {
		float: none;
		color: white;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		width: 330px;
		margin: auto;
	}

	.content .treci img {
		float: none;
		width: 250px;
		display: block;
		margin: auto;
		margin-top: 30px;
	}

	.content .treci .treci_paragraf {
		float: none;
		color: white;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin:auto;
		width: 330px;
	}

	.content .treci {
		margin-bottom: 70px;
	}

	.content .cetvrti {
		clear: left;
		margin-left: 60px;
	}

	.content .cetvrti h1 {
		color: white;
		font-size: 40px;
	}

	.content .cetvrti .lista_leva {
		color: white;
		font-size: 20px;
		list-style-position: inside;
		float: none;
		width: 90%;
		margin: auto;
		margin-bottom: 50px;
	}

	.content .cetvrti .lista_desno {
		float: none;
		color: white;
		font-size: 20px;
		list-style-position: inside;
		width: 90%;	
		margin: auto;
	}

	.content .cetvrti {
		margin-bottom: 50px;
	}

	.row {
		margin-left: 25px;
		margin-right: 25px;
	}

	.row div img {
		width: 10px;
	}

	.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12,
	.col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
		padding-left: 0px;
		padding-right:0px;
	} 
}

@media screen and (min-width: 769px) and (max-width: 900px){
	.hederMeni {
		width: 100%;
		height: 100px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
	}

	.hederMeni p {
		font-family: 'Roboto Slab', serif;
		font-style: italic;
		color: #29648a;
		font-size: 10px;
		line-height: 55px;
		float: left;
		padding: 20px 30px;
	}

	.hederMeni p img {
		width: 120px;
	}

	.hederMeni .meni {
		float: left;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 50px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		/*color: white;*/
		font-size: 11px;
		padding: 50px 10px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}


	.hederMeni .meni li:hover ul {
		display: block;
	}

	.hederMeni .meni li img {
		display: none;
	}

	.jumbotron {
		height: 500px;
		padding-top: 280px;
		background-color: #29648a;
		color:white;
		margin-left: 0px;
		margin-bottom: -0px;
	}

	.jumbotron .container {
		width: 60%;
		margin: auto;
	}

	.jumbotron .levo {
		float: none;
		/*margin-right: 10px;
		margin-left: 60px;*/
		margin: auto;
		margin-top: 60px;
	}

	.jumbotron .desno {
		float: none;
		margin: auto;
		margin-top: -400px;
	}

	.jumbotron h1 {
		font-size: 30px;
	} 

	.jumbotron img {
		width: 400px;
	}

	.content {
		margin: 0px 10px;
	}

	.content .prvi {
		margin-bottom: 150px;
	}

	.content .prvi .prvi_paragraf {
		float: none;
		color: white;
		width: 500px;
		margin-right: 0px;
		/*padding: 50px 50px 10px 80px; */
		margin: auto;
		text-align: justify;
		font-size: 20px;
		margin-top: -50px;
	}

	.content .prvi img {
		/*margin-top: 50px;
		margin-left: 80px;*/
		display: block;
		margin: auto;
		height: 600px;
		margin-top: 30px;
	}

	.content .drugi {
		margin-bottom: 50px;
		margin: auto;
	}

	.content .drugi img {
		float: none;
		width: 400px;
		display: block;
		margin: auto;
	}

	.content .drugi .drugi_paragraf {
		float: none;
		color: white;
		width: 500px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin: auto;
	}

	.content .treci img {
		float: none;
		width: 400px;
		display: block;
		margin: auto;
		margin-top: 30px;
	}

	.content .treci .treci_paragraf {
		float: none;
		color: white;
		width: 500px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin:auto;
	}

	.content .treci {
		margin-bottom: 70px;
	}

	.content .cetvrti {
		clear: left;
		margin-left: 60px;
	}

	.content .cetvrti h1 {
		color: white;
		font-size: 40px;
	}

	.content .cetvrti .lista_leva {
		color: white;
		font-size: 20px;
		list-style-position: inside;
		float: none;
		width: 90%;
		margin: auto;
		margin-bottom: 50px;
	}

	.content .cetvrti .lista_desno {
		float: none;
		color: white;
		font-size: 20px;
		list-style-position: inside;
		width: 90%;	
		margin: auto;
	}

	.content .cetvrti {
		margin-bottom: 50px;
	}

	.row {
		margin-right: 10px;
		margin-left: 10px;
	}
}

@media screen and (min-width: 901px) and (max-width: 1427px){
	.hederMeni {
		width: 100%;
		height: 100px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
	}

	.hederMeni p {
		font-family: 'Roboto Slab', serif;
		font-style: italic;
		color: #29648a;
		font-size: 10px;
		line-height: 55px;
		float: left;
		padding: 5px 100px;
	}

	.hederMeni p img {
		width: 200px;
	}

	.hederMeni .meni {
		float: left;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 50px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		/*color: white;*/
		font-size: 13px;
		padding: 45px 30px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}


	.hederMeni .meni li:hover ul {
		display: block;
	}

	.hederMeni .meni li img {
		display: none;
	}

	.jumbotron {
		height: 500px;
		padding-top: 150px;
		background-color: #29648a;
		color: white;
		margin: 0px;
	}

	.jumbotron .container {
		width: 80%;
		margin: auto;
	}

	.jumbotron .levo {
		clear: left;
		width: 50%;
		margin-right: 10px;
		margin-left: -50px;
		margin: auto;
	}
/*	.jumbotron .levo h1 {
		font-size: 25px;
	}

	.jumbotron .levo p {
		font-size: 15px;
		}*/

		.jumbotron .desno {
			width: 30%;
			float: left;
			margin: auto;
			margin-left: 50px;
		} 

		.jumbotron img {
			width: 380px;
			margin-top: -60px;
		}	

		.content {
			margin: 0px 10px;
		}

		.content .prvi {
			margin-bottom: 150px;
		}

		.content .prvi .prvi_paragraf {
			float: none;
			color: white;
			width: 600px;
			margin-right: 0px;
			/*padding: 50px 50px 10px 80px; */
			margin: auto;
			text-align: justify;
			font-size: 20px;
			margin-top: -50px;
		}

		.content .prvi img {
		/*margin-top: 50px;
		margin-left: 80px;*/
		display: block;
		margin: auto;
		height: 600px;
		margin-top: 30px;
	}

	.content .drugi {
		margin-bottom: 50px;
		margin: auto;
	}

	.content .drugi img {
		float: none;
		width: 400px;
		display: block;
		margin: auto;
	}

	.content .drugi .drugi_paragraf {
		float: none;
		color: white;
		width: 600px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin: auto;
	}

	.content .treci img {
		float: none;
		width: 400px;
		display: block;
		margin: auto;
		margin-top: 30px;
	}

	.content .treci .treci_paragraf {
		float: none;
		color: white;
		width: 600px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin:auto;
	}

	.content .treci {
		margin-bottom: 70px;
	}

	.content .cetvrti {
		clear: left;
		width: 70%;
		margin: auto;
	}

	.content .cetvrti h1 {
		color: white;
		font-size: 40px;
	}

	.content .cetvrti .lista_leva {
		color: white;
		font-size: 20px;
		list-style-position: inside;
		float: none;
		width: 95%;
		margin: auto;
		margin-bottom: 50px;
	}

	.content .cetvrti .lista_desno {
		float: none;
		color: white;
		font-size: 20px;
		list-style-position: inside;
		width: 95%;	
		margin: auto;
	}

	.content .cetvrti {
		margin-bottom: 50px;
	}

	.container1{
		/*background:linear-gradient(45deg,  #29648a, #aaabb8);*/
		padding:15px 5%;
		padding-bottom: 100px;
	}

	.row {
		margin-left: 10px;
		margin-right: 10px;
	}
}


@media screen and (min-width: 1428px) and (max-width: 1700px){
	.hederMeni {
		width: 100%;
		height: 100px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
	}

	.hederMeni p {
		font-family: 'Roboto Slab', serif;
		font-style: italic;
		color: #29648a;
		font-size: 13px;
		line-height: 55px;
		float: left;
		padding: 5px 100px;
	}

	.hederMeni p img {
		width: 200px;
	}

	.hederMeni .meni {
		float: left;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 50px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		/*color: white;*/
		font-size: 13px;
		padding: 45px 30px;	
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}


	.hederMeni .meni li:hover ul {
		display: block;
	}

	.hederMeni .meni li img {
		display: none;
	}

	.jumbotron {
		height: 500px;
		padding-top: 200px;
		background-color: #29648a;
		color: white;
		margin-left: -100px;
		margin-bottom: -0px;
	}

	.jumbotron .levo {
		float:left;
		margin-right: 100px;
	}

	.jumbotron .desno {
		float: left;
		margin-right: -400px;
		margin-top: -130px;
	} 

	.jumbotron h1 {
		font-size: 30px;
	} 

	.jumbotron img {
		width: 500px;
	}

	.content {
		margin: 0px 0px;
		width: 80%;
		margin: auto;
	}

	.content .prvi {
		display: flex;
		margin-bottom: 150px;
	}

	.content .prvi .prvi_paragraf {
		float: left;
		color: white;
		width: 600px;
		/*padding: 50px 50px 10px 80px; */
		text-align: justify;
		font-size: 20px;
		margin: auto;
		margin-top: -90px;
		margin-right: 30px;
		
	}

	.content .prvi img {
		/*margin-top: 50px;
		margin-left: 80px;*/
		float: left;
		display: block;
		margin: auto;
		height: 600px;
		margin-top: 30px;
		/*margin-left: 30px;*/

	}

	.content .drugi {
		display: flex;
		margin-bottom: 0px;
		margin-bottom: 150px;
	}

	.content .drugi img {
		clear:left;
		width: 450px;
		display: block;
		margin: auto;
		/*margin-right: 100px;*/
	}

	.content .drugi .drugi_paragraf {
		float: left;
		color: white;
		width: 600px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;	
		margin: 0 auto;
	}

	.content .treci {
		display: flex;	/*
		margin-bottom: 0px;*/
		margin-bottom: 100px;
	}
	.content .treci img {
		clear: left;
		width: 500px;
		display: block;
		margin: auto;
		margin-top: 30px;
	}

	.content .treci .treci_paragraf {
		float: left;
		color: white;
		width: 600px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin: auto;
		margin-left: 50px;
	}

	.content .cetvrti {
		clear: left;
		display: flex;
	}

	.content .cetvrti h1 {
		color: white;
		font-size: 40px;
	}

	.content .cetvrti .lista_leva {
		color: white;
		font-size: 20px;
		/*margin-right: 0px;*/
		list-style-position: inside;
		float: left;
		/*width: 50%*/;
		margin: auto;
	}

	.content .cetvrti .lista_desno {
		float: left;
		color: white;
		font-size: 20px;
		list-style-position: inside;
		/*width: 50%;*/
		margin: auto;
		margin-top: 0px;
	}

	.content .cetvrti {
		margin-bottom: 50px;
	}

	.container1{
		/*background:linear-gradient(45deg,  #29648a, #aaabb8);*/
		padding:15px 8%;
		padding-bottom: 100px;
	}
}

@media screen and (min-width: 1701px) {
	.hederMeni {
		width: 100%;
		height: 100px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
	}

	.hederMeni p {
		font-family: 'Roboto Slab', serif;
		font-style: italic;
		color: #29648a;
		font-size: 13px;
		line-height: 55px;
		float: left;
		padding: 5px 100px;
	}

	.hederMeni p img {
		width: 200px;
	}

	.hederMeni .meni {
		float: left;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 50px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		/*color: white;*/
		font-size: 13px;
		padding: 45px 30px;	
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}


	.hederMeni .meni li:hover ul {
		display: block;
	}

	.hederMeni .meni li img {
		display: none;
	}

	.jumbotron {
		height: 500px;
		padding-top: 200px;
		background-color: #29648a;
		color: white;
		margin-left: -100px;
		margin-bottom: -0px;
	}

	.jumbotron .levo {
		float:left;
		margin-right: 100px;
	}

	.jumbotron .desno {
		float: left;
		margin-right: -400px;
		margin-top: -130px;
	} 

	.jumbotron h1 {
		font-size: 30px;
	} 

	.jumbotron img {
		width: 500px;
	}

	.content {
		margin: 0px 0px;
		width: 80%;
		margin: auto;
	}

	.content .prvi {
		display: flex;
		margin-bottom: 150px;
	}

	.content .prvi .prvi_paragraf {
		float: left;
		color: white;
		width: 600px;
		/*padding: 50px 50px 10px 80px; */
		text-align: justify;
		font-size: 20px;
		margin: auto;
		margin-top: -90px;
		margin-right: 30px;
		
	}

	.content .prvi img {
		/*margin-top: 50px;
		margin-left: 80px;*/
		float: left;
		display: block;
		margin: auto;
		height: 600px;
		margin-top: 30px;
		/*margin-left: 30px;*/

	}

	.content .drugi {
		display: flex;
		margin-bottom: 0px;
		margin-bottom: 150px;
	}

	.content .drugi img {
		clear:left;
		width: 450px;
		display: block;
		margin: auto;
		/*margin-right: 100px;*/
	}

	.content .drugi .drugi_paragraf {
		float: left;
		color: white;
		width: 600px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;	
		margin: 0 auto;
	}

	.content .treci {
		display: flex;	/*
		margin-bottom: 0px;*/
		margin-bottom: 100px;
	}
	.content .treci img {
		clear: left;
		width: 500px;
		display: block;
		margin: auto;
		margin-top: 30px;
	}

	.content .treci .treci_paragraf {
		float: left;
		color: white;
		width: 600px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin: auto;
		margin-left: 50px;
	}

	.content .cetvrti {
		clear: left;
		display: flex;
	}

	.content .cetvrti h1 {
		color: white;
		font-size: 40px;
	}

	.content .cetvrti .lista_leva {
		color: white;
		font-size: 20px;
		/*margin-right: 0px;*/
		list-style-position: inside;
		float: left;
		/*width: 50%*/;
		margin: auto;
	}

	.content .cetvrti .lista_desno {
		float: left;
		color: white;
		font-size: 20px;
		list-style-position: inside;
		/*width: 50%;*/
		margin: auto;
		margin-top: 0px;
	}

	.content .cetvrti {
		margin-bottom: 50px;
	}
}

@media screen and (width: 280px){
	.hederMeni {
		width: 100%;
		height: 100px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
	}

	.hederMeni p {
		font-family: 'Roboto Slab', serif;
		font-style: italic;
		color: #29648a;
		font-size: 10px;
		line-height: 55px;
		float: left;
		padding: 20px 20px;
	}

	.hederMeni p img {
		width: 50px;
		margin-right: -30px;
	}

	.hederMeni .meni {
		float: left;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 50px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		/*color: white;*/
		font-size: 7px;
		padding: 50px 5px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}


	.hederMeni .meni li:hover ul {
		display: block;
	}

	.hederMeni .meni li img {
		display: none;
	}

	.jumbotron {
		height: 500px;
		padding-top: 250px;
		background-color: #29648a;
		color: white;
		margin-left: 0px;
		margin-bottom: -0px;
	}

	.jumbotron .levo {
		float: none;
		/*margin-right: 10px;
		margin-left: 60px;*/
		margin:auto;
		margin-top: 60px;
	}

	.jumbotron .desno {
		width: 90%;
		float: none;
		margin: auto;
		margin-top: -400px;
	}

	.jumbotron h1 {
		font-size: 20px;
	} 

	.jumbotron p {
		font-size: 15px;
	} 

	.jumbotron img {
		width: 200px;
	}

	.content {
		margin: 0px 10px;
	}

	.content .prvi {
		margin-bottom: 150px;
	}

	.content .prvi .prvi_paragraf {
		float: none;
		color: white;
		width: 270px;
		margin-right: 0px;
		/*padding: 50px 50px 10px 80px; */
		margin: auto;
		text-align: justify;
		font-size: 20px;
		margin-top: -50px;
	}

	.content .prvi img {
		/*margin-top: 50px;
		margin-left: 80px;*/
		display: block;
		margin: auto;
		height: 600px;
		margin-top: 30px;
	}

	.content .drugi {
		margin-bottom: 50px;
		margin: auto;
	}

	.content .drugi img {
		float: none;
		width: 250px;
		display: block;
		margin: auto;
	}

	.content .drugi .drugi_paragraf {
		float: none;
		color: white;
		width: 200px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin: auto;
	}

	.content .treci img {
		float: none;
		width: 250px;
		display: block;
		margin: auto;
		margin-top: 30px;
	}

	.content .treci .treci_paragraf {
		float: none;
		color: white;
		width: 200px;
		/*margin-left: 0px;
		padding: 50px 50px 10px 80px;*/
		text-align: justify;
		font-size: 20px;
		margin:auto;
	}

	.content .treci {
		margin-bottom: 70px;
	}

	.content .cetvrti {
		clear: left;
		width: 70%;
		margin: auto;
	}

	.content .cetvrti h1 {
		color: white;
		font-size: 40px;
	}

	.content .cetvrti .lista_leva {
		color: white;
		font-size: 20px;
		list-style-position: inside;
		float: none;
		width: 95%;
		margin: auto;
		margin-bottom: 50px;
	}

	.content .cetvrti .lista_desno {
		float: none;
		color: white;
		font-size: 20px;
		list-style-position: inside;
		width: 95%;	
		margin: auto;
	}

	.content .cetvrti {
		margin-bottom: 50px;
	}

	.row {
		margin-left: 25px;
		margin-right: 25px;
	}

	.row div img {
		width: 10px;
	}

	.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12,
	.col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
		padding-left: 0px;
		padding-right:0px;
	} 

	.container1 .heading{
		text-align: center;
		padding-bottom: 15px;
		color:#fff;
		text-shadow: 0 5px 10px rgba(0,0,0,.2);
		font-size: 30px;
	}

	.container1{
		/*background:linear-gradient(45deg,  #29648a, #aaabb8);*/
		padding:15px 2%;
		padding-bottom: 100px;
	}

	.container1 .box-container .box{
		box-shadow: 0 5px 10px rgba(0,0,0,.2);
		border-radius: 5px;
		background: #464866;
		text-align: center;
		padding: 30px 5px;
	}
}

@media screen and (min-width: 768px) and (max-width: 980px){
	.hederMeni {
		width: 100%;
		height: 200px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
		text-align: center;
	}

	.hederMeni .meni {
		float: none;
		width: 50%;
		margin:auto;
	}

	.hederMeni p {
		float: none;
		padding: 0px;
		width: 100%;
		text-align: center;
		
	}

	.hederMeni p img {
		width: 200px;
	}

	.hederMeni .meni li {
		float: left;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin-left: 0px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		color: #29648a;
		font-size: 12px;
		padding: 45px 10px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}
}

@media screen and (min-width: 350px) and (max-width: 767px){
	.hederMeni {
		width: 100%;
		height: 200px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
		text-align: center;
	}

	.sadrzaj {
		padding-top: 170px;
}

	.hederMeni .meni {
		float: none;
		width: 100%;
	}

	.hederMeni p {
		float: none;
		padding: 0px;
		width: 100%;
		text-align: center;
		
	}

	.hederMeni p img {
		width: 200px;
	}

	.hederMeni .meni li {
		float: none;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin:0;
		margin-top: -10px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		color: #29648a;
		font-size: 10px;
		padding: 10px 0px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}
}

@media screen and (max-width: 349px) {
	.hederMeni {
		width: 100%;
		height: 200px;
		background: #aaabb8;
		position: fixed;
		z-index: 100;
		text-align: center;
	}

	.sadrzaj {
		padding-top: 170px;
}

	.hederMeni .meni {
		float: none;
		width: 100%;
	}

	.hederMeni p {
		float: none;
		padding: 0px;
		width: 100%;
		text-align: center;
		
	}

	.hederMeni p img {
		width: 170px;
	}

	.hederMeni .meni li {
		float: none;
		list-style: none;
		position: relative;
	}

	.pocetna{
		margin:0;
		margin-top: -10px;
	}

	.hederMeni .meni li a {
		display: block;
		font-family: 'Raleway', sans-serif;
		color: #29648a;
		font-size: 8px;
		padding: 10px 0px;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		letter-spacing: 2px;
	}

	.hederMeni .meni li a:hover{
		color: #25274d;	
		text-decoration: none;
	}
}

