@charset "UTF-8";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
html{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
*,:before,:after{-webkit-box-sizing:inherit;-moz-box-sizing:inherit;box-sizing:inherit}
body,html{height:100%;width:100%}
html{font-size:62.5%;min-width:320px;height:100%}
body{font:400 1.5em/1.6em 'Open Sans', sans-serif;color:#000;background:#002851;margin:0;padding:0 }

h1, h2, h3, h4, h5, h6{font-family:'Oswald', sans-serif;letter-spacing:1px;}
h2 {font-size: 20px; line-height: 32px; font-weight: 700; margin:0 0 30px 0}
h2.title {font-size: 28px; line-height: 34px; font-weight: 700; padding: 0 0 20px 0;}
h3 {font-size: 20px; line-height: 32px; font-weight: 700; margin:0 0 20px 0}
h3.h-link {font-size: 24px; line-height: 36px; font-weight: 700; margin:50px 0 30px 0}

a{color:#1A73E8;text-decoration:none;cursor: pointer; }
a:hover,a:focus{color:#ec483b; }
a {	noFocusLine: expression(this.onFocus=this.blur())
	outline: none;}
*:focus { outline: none; }

.ie7 body{overflow:hidden}
.center {text-align: center}
strong {font-weight: 700}
.italic {font-style: italic}
.max500 {max-width:500px; margin: 0 auto}
.padtop20 {padding-top: 20px}
.padtop50 {padding-top: 50px}
.padtop100 {padding-top: 100px}
.padbot30 {padding-bottom: 30px}
.green {color:#8BC341}
.big {font-size: 120%}
.block {display: block; width: 100%; float:left; padding: 0 0 50px 0}

#slide-box{height:100%;width:100%;left:0;top:0;overflow:hidden;position:fixed;-webkit-border-radius:4px;-moz-border-radius:4px}
#slide-over{width:100%;max-width:1280px;margin:40px auto;min-height:66vh;position:relative;z-index:1;background:rgba(255,255,255,.8);padding:20px;-webkit-border-radius:4px;-moz-border-radius:4px}
img.logo-pi{width:100%;max-width:467px;height:auto}
.back{background:rgba(255,255,255,.9);padding:40px 20px 20px;-webkit-border-radius:4px;-moz-border-radius:4px}
#logo {width:100%; max-width: 300px; margin: 0 auto 60px}

#header {position: relative}

/* JEZICI */

ul.engita{width:320px; float:right; background:rgba(255,255,255,.8);padding:0;list-style-type:none; margin: 0; border: solid 1px rgba(255,255,255,1);-webkit-border-radius:4px;-moz-border-radius:4px}
ul.engita li{width:25%; display: inline-block; text-align: center;margin:4px 0}
ul.engita li a{font-size:0.8em;color:#004691;text-decoration:none;padding-right:4px;padding-left:4px;letter-spacing:1px;}
ul.engita li a:hover{color:#ff0000;}

/* MENU */
.menu{list-style:none;margin:0;padding:0;width:100%;height:60px;margin:auto;position:relative;background-color:#00ADEF;z-index:7}
.menu li{float:left;width:25%;height:100%;margin:0;padding:0}
.menu a{display:flex;width:100%;height:100%;justify-content:center;align-items:center;color:#fff;text-decoration:none;position:relative;font-size:16px;font-family:'Oswald', sans-serif;letter-spacing:1px;z-index:9}
a.active{background-color:#F48F20;pointer-events:none}
li.slider{width:25%;height:100%;position:absolute;left:0;top:0;background-color:#F575C5;z-index:8;transition:left 0.4s,background-color .4s}
.menu li:nth-child(1):hover ~ .slider,.menu li:nth-child(1):focus ~ .slider,.menu li:nth-child(1):active ~ .slider{left:0;background-color:#3498db}
.menu li:nth-child(2):hover ~ .slider,.menu li:nth-child(2):focus ~ .slider,.menu li:nth-child(2):active ~ .slider{left:25%;background-color:#ef00ad}
.menu li:nth-child(3):hover ~ .slider,.menu li:nth-child(3):focus ~ .slider,.menu li:nth-child(3):active ~ .slider{left:50%;background-color:#00508A}
.menu li:nth-child(4):hover ~ .slider,.menu li:nth-child(4):focus ~ .slider,.menu li:nth-child(4):active ~ .slider{left:75%;background-color:#8BC341}

/* CRTA */
.underlined{color:#000;flex:1;font-size:1em;line-height:1.2;text-decoration:none;background-image:linear-gradient(to right,#00ADEF 0,#00ADEF 100%);background-position:0 1.2em;background-size:0 100%;background-repeat:no-repeat;transition:background .5s;padding:20px 10px 5px}
.underlined:hover{background-size:100% 100%}

/* DUGME */
.button{--offset:5px;--border-size:1px;display:block;position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:#c0c0c0;outline:none;cursor:pointer;border-radius:0;box-shadow:inset 0 0 0 var(--border-size) #2383E7;transition:background .8s ease;max-width:240px;text-align:center;margin:50px auto}
.button:hover{background:rgba(255,247,230,0.3)}
.button span{display:block;padding:10px 24px;color:#666;font-size:.733em;font-weight:400;text-transform:uppercase;letter-spacing:2px}
.button:hover span:hover{color:#2383E7!important;}
.button__horizontal,.button__vertical{position:absolute;top:var(--horizontal-offset,0);right:var(--vertical-offset,0);bottom:var(--horizontal-offset,0);left:var(--vertical-offset,0);transition:-webkit-transform .8s ease;transition:transform .8s ease;transition:transform .8s ease,-webkit-transform .8s ease;will-change:transform}
.button__horizontal::before,.button__vertical::before{content:'';position:absolute;border:inherit}
.button__horizontal{--vertical-offset:calc(var(--offset) * -1);border-top:var(--border-size) solid currentcolor;border-bottom:var(--border-size) solid currentcolor}
.button__horizontal::before{top:calc(var(--vertical-offset) - var(--border-size));bottom:calc(var(--vertical-offset) - var(--border-size));left:calc(var(--vertical-offset) * -1);right:calc(var(--vertical-offset) * -1)}
.button:hover .button__horizontal{-webkit-transform:scaleX(0);transform:scaleX(0)}
.button__vertical{--horizontal-offset:calc(var(--offset) * -1);border-left:var(--border-size) solid currentcolor;border-right:var(--border-size) solid currentcolor}
.button__vertical::before{top:calc(var(--horizontal-offset) * -1);bottom:calc(var(--horizontal-offset) * -1);left:calc(var(--horizontal-offset) - var(--border-size));right:calc(var(--horizontal-offset) - var(--border-size))}
.button:hover .button__vertical{-webkit-transform:scaleY(0);transform:scaleY(0)}

.transfers {width:300px; padding: 12px 20px; margin: 20px auto; background:rgba(0,0,0,.2) }
a > .transfers:hover {background:rgba(0,173,239,.5)}
hr.u-line{width:66%;margin:15px auto 50px;border:0;height:12px;background-image:linear-gradient(115deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0) 39%,silver 42%,silver 57%,rgba(255,255,255,0) 60%,rgba(255,255,255,0) 100%);background-size:5px 12px}

/* ICON AWESOME */
.faw{position:relative}
.faw:before{content:"\f000";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;color:#c0c0c0;font-size:16px;padding:0 6px 0 15px}
.faw:hover:before{color:#0000D9}

.whi{position:relative}
.whi:before{content:"\f000";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;color:#fff;font-size:16px;padding:0 6px 0 15px}
.whi:hover:before{color:#0000D9}

.ico{position:relative}
.ico:before{content:"\f000";font-family:FontAwesome;font-style:normal;font-weight:400;text-decoration:inherit;color:#c0c0c0;font-size:72px;padding-right:5px}
.ico:hover:before{color:#0000D9}

.icon {width:128px; display: block; height: auto;overflow: hidden;margin: 20px auto 10px;}

/*********** POMOĆNA NAVIGACIJA ************/
@font-face{font-family:'icomoon';src:url('../fonts/icomoon/icomoon.eot');src:url('../fonts/icomoon/icomoon.eot?#iefix') format('embedded-opentype'),url('../fonts/icomoon/icomoon.woff') format('woff'),url('../fonts/icomoon/icomoon.ttf') format('truetype'),url('../fonts/icomoon/icomoon.svg#icomoon') format('svg');font-weight:normal;font-style:normal;}
ul.menu2{text-align:center;display:block;margin:20px 0 100px;outline:none;}
ul.menu2 li{display:inline;margin-right:auto;margin-left:auto;}
.butt{border:none;font-family:inherit;font-size:inherit;color:inherit;background:none;cursor:pointer;padding:12px 25px 12px 25px;display:inline-block;text-transform:uppercase;letter-spacing:1px;outline:none;position:relative;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;margin-top:5px;margin-bottom:5px;margin-right: 10px;}
ul.menu2 .butt:after{content:'';position:absolute;z-index:-1;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
ul.menu2 .butt:before{font-family:'icomoon';speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;position:relative;-webkit-font-smoothing:antialiased;}
ul.menu2 .butt{border-radius:0px;border:1px solid #66A9D2;color:#5D5D5D;overflow:hidden;font-size:11px;font-weight:400;}
ul.menu2 .butt:active{border-color:#555;color:#000;}
ul.menu2 span.truncate3{width:217px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}
ul.menu2 .butt:hover{background:#00ADEF;color:#FFF;border:1px solid #009AD5;}
ul.menu2 .butt:before{position:absolute;height:100%;font-size:100%;line-height:4.5;color:#ccc;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;transition:all 0.3s;}
ul.menu2 .butt:active:before{color:#000;}
ul.menu2 .butt:before{left:82%;opacity:1;top:0;}
ul.menu2 .butt:hover:before{left:92%;opacity:1;color:#fff;}
ul.menu2 .ara:before{content:"\e00d";}

ul.menu2 span{width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}


/* LINK LINE */
a.link{display:inline-block;position:relative;padding-bottom:2px;text-decoration:none}
a.link:after{content:'';display:block;margin:auto;height:1px;width:0;background:transparent;transition:width .5s ease,background-color .5s ease}
a.link:hover:after{width:100%;background:#0000D9;}

/* FOOTER */
.footer {background: #00ADEF; width: 100%; display: block; text-align: center; margin-top: 50px; padding-top: 50px; padding-bottom: 50px; color: #fff;}
.copy {text-align: center; padding-top: 20px; padding-bottom: 0px; color: #fff; font-size: 12px}
.footer a{display:inline-block;position:relative;padding-bottom:2px;color:#FFF7E6;text-decoration:none}
.footer a:after{content:'';display:block;margin:auto;height:1px;width:0;background:transparent;transition:width .5s ease,background-color .5s ease}
.footer a:hover:after{width:100%;background:#0000D9;}
.footer a:hover{ color: #0000D9}
.footer span {margin-right:15px}



/* RESPONSIVE */
@media all and (max-width: 1024px) {
	ul.engita{float:none; height:38px; margin: 15px auto}	
}
@media all and (max-width: 768px) {
	.menu a{font-size:15px;letter-spacing:0;}
	.padtop100 {padding-top: 50px}
	#logo {max-width: 280px; margin: 20px auto 30px}
	h2.title {font-size: 22px; line-height: 32px; padding: 20px 0 0;}
	#slide-over {margin: 20px auto;}
	ul.menu2{margin:20px 0 50px;}
}
@media all and (max-width: 480px) {
#logo {max-width: 240px; margin: 15px auto 20px}
	ul.engita{margin: 0 auto}
	ul.engita li a{letter-spacing:0;}
	.menu a{font-size:14px;}
	ul.navi{width:280px;}
	ul.navi li a{letter-spacing:0;font-weight: 400;font-size:0.82em;}
	.underlined {padding: 20px 5px 5px}
}