@font-face {
    font-family: 'webOfficeFlexJS';
    font-style: normal;
    font-weight: normal;
    src: url('../../fonts/WebOfficeFlexJS.woff2') format('woff2'),
    url('../../fonts/WebOfficeFlexJS.woff') format('woff'),
    url('../../fonts/WebOfficeFlexJS.ttf') format('truetype'),
    url('../../fonts/WebOfficeFlexJS.eot#') format('embedded-opentype'),
    url('../../fonts/WebOfficeFlexJS.svg#WebOfficeFlexJS') format('svg');
}
.esri-popup__icon{
    height: auto;
    width: auto;
}
.esri-popup__icon.esri-popup__action-image {
    width: 24px;
    height: 24px;
}
.fonticon,
.esri-popup__action .esri-popup__icon {
    font-family: webOfficeFlexJS;
    text-align: center;
}

.row-button .fonticon {
    font-size: 24px;
}

/*
 * .esri-widget-button.esri-widget-button defined twice is no error -
 * makes it more important than single-defined css class without using !important
*/
.fonticon.tool-button, .wo-button > .fonticon, .fonticon.toggle-button, .fonticon.toggler {
    font-size: 3em;
}
.fonticon.button  {
    font-size: 1.6em;
}
.esri-popup__action .esri-popup__icon {
    font-size: 2em;
}
.fonticon.pane-title {
    font-size: 24px;
    padding-right: .2em;
    vertical-align: middle;
}
.fonticon.pane-title.right {
    float: right;
    font-weight: normal;
    padding-right: .1em;
}
.fonticon.pane-title.left {
    float: left;
}
.fonticon.menu  {
    font-size: 2em;
    margin-left: .2em;
    margin-right: .2em;
}


/* character assignment */

/* MAP NAVIGATION ICONS */

.fi-menubtn:before {
    content: "\0030";
}
.fi-zoomin:before {
    content: "\0031";
}
.fi-zoomout:before {
    content: "\0032";
}
.fi-zoomfull:before {
    content: "\0033";
}
.esri-icon-rotate, .esri-icon-pan {
    font-family: webOfficeFlexJS !important;
    font-size: 24px;
}
.fi-compass:before {
    content: "\0059";
}

.fi-geolocation:before, .fi-geolocation-disabled:before {
    content: "\0034";
}
.fi-geolocation.tracking:before, .fi-geolocation-disabled.tracking:before {
    content: "\004B";
}

.esri-icon-locate .esri-icon {
    font-size: 2em;
}
.esri-icon-pan:before {
    content: "\0035";
}
.esri-icon-rotate:before {
    content: "\0036";
}
.tool-buttonChecked .fi-sceneview:before {
    content: "\0037";
}
.fi-sceneview:before {
    content: "\0038";
}

.fi-2d:before {
    content: "\0037";
}

/* MAP COMPONENTS ICONS */

.fi-repmodels:before {
    content: "\0061";
}
.fi-basemaps:before {
    content: "\0062";
}
.fi-geobookmarks:before {
    content: "\0063";
}
.fi-projectswitch:before {
    content: "\0064";
}
.fi-static-legend:before {
    content: "\0065";
}


/* TOOL ICONS */

.fi-language:before {
    content: "\0070";
}
.fi-clear-selection:before {
    content: "\0071";
}
.fi-print:before, .fi-esriprint:before, .fi-download-print:before {
    content: "\0072";
}
.fi-help:before, .fi-download-help:before, .fi-context-help:before {
    content: "\0073";
}
.fi-identify:before {
    content: "\0074";
}
.fi-email:before {
    content: "\0075";
}
.fi-meetingpoint:before{
    content: "\0076";
}
.fi-measurepolygon:before{
    content: "\0078";
}
.fi-measureline:before{
    content: "\0077";
}
.fi-measurepoint:before{
    content: "\00C3"
}
.fi-mapinfo:before{
    content: "\0079";
}
.fi-maptip:before{
    content: "\0041";
}
.fi-query-get-hierarchy:before {
    content: "\005E";
}
.fi-coordsearch:before{
    content: "\007A";
}
.fi-modules:before{
    content: "\007C";
}
.fi-customtool:before{
    content: "\007E";
}
.fi-select-line:before {
    content: "\00A2";
}
.fi-select-polygon:before {
    content: "\00A3";
}
.fi-favorites:before {
    content: "\00A1";
}
.fi-edit:before {
    content: "\00B3";
}
.fi-markup:before {
    content: "\00D2";
}
.fi-markup-text:before {
    content: "\00D5";
}
.fi-markup-circle:before {
    content: "\00D6";
}
.fi-markup-point:before {
    content: "\00D7";
}
.fi-markup-line:before {
    content: "\00D8";
}
.fi-markup-polygon:before {
    content: "\00D9";
}
.fi-geojson:before {
    content: "\00DA"
}
/* CONTEXT/SUB MENU ICONS */

