.layerTitle {
    display: block;
    font-weight: bold;
}

.legendTitle {
    display: block;
    font-style: italic;
    font-size: 0.9em;
    padding: 1%;
}

.legendNote {
    display: block;
    font-style: italic;
    font-size: 0.8em;
    padding: 5px 0px 5px 0px;
}

.mapNote {
    display: block;
    font-style: italic;
    font-size: 0.7em;
    padding: 5px 0px 3px 0px;
}

.yearNote {
    display: block;
    font-weight: bold;
    font-size: 0.9em;
    padding: 5px 0px 5px 0px;
}

span.disclaimer {
    padding: 5px;
    display: block;
}

.share-button {
    border: none;
    background-color: transparent;
    width: 64px !important;
    height: 64px !important;
    cursor: pointer;
}

.share-button-linkedin {
    background-image: url("../img/dzs/share/linkedin.png");
}

.share-button-linkedin-hover {
    background-image: url("../img/dzs/share/linkedin-hover.png");
}

.share-button-facebook {
    background-image: url("../img/dzs/share/facebook.png");
}

.share-button-facebook-hover {
    background-image: url("../img/dzs/share/facebook-hover.png");
}

.share-button-x {
    background-image: url("../img/dzs/share/x.png");
}

.share-button-x-hover {
    background-image: url("../img/dzs/share/x-hover.png");
}

.share-button-instagram {
    background-image: url("../img/dzs/share/instagram.png");
}

.share-button-instagram-hover {
    background-image: url("../img/dzs/share/instagram-hover.png");
}

.share-button-youtube {
    background-image: url("../img/dzs/share/youtube.png");
}

.share-button-youtube-hover {
    background-image: url("../img/dzs/share/youtube-hover.png");
}

.icon-tutorial {
	background-image: url("../img/dzs/tutorial.svg");
}

/* Ext.Tip overrides */
.x-tip {
    background-color: rgba(255, 255, 255, 0.7) !important;
    border: 1px solid #000;
    white-space: nowrap;
}

.x-tip-body {
    line-height: 1.5em;
}

.tip-value {
    font-weight: bold;
}

.tip-description {
    font-size: 0.8em;
}

.tooltip-div div {
    background: rgba(255, 255, 255, 0);
}

.header-login-bar {
    position: absolute;
    top: 10px;
    right: 8px;
    background-color: rgba(255, 255, 255, 0.7);
    color: #3B3039;
    border-radius: 2px;
}

.header-login-bar a {
    color: #3B3039;
}

.header-login-bar div:first-child {
    border-right: 1px solid #157FCC;
}

.header-login-bar div {
    display: inline-block;
    line-height: 26px;
    margin: 7px 0;
    padding: 0 10px;
}

.portal-header {
    background-color: white;
}

.header-left {
    float: left;
}

.header-right {
    float: right;
    padding: 5px;
}

.border-toolbar {
    border-top: 2px solid #157fcc !important;
    border-bottom: 2px solid #157fcc !important;
}

.year-control-toolbar {
    border-left: 1px solid #157fcc !important;
    border-right: 1px solid #157fcc !important;
}

.language-select-hr {
    background-image: url("../img/dzs/flag_en.png");
    background-repeat: no-repeat;
    background-size: 22px 18px;
    /* float: left; */
    height: 18px;
    width: 22px;
    margin-top: 6px;
    margin-left: 10px;
}

.language-select-en {
    background-image: url("../img/dzs/flag_hr.png");
    background-repeat: no-repeat;
    background-size: 22px 18px;
    /* float: left; */
    height: 18px;
    width: 22px;
    margin-top: 6px;
    margin-left: 10px;
}

.language-select {
    margin-top: 7px;
    margin-left: 5px;
}

.grid-delete-row {
    background-image: url("../img/dzs/trash.png");
    background-repeat: no-repeat;
    background-size: 16px 16px;
    height: 20px;
    width: 20px;
}

/*.centerYearButtons > span {
	margin: 0 auto;
	width: initial !important;
}*/

.graph-button {
    background-image: url(../img/dzs/chart.png);
    width: 32px;
    height: 32px;
    background-color: transparent;
    border: none;
}

/* FOOTER */

.footer-container {
    background-color: #ADD2ED;
    padding: 1px;
    border-left: 1px solid #157FCC;
    border-right: 1px solid #157FCC;
    border-bottom: 2px solid #157FCC;
    border-top: 1px solid #157fcc;
}

@media screen and (min-width : 660px) {
    .footer-eu {
        display: block;
        border-right: 1px solid #157fcc;
        float: left;
        padding-left: 10px;
    }
}

@media screen and (max-width : 660px) {
    .footer-eu {
        display: none;
    }
}

div#eu-flag {
    background-image: url("../img/dzs/eu-logo.svg");
    background-repeat: no-repeat;
    background-size: 45px 30px;
    float: left;
    height: 30px;
    width: 45px;
}


.footer-dzs {
    border-right: 1px solid #157fcc;
    padding: 0px 1em 0px 1em;
    float: left;
}

div#dzs-logo {
    background-image: url("../img/dzs/dzs.png");
    background-repeat: no-repeat;
    background-size: 174px 30px;
    float: left;
    height: 30px;
    width: 174px;
}

.financing-legal {
    font-size: 0.8em;
    width: 270px;
    display: block;
    padding: 0px 1em 0px 1em;
    left: 5px;
    /* position: relative; */
    float: left;
    line-height: 1em;
}

.about-button {
    right: 0px !important;
    left: auto !important;
    background-color: #ADD2ED !important;
    background-image: none !important;
}

