﻿.apis-empty-text 
{
    text-align: center;
    font-weight: bold;
    font-size: 11px;
    color: #999;    
}

.legend-window .x-window-body 
{
    padding: 10px;
    background: white;
    overflow: auto;
}

.legend-window h1,
.legend-window h2,
.legend-window h3,
.legend-window h4 
{
    margin-top: 0;    
}

.legend-window ul 
{
    list-style: none; 
    padding-left: 0;
}

.legend-window ul.kodovi-teme > li
{
    padding-top: 10px;
    border-top: 1px solid #ccc;
    margin-top: 10px;        
}

.legend-window ul.kodovi-teme > li > p
{
    margin-top: 0;    
}

.legend-window ul.planska-znakovlja > li 
{
    width: 160px;
    display: inline-block;
    text-align: center;
    margin: 10px 5px 0 5px;
}


table.prostorna-informacija-details
{
    font-size: inherit;
    margin-bottom: 5px;
}

table.prostorna-informacija-details td 
{
    vertical-align: top; 
    font-weight: bold;  
    color: #666; 
}

table.prostorna-informacija-details td:first-child 
{
    padding: 0 5px 5px 0;
    font-weight: normal;
}

table.prostorna-informacija-details td:first-child:after 
{
    content: ':';
}

.lokacijska-informacija-step 
{
    font-size: 11px;
}

.lokacijska-informacija-step a 
{
    color: darkblue;
    font-weight: bold;
    vertical-align: top;
}

.prostorna-informacija-list 
{
    list-style: none;
    padding-left: 0px; 
}

.prostorna-informacija-list > li 
{
    margin-bottom: 5px;    
}

.lokacijska-informacija-step .details-item
{
    margin-top: 10px;    
}

.lokacijska-informacija-step .details-item:first-child
{
    margin-top: 0px;
}

.lokacijska-informacija-step .details-item > .label 
{
    color: #666;
}

.lokacijska-informacija-step .details-item > .description 
{
    padding-left: 15px;
    font-weight: bold;
    color: #666;
}

.lokacijska-informacija-step .details-item > .description_no_bold 
{
    padding-left: 15px;
    color: #666;
}

.lokacijska-informacija-step .text,
.lokacijska-informacija-step .empty-text
{
    margin: 2px 0;
    color: #666;
}

.lokacijska-informacija-step .empty-text
{
    margin: 15px 0;    
}

.lokacijska-informacija-step .title 
{
    margin: 20px 0 5px 0;
    font-weight: bold;
    color: #555;
}

.lokacijska-informacija-step .title:first-child 
{
    margin-top: 0;    
}

.lokacijska-informacija-step .toggle > .content {
    margin: 0 0 10px 10px;
    display: none;
}

.lokacijska-informacija-step .toggle.expanded > .content
{
    display: block;
    padding-left: 10px;
}

.lokacijska-informacija-step .toggle .title {
    line-height: 16px;
    vertical-align: top;
    cursor: pointer;
}

.lokacijska-informacija-step .toggle > .title:before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url(../../ExtJs/resources/ext-theme-gray/images/tools/tool-sprites.gif) 0px -75px;
    margin-right: 5px;
}

.lokacijska-informacija-step .toggle.expanded > .title:before {
    background-position: 0px -60px;
}

.lokacijska-informacija-step p
{
    margin: 0;
}

.posebni-propis
{
    margin-top: 10px !important;    
}

.informacijska-lokacija-step-button
{
    font-size: 11px;
    line-height: 16px;
    margin-bottom: 5px;
}

.informacijska-lokacija-step-button .redni-broj 
{
    font-weight: bold;
    float: left;   
    line-height: 16px; 
}

.informacijska-lokacija-step-button .labela
{
    float: left;
    margin-left: 5px;
    text-align: left;
    line-height: 16px;
}

.informacijska-lokacija-step-group-title 
{
    font-weight: bold;
    margin: 10px 0 7px 2px;
}

.informacijska-lokacija-step-group-title:first-child 
{
    margin-top: 0;    
}

.lokacijska-informacija-info p 
{
    margin: 0 0 10px 0;
}

.lokacijska-informacija-info ul 
{
    list-style: none;
    padding-left: 10px;
}

.lokacijska-informacija-description {
    text-align: center;
    font-weight: bold;
    color: #777;
}


.apis-servisi {
    padding: 10px;
    overflow-y: auto;
    font-size: 11px;
    color: #777;
    background: white;
    border: 1px solid #ccc;
}

.servisi-list-title 
{
    list-style: none;
    font-weight: bold;
    padding-left: 0; 
    margin: 0;
}

.servisi-list-content 
{
    list-style: none;
    margin: 0px 0 2px 2px;
    padding-left: 0px;
}

