@charset "utf-8";

@font-face {
font-family:impact ;
src:url(../fonts/impact.ttf);

}
@font-face {
  font-family: Wingdings;
  src: url(../fonts/wingding.ttf);
}

 p, h1, h2, h3, h4, h5, h6 {
font-family: 'Barlow', sans-serif;
 text-decoration: none;
}
p {	font-size: 14px; color: black;}
h1 {font-size: 22px;}
h2 {font-size: 18px;}
h3 {font-size: 16px;}
h4 {font-size: 15px;}
h5 {font-size: 12px;}

:root {
  --crna: #1A1D24;
  --siva: #9999A9;
  --sina: #28A0FC;
  --magenta: #B214A9;
  --teget: #4F52B0;
  --sinozelena: #133C55;
  --svetlozelena: #D9EBEC;
  --temnosina: #1A1B41;
  --pozadina: rgba(76,129,171,0.3);

}

html, body { height:100%; }

body {
	background-image: url(../images/naslovna.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position: center top;
	margin: 0;
	padding: 0;
	overflow-x:hidden; 
	font-family: Verdana, Arial, Tahoma;
	font-size: 11px;
	line-height: 18px;
	color: #000033;
	list-style: none;
	text-align: justify;
	
	
	}


.osnova {
	width: 1040px;
	
	background-position: center;
	margin-right: auto;
	margin-left: auto;
	text-decoration: none;
}

.naslovna {
	height: 30px;
	width: 1040px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 920px;
	background-position: right top;
	border-top-width: medium;
	border-top-style: none;
	border-top-color: #000;
	border-right-color: #FFF;
	border-bottom-color: #000;
	border-left-color: #FFF;
	border-bottom-width: medium;
	border-bottom-style: none;
	padding-top: 7px;
	display: inline-flex;
	
}

header[role="naslovna"]
{
	height: 30px;
	width: 1040px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 920px;
	background-position: center top;
	border-top-width: medium;
	border-top-style: none;
	border-top-color: #000;
	border-right-color: #FFF;
	border-bottom-color: #000;
	border-left-color: #FFF;
	border-bottom-width: medium;
	border-bottom-style: none;
	padding-top: 7px;

}
.zodiak_ikoni {
	clear: none;
	border-right-style: none;
	border-right-width: 0px;
	background-image: none;
	width: 1040px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-bottom: 0px;
	padding-left: 10px;

}

.navigator { 
	
	margin-bottom: 10px; 
	background-color: rgba(0,0,0,0.1); 
	border-top:    1px solid white; 
	border-bottom: 1px solid white; 
}

/**************** MENI*****************/
.group:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; }
*:first-child+html .group { zoom: 1; } /* IE7 */

/* Example Two */
#example-two { 
	margin: 0 auto;
	list-style: none; 
	position: relative; 
	width: 1040px; 
}
#example-two li { 
	display: inline-block; 
}
#example-two li a { 
	position: relative; 
	z-index: 200; 
	color: #bbb; 
	font-size: 14px; 
	display: block; 
	float: left; 
	padding: 6px 21px 4px 0px;
	text-decoration: none;
	text-transform: uppercase; 
}
#example-two li a:hover { 
	color: white; 
}
#example-two #magic-line-two { 
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100px; 
	background: #900; 
	z-index: 100; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.current_page_item_two a { 
	color: white !important; 
}
.ie6 #example-two li, .ie7 #example-two li {
	display: inline;
}




/**************** TELO *****************/


.telo {
	background-color: rgba(255,255,255,0.4);
	width: auto;
	
	
	max-width: 1040px;
	text-decoration: none;
	
	
}


/**************** MENI*****************/
.linkovi_dneven {
	background-color: rgba(255,255,255,0.7);
	width: auto;
	max-width: 1040px;
	height: 210px;
	padding-left: 10px;
	padding-right: 7px;
	padding-bottom: 12px;
	border-bottom-width: thin;
	border-bottom-style: solid;
	border-bottom-color: #3A7096;
	
}
	

#gore {
		
}

#gore ul.nav {
	padding-top: 0px;
	padding-left: 0px;
	padding-right: 0px;
	border-top-width: 4px;
	border-right-width: 4px;
	border-bottom-width: 4px;
	border-left-width: 4px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	float: left;
	position: static;
}


#gore ul.nav li {
	background-color: rgba(76,129,171,0.3);
	width: 415px;
	height: 30px;
	padding-top: 0px;
	padding-right: 0px;
	border-top-width: 3px;
	border-right-width: 0px;
	border-bottom-width: 2px;
	border-left-width: 2px;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-color: #fff;
	overflow: hidden;
		text-shadow: none;
	font-size: x-small;
	text-decoration: none;
	
}
	
#gore ul.nav li a img{
	
	float:left; 
	margin-right:5px; 
	border:none
	
}
#gore ul.nav a, ul.nav a:visited {
	display: inline-block;
	padding-top: 0px;
	padding-right:0px;
	padding-bottom: 10px;
	padding-left: 0px;
	margin-left: 0px;
	color: #3B6C94;
	font-style: normal;
	line-height: 30px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-align: left;
	vertical-align: middle;
	text-decoration: none;
	float:left; 
		margin-right:5px; 
		border:none;
}


#gore ul.nav a:hover, ul.nav a:active, ul.nav a:focus {
	background-color: #FFFFFF;
	}

	