@media screen and (min-width : 540px) {
    .footer-center {
        display: block !important;
    }
}

.footer-center {
    /*left: 50% !important;*/
    /*margin-left: -160px !important;*/
    /*text-align: center;*/
    width: 320px;
    font-size: 0.85em;
    padding: 2px;
    right: 0px !important;
    left: auto !important;
    display: none;
    float: right;
}

.footer-manual {
    float: right;
    padding: 3px;
}

/* OpenLayers overrides */
.olControlAttribution {
    font-size: smaller;
    left: 10px;
    bottom: 0.5em;
    position: absolute;
    display: block;
    text-shadow: -1px -1px 0 #ccc, 1px -1px 0 #ccc, -1px 1px 0 #ccc, 1px 1px 0 #ccc;
}

.verticalLine {
    position: absolute;
    background-color: #DADADA;
    border-style: solid;
    border-width: 0.1em;
    border-color: #848484;
}

/* IGVT overrides */

.x-toolbar {
    padding: 3px 0 3px 8px;
}

.layerTree-mod .x-tab-bar .x-tab-bar-body .x-box-inner {
    height: 42px !important;
    /* Default value is 21, we add 20 = 41 */
}

.layerTree-mod .x-tab-bar .x-tab-bar-body .x-box-inner .x-tab {
    height: 42px !important;
    /* Default value is 21, we add 20 = 41 */
}

.layerTree-mod .x-tab-bar .x-tab-bar-body .x-box-inner .x-tab {
    line-height: 38px;
}

.layerTree-mod .x-tab-bar .x-tab-bar-body .x-box-inner .x-tab .x-tab-wrap {
    display: inline-block;
}

.layerTree-mod .x-grid-header-ct {
    border: 1px solid #157fcc;
}

.layerTree-mod .x-toolbar-docked-bottom {
    border-top: 1px solid #157fcc !important;
}

.client-color-picker .x-color-picker-item {
    width: 48px !important;
    height: 48px !important;
}

.client-color-picker .x-color-picker-item-inner {
    line-height: 40px !important;
}

.icon-statistical-report-large {
    background-image: url("../img/dzs/statistic_icon_large.png");
}

.icon-statistical-report-medium {
    background-image: url("../img/dzs/statistic_icon_medium.png");
    background-repeat: no-repeat
}

.icon-statistical-report-small {
    background-image: url("../img/dzs/statistic_icon_small.png");
}

.icon-charts-small {
    background-image: url(../img/dzs/chart_icon_small.png);
    background-repeat: no-repeat;
}

.icon-charts-medium {
    background-image: url(../img/dzs/chart_icon_medium.png);
    background-repeat: no-repeat;
}

.icon-charts-large {
    background-image: url(../img/dzs/chart_icon_large.png);
    background-repeat: no-repeat;
}

.initialLoading {
    background-image: url(../img/igvt/loader.gif);
    float: right;
    right: 50%;
    bottom: 50%;
    width: 80px;
    height: 40px;
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
}

.md_logo {
    float: left;
}

.md_logo img {
    padding-right: 5px;
    border-right: 1px solid #000;
}

.dzs_logo {
    padding: 10px 5px;
    float: left;
}

.icon-yearbutton-btn {
	background-color: none !important;
	border: none !important;
	margin: 0px;
	background: transparent !important;
}

.icon-timeseries-start-btn {
	background-color: #ffffff !important;
  	border: none !important;
    top: 0px;
    margin: 0px;
    background: transparent !important;
	background-image: url(../img/dzs/start_btn.png) !important;
}

.x-slider-thumb {
	background-image: url(../img/dzs/slider_thumb.png) !important;
	z-index: 100;
}

.year-slider + .x-slider {
	margin-top: 23px;
}

.year-control-toolbar .x-box-inner {
	overflow-x: auto;
	scrollbar-width: thin;  /* Firefox */
    scrollbar-color: #157FCC transparent;  /* Firefox */
}

.year-control-toolbar .x-box-inner::-webkit-scrollbar {
	width: 5px;
	height: 5px;
}

.year-control-toolbar .x-box-inner::-webkit-scrollbar-thumb {
	background-color: #157FCC;
    border-radius: 10px;
    border: transparent;
}

.year-control-toolbar .x-box-inner::-webkit-scrollbar-track {
	background: transparent;
}

.graph-permalink-icon {
    background-image: url(../img/dzs/graph_permalink_icon.svg);
    background-size: 100% 115%;
    background-position: 0% 0% !important;
    background-repeat: no-repeat;
    width: 45px !important;
}

.hide-pyramid-filter-background {
    background-image: url(../img/dzs/right-arrow.svg);
    background-size: 100% 115%;
    background-position: 0% 0% !important;
    background-repeat: no-repeat;
}
.hide-pyramid-filter-button {
	background: transparent;
	border: transparent;
}

.hide-pyramid-filter-button-transform {
	transform: rotate(180deg);
}

.dockedItems > span[id="dockedItems-outerCt"] > div[id="dockedItems-innerCt"] {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex!important;
  flex-wrap: wrap!important;
  align-items: center !important;
}

div[id="timestamp-buttons"] .timestamp-button span[class="x-btn-inner x-btn-inner-left"] {
	text-overflow: ellipsis;
    max-width: 95%;
    white-space: nowrap;
    overflow: hidden;
}

.active-timestamp-button {
  	background-color: white;
  	background-image: none;
  	.x-btn-inner {
  	 	color: #3892d3 !important;
  	 }
}