.servisi-tekst-bold
{
    font-weight: bold;
    margin: 0 0 10px 0;
}

ul.servisi-tekst-list {
    padding-left: 20px;
    margin: 0;
}

ul.servisi-tekst-list li {
    margin-bottom: 5px;
}

.servisi-tekst
{
    list-style: none;
    margin: 0px 0 10px 0;
    padding-left: 0px;
}

.servisi-table {
    margin-left: 10px;
    font-size: 11px;
    color: #777;
}

.servisi-table tr {
    margin-bottom: 2px;
}

.servisi-table .title {
    font-weight: bold;
    vertical-align: top;
}

.servisi-table .title:after {
    content: ':';
    padding-right: 5px;
}

/*
Ispravak Chrome 31 i 32 bug-a gdje bi nestalo
cijelo sučelje kada je upaljeno više od 4 sloja
na OpenLayers karti.
*/
.olTileImage {
    -webkit-backface-visibility: visible !important;
    -webkit-transform: none !important;
}


.olControlLoadingPanel {
    background: white url(../images/loading.gif) no-repeat center;
    position: relative;
    width: 48px;
    height: 48px;
    background-position:center;
    background-repeat:no-repeat;
    display: none;
    bottom: 10px;
    left: 50%;
    margin-left: -24px;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #CCC;
    box-shadow: 0 0 5px rgba( 0, 0, 0, 0.25 );
}

.olImageLoadError {
    display: none;
}

.x-grid-empty {
    height: 100%;
    width: 100%;
    text-align: center;
    font-weight: bold;
}

/* Input elementima unutar "base-layer" klase stavljamo sliku radio buttona. */
.x-grid-tree-node-leaf .base-layer input {
    display: inline-block !important;
    background-image: url("../../ExtJs/resources/ext-theme-gray/images/form/radio.gif");
}

#layerManager .x-form-cb { margin-top: 0 !important; }

.disclaimer {
    background: white;
    color: #777;
    padding: 5px;
}

.disclaimer p {
    margin: 0 0 10px 0;
    font-size:11px;
    font-weight: bold;
    line-height: 150%;
}

.info-poruka {
    background: white;
    border: 1px solid #CCC !important;
    color: #777;
}

.uvjeti-koristenja {
    background: white;
    border: 1px solid #CCC !important;
    overflow: auto;
}

.uvjeti-koristenja h1 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    color: #333;
}

.uvjeti-koristenja h2 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    color: #666;
}

.uvjeti-koristenja p 
{
    margin-top: 0;
    text-align: justify;
}

table.identifytable td {
    padding: 4px;
    vertical-align: top;
}

td.row-title {
    font-weight: bold;
    width: 200px;
    display:inline-block;
    vertical-align: top;
}

td.row-title:after {
    content: ':';
}

.poveznice-container { padding: 15px; }

.poveznice-container a {
    font-size: 11px;
    font-weight: bold;
    color: #777;
    display: block;
    margin-bottom: 10px;
}

.poveznice-container a:hover {
    color: black;
}

#map {
    position: relative;
}

#watermark {
    display: block;
    width: 100%;
    height: 50px;
    position: absolute;
    z-index: 99999;
    bottom: 0;
    right: 0;
    background-color: rgba(255,255,255,0.2);
}

#watermark .client-link 
{
    display: block;
    margin: 15px auto 0 auto;
    padding: 10px;
    border-radius: 5px 5px 0 0;
    /*background: white;*/
    color: black;
    text-decoration: none;
    font-weight: bold;
    height: 35px;
    line-height: 15px;
    text-align: center;
    width: 350px;
    
    opacity: 0.5;
    filter: alpha(opacity=50); /*IE7*/
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /*IE8*/
    
    text-shadow: 0 0 5px white;
}

#watermark .apis-link
{
    width: 380px;
    height: 50px;
    display: block;
    position: absolute;
    right: 0;
    top: 3px;
}

/*
    "autoScroll: false" property od ExtJS.button.Button klase ne radi,
    i stoga se ručno postavlja u CSS-u.
*/
.x-btn-inner { overflow: hidden; }

.x-grid-row  { height: 25px; } /* Zadatak 55880: napraviti veći razmak između elementa kataloga */

.identifyActive * {
    cursor: help;
}

.base-layer-folder input[role="checkbox"] { display: none; }
.base-layer-folder input[type="radio"] { margin: 2px; }

.layer-visibility-checkbox { padding: 0 5px; }
.layer-info > div { margin: 1px 2px; }
.layer-identify > div { margin-left: -2px; }
.layer-remove > div {
    width: 20px;
    height: 18px;
    margin: 2px;
}

.hidden { display: none; }

.layer-opacity-slider > div {
    margin: 2px 0; /*vertically center the layer opacity slider*/
    padding: 0 !important;
}

