@import url('../css/timeline.css');
@import url('../css/menu.css');
@import url('../css/component.css');
@import url('../css/font-awesome.min.css');
@import url('../css/fonts.css');

/*BASIC*/

body {
font-family: Verdana;
color: #a6a6a6;
} 

hr{
border: 0;
color: #33a5ec;
background-color: #33a5ec;
height: 3px;
width: 20%;
}

h3{
text-align: center;
margin-bottom: 40px;
}

img { max-width: 100%; }

/*TOP NAVIGACIJA*/

.logo{
margin-top: 60px;
}

.fsb{
margin-top: 20px;
border-bottom: 1px solid #ccc;
padding: 50px;
}

.fsb div{
overflow: hidden;
}


@media all and (max-width: 995px){
	.fsb div{
	overflow: hidden;
	margin-top: 48px;
	}
	.fsb{
	margin-top: 0;
	}
}
.fsb img{
float: left;
padding-right: 25px;
}

.fsb p{

}

.logo div a{
display: block;
outline: none;
}

.lang{
background-color: #f3f3f3;
height: 35px;
}

.lang span a{
float: right; 
display: block;
padding: 2px;
text-decoration: none;
color: #ccc;
font-size: 12px;
width: 40px;
margin-top: 5px;
}

.lang span a:hover{
color: #969797;
}

.lbord{
border-right: 1px solid #ccc;
margin-right: 10px;
}

.nav{
margin-top: 20px;
}

.font-info{
font-size: 10px;
font-style: italic;
text-transform: lowercase;
}

.two-words li a:after{
color: #fff;
content: "*";
}

.two-words li a:hover:after{
color: #33a5ec;
content: "*";
}

/* SLOGAN */

h2{
font-size:28px;
margin-top: 44px;
text-align: center;
}

.index-p{
text-align: justify;
margin-top: 22px;
}

.intro div h5{
font-size: 18px;
margin-top: 40px;
}

.akreditacija div{
height: 62px;
margin-top: 40px;
margin-bottom: 40px;
}

@media all and (max-width: 995px){
.akreditacija{
margin-top: 30px;
margin-bottom: 20px;
}
.akreditacija div{
height: 62px;
margin-top: 10px;
margin-bottom: 0;
}}

.akreditacija div a{
display: block;
margin: 0 auto;
float: none;
padding: 15px;
text-indent: -9999px;
border: 1px solid #ccc;
outline: none;
}

.HAA{
background: url('../images/haa.png');
background-position: 0px 0px;
width: 315px;
height: 62px;
}

.HAA:hover{
background-position:0px -62px;
background-color: #33a5ec;
}
.FSB{
background: url('../images/FSB_2.png');
background-position: 0px 0px;
width: 320px;
height: 70px;
}

.FSB:hover{
background-position:0px -85px;
background-color: #33a5ec;
}
.HRZZ{
background: url('../images/HRZZ.png');
background-position: 0px 0px;
width: 315px;
height: 70px;
}

.HRZZ:hover{
background-position:0px -70px;
background-color: #33a5ec;
}
.CIPM{
background: url('../images/cipm2.png');
background-position: 0px 0px;
width: 315px;
height: 62px;
}

.CIPM:hover{
background-position:0px -62px;
background-color: #33a5ec;
}

/***** Milo *****/

.proba figure{
position: relative;
float: left;
overflow: hidden;
text-align: center;
margin: 0 auto;
}

.proba figure img {
position: relative;
display: block;
min-height: 100%;
max-width: 100%;
opacity: 0.8;
}

figure.effect-milo{
margin: 0 auto;
float: none;
}

figure.effect-milo img {
max-width: auto;
width: -webkit-calc(100% + 60px);
width: calc(100% + 60px);
opacity: 1;
}

.proba{
margin: 20px 0;
}

/* USLUGE */

.wrap{
background-color: #f1f1f1;
padding-bottom: 60px;
}

.service{
margin-top: 40px;
}

.offer{
text-align: center;
margin: 20px 0;
}

.holder{
background-color: #fff;
width: 99,9%;
padding: 40px 20px;
}

.holder p{
min-height: 180px;
color: #b4b3b3;
font-size: 14px;
line-height: 24px;
}

@media all and (max-width: 1200px){
.holder p{
min-height: 220px;
}}

.holder img{
border-radius: 50%;
border: 2px solid #33a5ec;
padding: 10px;
width: 40%;
}

.service img{
margin-top:20px;
}
.service h3{
margin: 40px 0 20px 0;
}
.service h2{
margin: 60px 0 50px 0;
}

.service p{
margin-bottom: 30px;
}

.service a{
display: block;
text-decoration: none;
border: 1px solid #47aeee;
padding: 10px;
color: #47aeee;
width: 60%;
margin: auto;
}

.service a:hover{
color: #fff;
background-color: #47aeee;
}