#sat {
	width: 190px;
	padding-top: 25px;
	height: 185px;
	float: left;
	font-family: "Bernard MT Condensed", Impact;
	color: #3F79A1;
	font-size: large;
	font-style: normal;
	line-height: 6px;
	text-decoration: blink;
	text-align: center;
	white-space: normal;
}
/**************** KOLONI *****************/
.koloni {
display: flex;                  /* establish flex container */
  flex-direction: row;            /* default value; can be omitted */
  flex-wrap: nowrap;              /* default value; can be omitted */
  justify-content: space-between; /* switched from default (flex-start, see below) */
 
}
/**************** LEVA KOLONA *****************/
.leva_kolona {
	
	width: 18%;
	
	padding: 15px 0px 15px 10px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #FFFFFF;
	border-right-color: #3A7096;
	border-bottom-color: #FFFFFF;
	border-left-color: #FFFFFF;
	float: left;
	
	
	
}

.leva_kolona .gore {
	background-color: rgba(255,255,255,0.5);
	width: 170px;
	height: 290px;
	padding: 10px 0px 20px 0px;
	
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #3A7096;
	border-right-color: #3A7096;
	border-bottom-color: #3A7096;
	border-left-color: #3A7096;
	box-shadow: 10px 10px 5px #888888;

	text-align: center;
	color: #3F79A1;
	
}
.leva_kolona .sredina{
	
	
	background-color: rgba(76,129,171,0.8); 
	width: 155px;
	height: 280px;
	margin-top: 20px;
	
	padding-left:13px;
	padding-right:5px;
	padding-top:10px;
	padding-bottom:10px;
	box-shadow: 10px 10px 5px #888888;
	line-height: 20px;
	color:white;
	
}

.leva_kolona .dolu {
	background-color: rgba(255,255,255,0.5);
	width: 163px;
	height: 340px;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	padding-right: 13px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #3A7096;
	border-right-color: #3A7096;
	border-bottom-color: #3A7096;
	border-left-color: #3A7096;
	box-shadow: 10px 10px 5px #888888;
	text-align: right;
	line-height: 10px;
	color: #3F79A1;
}

/**************** CENTAR *****************/

.centar {
	background-color: rgba(255,255,255,0.8);
	width: 53%;
	display: grid;
    grid-template-rows: auto auto auto;
	padding: 10px 15px 10px 15px;
	border-width: 1px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #FFFFFF;
	border-right-color: #FFFFFF;
	border-bottom-color: #3A7096;
	border-left-color: #3A7096;
text-decoration: none;
	color: #3F79A1;
	line-height: 20px;
	float: left;
}

.centar a::before {
  background-color: #54b3d6;
  height: 2px;
  bottom: 0;
  transform-origin: 100% 50%;
  transform: scaleX(0);
}

.centar a:hover::before,
.centar a:focus::before {
  transform-origin: 0% 50%;
  transform: scaleX(1);
}

.centar h3{
	text-align: left;
	line-height: 22px;
}
.centar .gore{
	width: auto;
	height: auto;
	padding-bottom: 15px;
	
	}

.centar .sredina {
	width: 100%;
	height: auto;
	
	padding-bottom: 210px;
	}
	
		.centar .sredina .levo {
			height: 370px;
			width: 235px;
		    float: left;
			
			}

		.centar .sredina .desno {
			height: 370px;
			width: 235px;
			float: right;
			

		}
	
.centar .reklama {
	width: 100%;
	height: auto;


	
}

/**************** DESNO *****************/

.desna_kolona {
	width: 29%;
	padding: 5px 8px 15px 0px;

	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 0px;
	border-left-width: 1px;
	border-top-style: none;
	border-right-style:none ;
	border-bottom-style: none;
	border-left-style: solid;
	border-left-color: #3A7096;
	float: right;
	
	
}
.desna_kolona .gore {
	height: 175px;
	box-shadow: -10px 20px 5px #888888;
	float: right;
	
	

}

.desna_kolona .sredina {
	
	background-color: rgba(76,129,171,0.8); 
	width: 225px;
	height: 410px;
	margin-top:20px;
	display: block;
  	padding: 18px;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #3A7096;
	border-right-color: #3A7096;
	border-bottom-color: #3A7096;
	border-left-color: #3A7096;
	box-shadow: -10px 10px 5px #888888;
	color:white;
	
	float: right;
	
}
.desna_kolona .sredina a{
	float: left;
	padding-left: 5px;
}

.desna_kolona .dolu {
	background-color: rgba(255,255,255,0.5);
	margin-top:20px;
	margin-bottom:20px;
	width: 261px;
	height: 320px;
	padding-top: 10px ;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #3A7096;
	border-right-color: #3A7096;
	border-bottom-color: #3A7096;
	border-left-color: #3A7096;
	box-shadow: -10px 10px 5px #888888;
	float: right;
	text-align: center;
	color: #3F79A1;
	
}

/**************** FOOTER *****************/

.footer {
	margin-top: 10px; 
	background-color: rgba(0,0,0,0.1); 
	border-top:    1px solid white; 
	border-bottom: 1px solid white;
	clear: both;
	 
  left: 0;
  bottom: 0;

 

  text-align: center;

}

a:hover, a:visited, a:link, a:active {
  text-decoration: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}