#mjeriloProjekcijaPanel > div {
    background: transparent !important;
}

#Koordinate,
.south-center,
.south-right a {
    line-height: 21px !important; 
}

.south-center {
    text-align: center;
}

.south-right {
    text-align: right; 
}

.south-right a {
    font-weight: bold;
    text-decoration: none;
    color: #666;
}

.south-right a:hover {
    color: Black;
    text-decoration: underline;
}

.info-text {
    font-weight: bold;
    margin: 20px;
    text-align: center;
}

.links-panel {
    width: 100%;
    height: 100%;
}

.links-panel a {
    margin: 10px;
    display: block;
    font-weight: bold;
    text-decoration: none;
}

.links-panel h1 {
    margin: 5px 10px;
    font-size: 15px;
}

.links-panel h3 {
    margin: 10px 10px 5px 10px;
    border-bottom: 1px solid gray;
    padding-bottom: 5px;
}

.links-panel a:hover {
    color: darkBlue;
    text-decoration: underline;
}

.olLayerDiv svg { position: absolute; } /*Fix za Chrome s bježanjem vektorskih layer-a na istok*/

#zoom-legend 
{
    background: #DEDEDE;
    position: absolute;
    z-index: 99999;
    padding: 7px;
    border: 1px solid darkGrey;
    border-radius: 3px;
    text-align: center;
    font-family: tahoma, arial, verdana, sans-serif;
    font-size: 11px;
    display: none;
    line-height: 160%;
    box-shadow: 0 0 3px rgba( 0, 0, 0, 0.25 );
}

#zoom-legend:after,
#zoom-legend:before {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;  
    top: 20px;
}

#zoom-legend:after {
    border-right-color: #DEDEDE;
    border-width: 5px;
    margin-top: -5px;
    left: -10px;
}

#zoom-legend:before {
    border-right-color: darkGrey;
    border-width: 6px;
    margin-top: -6px;
    left: -12px;
}

#zoom-legend h3 
{
    font-size: 11px;
    font-weight: bold;
}

#zoom-legend p 
{
    border-bottom: 1px solid #AAA;
    padding-bottom: 3px;  
}

#zoom-legend h3,
#zoom-legend p {
    margin: 0 0 3px 0;
}

#zoom-legend p.last-child 
{
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0;
}

#header 
{
    background: transparent url("../../images/bg.png") repeat-x 0 0;
}

#zoomLegend 
{
    position: absolute;
    width: 18px;
    height: 145px;
    background: red;
    top: 80px;
    left: 13px;
    opacity: 0;    
}

#loading-mask
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 20000;
    background-color: white;
}

#loading
{
    position: absolute;
    left: 50%;
    top: 50%;
    padding: 2px;
    z-index: 20001;
    height: auto;
    margin: -35px 0 0 -30px;
}

#loading .loading-indicator
{
    background: url(../images/loading.gif) no-repeat;
    color: #555;
    font: bold 13px tahoma,arial,helvetica;
    padding: 8px 42px;
    margin: 0;
    text-align: center;
    height: auto;
}

.searchButton
{
    background-position: center 0;
    background-repeat: no-repeat;
}

.container
{
    border: 3px solid #C3DAF9;
    height: 33px;
    width: 250px;
}

.RightCellRowExpander
{
    float: right;
}

.LayerUp
{
    background-image: url("../images/up.gif") !important;
}

.LayerDown
{
    background-image: url("../images/dn.gif") !important;
}

.user
{
    background-image: url("../images/user.gif") !important;
}
.edit
{
    background-image: url("../images/im32x32.gif") !important;
}
.add
{
    background-image: url("../images/add.gif") !important;
}

.search
{
    background-position: center 0;
    background-repeat: no-repeat;
    background-image: url("../images/search.png") !important;
}

.teset
{
    background-color: red;
}

.measure-length
{
    background-image: url("../images/mActionMeasure.png") !important;
}

.measure-area
{
    background-image: url("../images/mActionMeasureArea.png") !important;
}

.draw-polygon-tool
{
    background-image: url("../images/mActionCapturePolygon.png") !important;
}

.draw-line-tool
{
    background-image: url("../images/mActionCaptureLine.png") !important;
}

.draw-point-tool
{
    background-image: url("../images/mActionCapturePoint.png") !important;
}
.delete-shape-tool
{
    background-image: url("../images/erase.png") !important;
}

.identify-tool-cls .x-btn-inner
{
    font-size: 10px;
}

.x-action-col-cell img
{
    cursor: pointer;
    height: 16px;
    width: 16px;
}

.x-action-col-cell img.info-col
{
    background-image: url("../images/info.png");
}

.info-col-action
{
    background-image: url("../images/info.png");
    float: right;
}