/*FOOTER*/
footer p{
font-size: 11px;
text-align: center;
color: #fff;
padding: 28px 0 16px 0;
}

footer{
background-color: #0071b7;
border: 1px solid #0071b7;
}

/*GOOGLE MAPS*/

#google-container {
position: relative;
width: 100%;
height: 500px;
}

#cd-google-map {
position: relative;
}

#cd-zoom-in, #cd-zoom-out {
height: 32px;
width: 32px;
cursor: pointer;
margin-left: 10px;
background-color: rgba(0, 113, 183, 0.9);
background-repeat: no-repeat;
background-size: 32px 64px;
background-image: url("../images/cd-icon-controller.svg");
}
.no-touch #cd-zoom-in:hover, .no-touch #cd-zoom-out:hover {
background-color: #3babf0;
}

#cd-zoom-in {
background-position: 50% 0;
margin-top: 10px;
margin-bottom: 1px;
}

#cd-zoom-out {
background-position: 50% -32px;
}

/*  KONTAKT FORMA */

.mail_ok, .mail_err{
padding: 15px;
margin-bottom: 25px;
color: #fff;
display: block;
}

.mail_ok{
background-color: #33a5ec;
}

.mail_err{
background-color: red;
}
.success, .err_mail{
color: #fff;
font-size: 16px;
}

.error{
color: red;
font-size: 11px;
}

