@charset "utf-8";


body {
	/*background-image: url(../Images/map.jpg);*/
	/*background-repeat: repeat;*/
    margin: auto;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	width: 100%;	
}


a {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	text-decoration: none;
	color: #FFF;
}

a:visited{
	color: #FFF;
}


#header_BG {
	width: 100%;
	margin: auto;
	height: 120px;
	background-image: url(../Images/transparent2.fw.png);
}
#logo {
	float: left;
	width: 40px;
	margin-top: 10px;
}


#main_container {
	margin: auto;
    width: 1080px;
	height: 650px;
}


#header {
	height: 120px;
	width: 1080px;
	margin: auto;
}
#headline {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	display: block;
	float: left;
	margin-top: 10px;
}



.wrapper {
	height: 600px;
	width: 980px;
	margin-top: 50px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
}


.outer {
	height: 100%;
	width: 100%;
	position: relative;
	background-repeat: repeat;
	-webkit-box-shadow: 0 2px 2px #000, 0 1px 0 #fff inset;
	-moz-box-shadow: 0 2px 2px #000, 0 1px 0 #fff inset;
	box-shadow: 0 2px 2px #000, 0 1px 0 #fff inset;
	margin-top: 50px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
}


.inner{
	display: block;
	width: 980px;
	height: 600px;
	left: 50%;
	background-image: url(../Images/transparent.fw.png);
}


#navigation {
    height: 17px;
    position: absolute;
    float: right;
    margin-top: 20px;
    margin-right: 20px;
    width: 300px;
    bottom: 20px;
    right: 0px;
}

#navigation ul{
	max-width: 300px;
	height: 17px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	text-align: center;
}

#navigation li{
display: inline-block;
}

#navigation a{
	display: block;
	width: 15px;
	height: 17px;
	text-align: center;
	text-decoration: none;
	padding-right: 8px;
	padding-left: 8px;
}	
.first {
	background-image: url(../Images/back_all.png);
	background-repeat: no-repeat;
}
.back {
	background-image: url(../Images/back.png);
	background-repeat: no-repeat;
}
.forward {
	background-image: url(../Images/forward.png);
	background-repeat: no-repeat;
}
.last {
	background-image: url(../Images/forward_all.png);
	background-repeat: no-repeat;
}


.grow:hover {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
#page {
	float: left;
	clear: right;
	width: 150px;
}

#napomene {
	font-size: 12px;
    float: left;
    margin-top: 25px;
    margin-left: 35px;
    left: 0px;
    bottom: 20px;
    position: absolute;
}
#close {
	background-color: #000;
	float: left;
	height: 55px;
	width: 34px;
	padding-left: 5px;
	padding-top: 5px;
}

.NS {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #59B200;
    behavior: url(../Content/dodatak/PIE.htc);
    position: relative;
}
 
.PS {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #00A3D9;
    behavior: url(../Content/dodatak/PIE.htc);
    position: relative;
}
 
.RM {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #FF0;
    behavior: url(../Content/dodatak/PIE.htc);
    position: relative;
}
 
.IM {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #F90;
    behavior: url(../Content/dodatak/PIE.htc);
    position: relative;
}
 
.IS {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #F00;
    behavior: url(../Content/dodatak/PIE.htc);
    position: relative;
}


.inner2 {
                display: block;
                width: 980px;
                height: 600px;
                left: 50%;
                background-image: url(../Images/transparent.fw.png);
}
 
.graph {
                float: left;
                height: 470px;
                width: 460px;
}
 
.naziv_postaje {
                float: left;
                height: 60px;
                width: 400px;
                padding-left: 40px;
}
 
#close2 {
                float: right;
                height: 55px;
                width: 34px;
                padding-left: 5px;
                padding-top: 5px;
}


#btn_list {
                height: 38px;
                width: 160px;
                margin-right: 0px;
                margin-left: 181px;
                float: left;
                font-size: 15px;
                list-style-type: none;
                text-decoration: none;
                text-align: center;
                margin-top: 20px;
}
 
.btn_list_BG {
                background-image: url(../Images/vodostaji_btn2.png);
                background-repeat: no-repeat;
                height: 28px;
                width: 160px;
                display: block;
                padding-top: 10px;
}

.btn_list_BG:hover {
                background-image: url(../Images/vodostaji_btn4.png);
                background-repeat: no-repeat;
                height: 28px;
                width: 160px;
                display: block;
                padding-top: 10px;
}


#back_btn {
                height: 25px;
                width: 70px;
                margin-top: 550px;
                margin-left: 880px;
                text-align: center;
                background-image: url(../Images/back_btn.fw.png);
                background-repeat: no-repeat;
                background-position: center center;
                font-size: 14px;
                position: absolute;
                padding-top: 5px;
                cursor: pointer;
}
 
#back_btn a:hover{
                height: 25px;
                width: 70px;
                background-image: url(../Images/back_btn_hover.fw.png);
                background-repeat: no-repeat;
                background-position: center center;
                float: left;
                margin-top: -5px;
                padding-top: 5px;
}

.GetMobile {
    float: right;
}

.GetMobile > img {
    width: 30px;
    height: 30px;
    cursor: pointer;
    margin-top: 10px;
    margin-right: 7px;
    display: block;
}

.GetMobile > img:hover + div,
.GetMobile > img + div:hover {
    display: block;
}

.GetMobile > img + div {
    position: absolute;
    background-color: white;
    z-index: 9999;
    display: none;
}

.GetMobile div {
    color: #555;
    font-size: 0.7rem;
    padding: 3px;
}

.GetMobile a {
    display: block;
    color: #555;
    padding: 5px;
    padding-left: 36px;
    font-size: 0.7rem;
    background: transparent url('../Images/android-icon.png') no-repeat center left;
}
.GetMobile a:last-child {
    background-image: url('../Images/apple-icon.png');
}
.GetMobile a:hover {
    color: #CF7;
    background-color: #555;
}