.fi-zoom-to:before {
    content: "\0041";
}
.fi-downloads:before {
    content: "\0042";
}
.fi-epaper:before, .fi-download-epaper:before{
    content: "\0043";
}
.fi-rasterchoice:before {
    content: "\0044";
}
.fi-filterquery-reset:before{
    content: "\0045";
}
.fi-neighbour:before{
    content: "\0046";
}
.fi-center:before {
    content: "\0047";
}
.fi-scale:before {
    content: "\0048";
}
.fi-edit-list:before {
    content: "\00B5";
}
.fi-edit-edit:before {
    content: "\00B6";
}
.fi-edit-selected:before {
    content: "\00B7";
}
.fi-edit-unselected:before {
    content: "\00B8";
}
.fi-multihit-extapp:before {
    content: "\00A0";
}
/* MISC ICONS */

.fi-querylist:before {
    content: "\0051";
}
.fi-metadata:before, .fi-download-metadata:before {
    content: "\0052";
}
.fi-toggle-ui:before {
    content: "\0053";
}
.tool-buttonChecked .fi-toggle-ui:before {
    content: "\0054";
}
.fi-minimize:before {
    content: "\0055";
}
.fi-fts-mic:before {
    content: "\0056";

}
.fi-logout:before {
    content: "\0057";
}
.fi-debugtools:before{
    content: "\0058";
}
.dijitArrowButton:before {
    content: "\006f";
    font-family: webOfficeFlexJS;
    font-size: 2em;
    vertical-align: inherit;
}
.fi-relate:before{
    content: "\00B0";
}
.fi-dock:before{
    content:"\00B1";
}
.fi-undock:before{
    content:"\00B2";
}

/* 32px Icons */

.fi-queries:before {
    content: "\0050";
}

.fi-back:before {
    content: "\0069";
}

.fi-fts-query:before {
    content: "\006a";
}

.tool-buttonChecked .fi-queries:before,
.fi-querylist-toggle:before,
.fi-close:before {
    content: "\006b";
}
.togglerChecked .fi-toggle-out:before,
.fi-zoomnext:before,
.fi-next:before,
.fi-result-getsingle:before{
    content: "\006c";
}
.fi-result-backtomulti:before,
.fi-zoomlast:before,
.fi-toggle-out:before,
.fi-prev:before{
    content: "\006d";
}
.fi-query-last:before,
.active-storedqueriescontainer .fi-queryarrow-toggle:before,
.fi-toolform-toggle:before {
    content: "\006e";
}
.fi-queryarrow-toggle:before,
.fi-query-next:before,
.fi-options:before,
.fi-down:before,
.shortcut-actionstack .fi-toolform-toggle:before {
    content: "\006f";
}
.fi-up:before{
    content:"\006e";
}
/* NOT IMPLEMENTED YET */


.fi-legal-info:before {
    content: "\00C4";
}
.fi-value-list:before{
    content: "\0050";
}
.fi-accept:before{
    content: "\005e";
}

.fi-hide:before{
    content: "\005b";
}

/* language Icons */

.fi-lang-hu:before {
    content: "\0039";
}
.fi-lang-bg:before {
    content: "\003a";
}
.fi-lang-fa:before {
    content: "\0021";
}
.fi-lang-ar:before {
    content: "\0022";
}
.fi-lang-ro:before {
    content: "\0023";
}
.fi-lang-ru:before {
    content: "\0024";
}
.fi-lang-tr:before {
    content: "\0025";
}
.fi-lang-it:before {
    content: "\0026";
}
.fi-lang-sk:before {
    content: "\0027";
}
.fi-lang-fr:before {
    content: "\002a";
}
.fi-lang-es:before {
    content: "\002b";
}
.fi-lang-de:before {
    content: "\002e";
}
.fi-lang-en:before {
    content: "\002d";
}
.tool-EDIT .fi-crosshair:before,
.tool-EXTRACT .fi-crosshair:before,
.fi-crosshair-centermark:before {
    content: "\00A4";
}
.tool-MEASURE_POINT .fi-crosshair:before,
.tool-MEASURE_LINE .fi-crosshair:before,
.tool-MEASURE_AREA .fi-crosshair:before {
    content: "\00A9";
}
.tool-MEETINGPOINT .fi-crosshair:before {
    content: "\00A8";
}
.tool-IDENTIFY_LAYER .fi-crosshair:before {
    content: "\00A7";
}
.tool-MARKUP .fi-crosshair:before {
    content: "\00A8";
}
/* snap */
.fi-snap:before {
    content: "\004c";
}
/* draw icons*/
.fi-undo:before {
    content: "\004d";
}
.fi-add-point:before {
    content: "\00B9";
}
.fi-delete-point:before {
    content: "\00BA";
}
.fi-deselect-point:before {
    content: "\00BB";
}
.fi-insertafter-point:before {
    content: "\00BC";
}
.fi-insertbefore-point:before {
    content: "\00BD";
}
.fi-move-point:before {
    content: "\00BE";
}
.fi-select-point:before {
    content: "\00BF";
}
.fi-upload-choose:before {
    content: "\00C0";
}
.fi-upload-cancel:before {
    content: "\00C1";
}
.fi-upload-upload:before {
    content: "\00C2";
}
.fi-extract:before {
    content: "\00D0";
}
.fi-calendar:before {
    content: "\00D1";
}
.fi-font-bold:before {
    content: "\00D3";
}
.fi-font-italic:before {
    content: "\00D4";
}
/* END character assignment */