span .err_mail{
background-color: red;
color: #fff;}

.btn{
float:right;
background-color: #33a5ec;
color: #fff;
width: 150px;
border-radius: 0;
}

.btn:hover{
background-color: #0071b7;
}

.form-control{
border-radius: 0;
}

form{
margin-bottom: 60px;
}

.kontakt{
margin-top: 30px;
}

.kontakt-info{
padding-bottom: 40px;
}

.kontakt-info p{
padding-left: 10px;
}

.kontakt-info h4{
padding-left: 10px;
}

.kontakt-info div h4{
margin-top: 30px;
padding: 10px;
color: #fff;
background-color: #33a5ec;
}

.fields{
font-size: 10px;
font-style: italic;
}

.zaglavlje{
background-color: #0071b7;
color: #fff;
}


/* USLUGE */

.usluge-naslov{
margin-top: 50px;
}

.img-info{
text-align: center;
font-size: 12px;
font-style: italic;
display: block;
color: #a6a6a6;
padding-top: 20px;
}

.usluge2{
margin: 0 50px 30px 0;
}

.usluge2 p{
text-align: justify;
}

.usluge h3{
float: left;
}

.img-center{
margin: 0 auto;
display: block;
}

.img-left{
float:left;
margin: 0 20px 10px 0;
width: 150px;
}

.bold-letter{
font-size: 18px;
padding-right: 2px;
font-weight: semi-bold;
}

.bottom-margin{
margin-bottom: 40px;
}

.povijest h3{
margin: 60px 0 0 0;
color: #fff;
background-color: #33a5ec;
padding:30px 15px;
}

/*TABLICA*/

.table-italic{
font-style: italic;
}
.tumac-tablice{
font-size: 11px;
font-style: italic;
}
.tablica{
margin-top: 30px;
}
.table{
	display:table;	/* Defines a Table */
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	border-bottom:2px solid #dddddd;
	color:#8d8d8d;
	margin:10px 0;
}
.table-head{
	 display: table-header-group; /* Defines a table header group */
}
.table-head .column{ /* Column inside the table-head */
	background:#33a5ec;
	color:#fff;
	border-right:1px solid #fff;
	border-bottom:none;
	font-weight: bold;
}
.table-head .column:hover{ /* Column hover inside the table-head */
	background:#bbb;
}
.red{
	display:table-row; /* Defines a table row */
}
.red .column:nth-child(1){ /* First column in a row */
	border-left:1px solid #eeeeee;
}
.red:last-child .column{  /* column in a last row */
	border-bottom:none;
}
.column{
	display:table-cell; /* Defines a table cell */
	padding:10px 20px;
	border-bottom:1px solid #eeeeee;
	border-right:1px solid #eeeeee;
}
.column:hover{
	background:#f9f9f9;
}
/* Responsive table */
@media all and (max-width: 640px){
	.table,
	.red,
	.column,
	.column:before{
	display:block;	/* Converts a table, table row, table column and table column:before into a block element */
	}
	.table,
	.red .column:last-child{
	border-bottom:none;
	}
	.table-head{
	position:absolute;	/* Hides table head but not using display none */
	top:-1000em;
	left:-1000em;
	}
	.red{
	border:2px solid #dddddd;
	margin:20px 0;
	}
	.red .column:nth-child(1){ /* first column of the row */
	border-left:none;
	}
	.red .column:last-child{ /* last column of the row */
	border-right:none;
	}
	.red:last-child .column,
	.column{ /* Column in the last row and column */
	border-bottom:1px solid #eeeeee;
	}
	.column:before{ /* prints the value of data-label attribute before the column data */
	font-weight:bold;
	padding-right:20px;
	font-size:14px;
	content:" "attr(data-label)"";	/* call the attribute value of data-label and adds a string // */
	}
}

/*DJELATNICI*/

.djelatnici{
margin: 40px 0;
}

.djelatnici img{
display: block;
margin: 0 auto;
-webkit-border-radius: 50%; border-radius: 50%; 
width: 100px;
height: 100px;
border: 1px solid #ddd;
}

.djelatnici h4{
color: #0071b7;
text-align: center;
}

.djelatnici span{
color: #a6a6a6;
font-style: italic;
font-size: 12px;
}

/*ISTRAŽIVANJE*/

.justify{
text-align: justify;
}

.istrazivanje ul{
margin: 30px 0;
}

.istrazivanje ul li{
list-style-type: circle;
margin: 20px 0 20px 30px;
}

.istrazivanje-title{
margin: 20px 0;
padding: 16px;
color: #fff;
background-color: #33a5ec;
}

.istrazivanje-title i{
height: 100%;
padding: 0px 20px 30px 0;
display: block;
float: left;
}

.istrazivanje p{
margin: 10px 25px;
}

/*KONZALTING*/

.konzalting-img img, .konzalting-holder img{
margin: 0 auto;
}

.konzalting-holder p{
padding: 20px 100px;
text-align: justify;
font-size: 18px;
line-height: 30px;
}

.blue{
color: #fff;
background-color: #33a5ec;
height: 100%;
overflow: hidden;
}

.blue p{
padding: 0 60px 110px 60px;
text-align: justify;
font-size: 16px;
line-height: 36px;
}

.blue h4{
font-size: 28px;
padding: 110px 20px 20px 20px;
text-decoration: underline;
}

.grey{
background-color: #e6e6e6;
overflow: hidden;
height: 100%;
}

.grey p{
font-size: 14px;
text-align: justify;
margin-top: 30px;
}

.grey .row{
width: 99.9%;
}

.blue .centered{
text-align: center;
}

/*EDUKACIJA*/

.edukacija p{
font-size: 14px;
text-align: justify;
padding: 20px 0;
line-height: 26px;
}

.blue h1{
padding: 40px 0;
text-align: center;
font-style: italic;
}

.cbp-nttrigger p{
font-size: 14px;
font-style: italic;
color: #ccc;
}

.main{
margin-top: 46px;
}

.edukacija h3{
margin: 40px 0 20px 0;
}

.edukacija img{
padding-top: 28px;
width: 100%;
margin: auto 0;
}

.edukacija span{
font-style: italic;
}

.cbp-ntaccordion .no-border{
border: none;
}

.cbp-ntaccordion .top-border{
border-top: 1px solid #ddd;
}

.cbp-ntcontent h4{
margin-bottom: 20px;
border-bottom: 1px solid #ddd;
padding-bottom: 16px;
color: #33a5ec;
}

.edukacija-info div{
text-align: center;
margin-top: 20px;
margin-bottom: 40px;
padding: 20px;
}

.edukacija-info div span{
padding: 10px 20px;
background-color: #fff;
color: #33a5ec;
font-size: 18px;
}

.cbp-ntcontent .row div p{
background-color: #33a5ec;
font-size: 16px;
padding: 14px;
color: #fff;
margin-bottom: 20px;
}

.cbp-ntcontent .row{
border-bottom: 1px solid #ddd;
}

/*RAZVOJ*/

.razvoj-blue{
color: #fff;
background-color: #33a5ec;
}

.razvoj h4{
padding: 60px 0 10px 0;
font-size: 22px;
border-bottom: 1px solid #ddd;
margin-bottom: 40px;
}

.razvoj div p{
padding: 30px 0 60px 0;
}

/*MEDIA QUERIES*/

@media all and (max-width: 990px){
	.proba figure{
		width: 70%;
	}
	.holder {
		width: 70%;
		margin: auto 0;
		display: inline-block;
	}
	footer p{
		padding: 28px 20px 16px 20px;
	}
	.razvoj-img img{
		margin: 30px auto;
	}
		.holder p{
		min-height: 110px;
	}
}

@media all and (max-width: 420px){
	.edukacija-info div{
		margin-top: -5px;
		margin-bottom: 20px;
	}

	.edukacija-info div span{
		display: block;
		margin: 10px auto;
		max-width: 160px;
	}
}


/*VIJESTI*/


.posts-holder{
margin-top: 50px;
}

.post{
margin-top: 40px;
border: 1px solid #fff;
}

.post h1{
text-transform: uppercase;
font-size: 26px;
color: #aaa;
}

.post p{
margin-top: 40px;
}

.datum{
color: #33a5ec;
font-style: italic;

}