/* reset paddinga i margina */
*{margin:0; padding:0;}
* {box-sizing:border-box;}


body{background:#fff;
font-family:Calibri, sans-serif;
font-weight:lighter;
font-size:18px;
margin:auto;}

h1, h2, h3, h4, h5, h6{color:#003333;}

a {text-decoration:none; color:#1E9C9C;} /*opcionalne boje 008080 029696*/
nav a{color:#003333;}

a img {border:none;
outline:none;} /* IE - za micanje okvira oko slika koje su linkovi ako ih ima */

img{max-width:100%; height:auto; }

ul {list-style-type: circle;} /* liste */
ul, ol{margin-left:20px;} /* liste */

/* klase */
.container{width:100%; 
max-width:1280px; 
margin:0 auto;
}

.clearfix:after{content:" "; 
display:block; 
clear:both;
visibility:hidden; 
height:0;
font-size:0; 
}

.box{padding:2%;}

.line{border-bottom:1px solid #003333;}

.float{float:left; width:33.3%;}

.boja{color:#003333;} /* za strong elemente */

/* linkovi */
a:hover{color:#00cccc; }

/* header */
#pageHeader{background-color:#003333; padding:1%;
}
#pageHeader h1{color:#fff; text-align:right; }

/* menu */
#mobileButton{text-align:left;
padding:15px 0 0 10px;
display:none; }/* sa display:none skrivamo mobileButton za velike display-e */

#menu{border:1px solid #003333}

#leftMenu ul{text-align:left; }
#leftMenu li{display:inline; list-style-type:none; }
#leftMenu li a {padding:0 10px; }

nav a:hover{color:#fff; 
background-color:#003333;}

.active {color:#fff; 
background-color:#003333;}


/* firstRow */
#podaci{float:left; 
width:67%; }

#profili{float:right; width:33%;}
#profili p{text-align:left;}

#profilna {float:left; 
display:block; 
width:20%; 
margin-right:5%;
}

#podaci div{width:75%;
float:right;
}

/* secondRow */

/* thirdRow */

/* fourthRow */

/* fifthRow */

/* STUDENTI */
.crvena{color:red;}

/* footer */
.logo{padding:20px;}

footer{border:1px solid #003333}

#logo-sveuciliste{max-width:80px;
float:left}

#logo-fer{max-width:55px;
float:right;}

footer p{background-color:#003333; text-align:right; color:#fff; padding:0 1%;}

/*  Media queries  */
@media screen and (max-width:768px) {
	#pageHeader h1{text-align:center;}
	
	#leftMenu{margin:10px 0;}
	#leftMenu ul {text-align:center; font-size:20px;}
		
	footer p{text-align:center; }
}


@media screen and (max-width:480px) {
	body{font-size:14px;}
	#pageHeader h1{font-size:20px;}

	#leftMenu ul{display:none;}	
	#mobileButton{display:block;}
	
	#leftMenu ul a{width:100%; float:right; text-align:center; background:#003333; color:#fff; border-top:1px solid #fff; padding:10px; }
	
	#podaci, #podaci div, #profili, .float {float:none; width:100%;}
	#podaci img{float:none; width:30%; margin:15px auto; }

}