.napomena-col-action
{
    background-image: url("../images/napomena.png");
    float: right;
}


.olControlOverviewMapElement
{
    background-color: white !important;
    border-color: #CCCCCC;
    border-radius: 0 0 0 0 !important;
    border-style: solid;
    border-width: 1px;
    margin-bottom: 3px;
    padding: 5px !important;
}

.olControlPanel div
{
    display: block;
    width: 250px;
    height: 24px;
    margin: 5px;
    background-color: #ffffff;
    float: left;
}
.olControlPanel .olControlNavigationItemActive
{
    width: 24px;
    height: 22px;
    background-image: url(../../../../OpenLayers/theme/default/img/editing_tool_bar.png);
    background-repeat: no-repeat;
    background-position: -103px -24px;
}
.olControlPanel .olControlNavigationItemInactive
{
    width: 24px;
    height: 22px;
    background-image: url(../../OpenLayers/theme/default/img/editing_tool_bar.png);
    background-repeat: no-repeat;
    background-position: -103px -1px;
}
.olControlPanel .olControlDrawFeaturePointItemInactive
{
    width: 24px;
    height: 22px;
    background-image: url(../../OpenLayers/theme/default/img/edit_labela_OFF.png);
}
.olControlPanel .olControlDrawFeaturePointItemActive
{
    width: 24px;
    height: 22px;
    background-image: url(../../OpenLayers/theme/default/img/edit_labela_ON.png);
}
.olControlPanel .olControlDrawFeaturePolygonItemInactive
{
    background-image: url(../../OpenLayers/theme/default/draw_polygon_off.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDrawFeaturePolygonItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/draw_polygon_on.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlModifyFeatureItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/move_feature_on.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlModifyFeatureItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/move_feature_off.png);
    background-repeat: no-repeat;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDeleteFeatureItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/brisanje_labele_ON.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDeleteFeatureItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/brisanje_labele_OFF.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDeleteFeaturePolygonItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/draw_polygon_on_X.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDeleteFeaturePolygonItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/draw_polygon_off_X.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlSelectFeatureItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/info_KBR_on.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlSelectFeatureItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/info_KBR_off.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}

.olControlPanel .olControlSaveFeaturesItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/save_features_on.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlSaveFeaturesItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/save_features_off.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlSelectFeatureRotateItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/rotiranje_labele_ON.png);
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlSelectFeatureRotateItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/rotiranje_labele_OFF.png);
    width: 24px;
    height: 22px;
}

.olControlPanel .olControlIdentifyItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/identify_on.png);
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlIdentifyItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/identify_off.png);
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDragFeatureItemActive
{
    background-image: url(../../OpenLayers/theme/default/img/pomicanje_okvira_ON.PNG);
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlDragFeatureItemInactive
{
    background-image: url(../../OpenLayers/theme/default/img/pomicanje_okvira_OFF.PNG);
    width: 24px;
    height: 22px;
}
.olControlPanel .olControlScaleLine
{
    font-size: 12px;
}

#msg-div
{
    left: 45%;
    position: absolute;
    top: 10px;
    width: 300px;
    z-index: 20000;
}

#msg-div .msg
{
    background: none repeat scroll 0 0 #F6F6F6;
    border: 2px solid #CCCCCC;
    border-radius: 8px 8px 8px 8px;
    color: #555555;
    margin-top: 2px;
    padding: 10px 15px;
}
#msg-div .msg h3
{
    font-size: 15px;
    font-weight: bold;
    margin: 0 0 8px;
}
#msg-div .msg p
{
    margin: 0;
}

.map_header table.x-table-layout
{
    background: none transparent scroll repeat 0% 0%;
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#FFFFFF, EndColorStr=#E9E9E9);
    background-image: -webkit-linear-gradient(top, rgb(256,256,256), rgb(224,224,224));
    background-image: -moz-linear-gradient(top, rgb(256,256,256), rgb(224,224,224));
    border-bottom: 1px solid #d6d6d6;
    border-top: 1px solid #d6d6d6;
}

.mapContainer
{
    width: 100%;
    height: 100%;
}


.identifytable
{
    font-size: 12px;
    vertical-align: top;
}
.identifybox
{
    font-family: tahoma,arial,verdana,sans-serif;
    font-size: 12px;
    padding: 2px 2px 2px 2px;
}
.identifybox a
{
    font-family: tahoma,arial,verdana,sans-serif;
    font-size: 12px;
    color: #00b0d7;
    font-weight: bold;
    text-decoration: none;
}
.identifybox a:hover
{
    font-family: tahoma,arial,verdana,sans-serif;
    font-size: 12px;
    color: #4b9ab7;
    font-weight: bold;
    text-decoration: none;
}
