/**********  iotamaps.css  **********/

  /***  Compress with:  http://www.csscompressor.com/  using "Highest" setting ***/

  /***  or http://css.github.io/csso/csso.html  ***/
  /***  or https://cssminifier.com/  ***/


  /*  When using special characters in your CSS, codes should be written like "\2731".
      The backslash must be there or it won't render the character.
  */



  /* Main texts */
  @font-face {
    font-family: 'Source Sans Pro';
    src: url('../gfonts/source-sans-pro/sourcesanspro-regular-webfont.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    letter-spacing:0.0em;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'Source Sans Pro Bold';
    src: url('../gfonts/source-sans-pro/sourcesanspro-bold-webfont.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    letter-spacing:0.0em;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'Source Sans Pro Italic';
    src: url('../gfonts/source-sans-pro/sourcesanspro-italic-webfont.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'Source Sans Pro Light';
    src: url('../gfonts/source-sans-pro/sourcesanspro-light-webfont.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    font-kerning: normal;
  }


  @font-face {
    font-family: 'PT Sans';
    src: url('../gfonts/pt-sans/ptsans-regular-webfont.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    letter-spacing:0.0em;
    font-display: swap;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'PT Sans Bold';
    src: url('../gfonts/pt-sans/ptsans-bold-webfont.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'PT Sans Italic';
    src: url('../gfonts/pt-sans/ptsans-italic-webfont.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
    letter-spacing:0.0em;
    font-display: swap;
    font-kerning: normal;
  }




  /* For a couple of highlighted sections, and the old plot-antenna.py plots */
  @font-face {
    font-family: 'Open Sans';
    src: url('../gfonts/open-sans/OpenSans-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    letter-spacing:0.0em;
    font-display: swap;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'Open Sans Light';
    src: url('../gfonts/open-sans/OpenSans-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    letter-spacing:0.0em;
    font-display: swap;
    font-kerning: normal;
  }
  @font-face {
    font-family: 'Open Sans Bold';
    src: url('../gfonts/open-sans/OpenSans-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    letter-spacing:0.0em;
    font-display: swap;
    font-kerning: normal;
  }



  * {
    /* So 100% means 100% */
    /* box-sizing: border-box; */
  }

  /* Include padding and border in all elements' total width and height */
  * {
    font-family: 'PT Sans', 'Source Sans Pro', Helvetica, Verdana, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-kerning: normal;
    letter-spacing:0;
    color: #000;
    box-sizing: border-box;
  }


  body {
    background-color: #f8f8f8;
    font-family: 'PT Sans', 'Source Sans Pro', Helvetica, Verdana, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    border: 0px;
    margin: 0px;
    padding: 0px;
    width: 100%;     /* Minimize content layout shift */
    height: 100%;     /* Minimize content layout shift */
    /*overflow-y: scroll; */
    cursor: default;
    user-select: none;
    /* display: flex; */
  }
  body.waitcur *, body.waitcur {
    cursor:progress !important;
  }

  p, div.extras {
    /* font-family: "Open Sans"; */
    font-size: 1.1em;
    line-height: 1.35em;
    text-align:justify;
    border: 0 solid #ccc;
    margin:0 0 20px;
  }
  p.pg-hdr {
    font-family: Montserrat;
    font-size: 1.3em;
    color: #006;
    text-align: center;
    margin: 20px 0 10px;
    border-bottom: 1px solid #ccc;
  }

  h1, h2, h3, h4, h5 {
    font-family: Montserrat;
    font-weight: 400;
    color: #5674B9;               /* #003471; */
    margin:40px 0 5px;
  }
  h1 {
    font-size: 1.4em;
  }
  h2 {
    font-size: 1.3em;
  }
  h3 {
    font-size: 1.2em;
  }
  h4 {
    font-size: 1.1em;
  }
  h5 {
    font-size: 1.0em;
  }

  a {
    /*font-family: "Open Sans";
    line-height: 1.35em;*/
    font-size: inherit;
    text-decoration: none;
    font-weight: 500;
    color: #5674B9;
  }
  a:link {
    color: #5674B9;
  }
  a:visited {
    color: #5674B9;
  }
  a:active {
    color: #5674B9;
  }
  a:hover {
    color: #5674B9;
    text-decoration: underline;
  }

  .catLink {
    font-size: 1em;
    font-weight: normal;
    text-decoration: none;
    color: #0054A6;
  }
  .catLink:link {
    color: #0054A6;
  }
  .catLink:visited {
    color: #0054A6;
  }
  .catLink:active {
    color: #0054A6;
  }
  .catLink:hover {
    color: #003363;
    text-decoration: underline;
  }


  ul {
    /* font-family: "Open Sans";
    font-size:1em; */
    font-size: inherit;
    text-align:left;
    margin:3px 0 0 0;
    padding-left:30px;
  }
  ul li {
    margin-top:5px;
    /*padding:0;*/
  }

  input.uppercase { text-transform: uppercase; }

  span.hint-link {
    font-weight: 500;
    font-style: italic;
    color: #5674B9;
    text-decoration: none;
  }
  span.hint-link:hover {
    text-decoration: underline;
  }


  img.info-src {
    /*  Newer version of the old "?" info graphic, now as a blue-on-white image
        of a Unicode "Circled Information Source" (🛈) character........  */
    content: url('../grafx/info_src_char_160.png');
    max-width: 14px !important;
    max-height: 14px !important;
    vertical-align: -2px;
    cursor:pointer;
    display:inline;
  }


  /* Page header */
  #divPageHdr {
    background:#fff url('../grafx/iotamaps_hdr_100.png') 10px 0 no-repeat;
    background-size:110px;
    color: blue;
    font-family: Montserrat, 'PT Sans', 'Source Sans Pro', Helvetica, Verdana, Arial, sans-serif;
    font-size: 1.4em;
    font-weight: bold;
    font-style: italic;
    height:67px;
    padding:37px 0 0 140px;   /* To get the title in line with the text in the graphic */
    border-bottom:1px solid #666;
  }
  #divPageHdr span {
    color: #000;
    font-family: inherit;
    font-size: 0.95em;
    font-weight: normal;
    font-style: inherit;
  }
  #divPageHdrMenu {
    background-color:#004dab;
    color: #fff;
    text-align: center;
    height:20px;
    border-bottom: 1px solid #002653;
    box-shadow: 0 3px 4px rgba(0,0,0,0.3);
    z-index: 999;
  }
  #divPageHdrSpacer {
    width:100%;
    height:35px;
    border:0 solid blue;
  }



  /* Page main container */
  #divMainContainer {
    background-color:#fff;
    font-size: inherit;
    min-width: 600px;
    max-width: 1000px;
    min-height: 800px;
    padding: 30px 40px;
    margin: 0 auto 0 auto;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    overflow-y: none;
    z-index: 0;
    /* height:110%;
    min-height:700px; */
  }
  #divPageFooter {
    background-color: #000;
    /* background: linear-gradient(#333, #000); */
    color:#fff;
    height:79px;
    border-top:0 solid #888;
  }



  /*  #header {
    width: 100%;
    min-width:1100px;
    height:137px;
    background:#818181 url('../grafx/grey_hdr_bkg.png') repeat-x 0 0;
    border-bottom:1px solid #AAAAAA;
    clear: both;
  } */

  /*  #footer {
    width: 100%;
    clear: both;
    height:30px;
    border-top:1px solid #AAA;
    margin:0;
  }  */
  /*  #footer-content {
    width: 100%;
    font-size: 87%;
    color: #666;
    text-align:center;
    margin:5px 0;
  } */


  #tdTopHeader {
    /* background: #fff url('../grafx/iotamaps_hdr_100.png') 10px 0 no-repeat;
    background-size: 100px; */
    background-color:#BDE1FF;
    font-family: Montserrat, 'PT Sans', 'Source Sans Pro', Helvetica, Verdana, Arial, sans-serif;
    font-size: 1.4em;
    font-weight: bold;
    font-style: italic;
    color: #004DBA;
    height: /*60px*/ 30px;
    /*padding: 0 0 4px 150px;*/
    padding: 0 0 4px 10px;
    /* border-bottom: 1px solid #aaa; */
  }
  #tdTopHeader span {
    color: #000;
    font-family: inherit;
    font-size: 0.95em;
    font-weight: normal;
    font-style: inherit;
  }
  .top-controls-inner {
    background-color:#8cf;
    color:black;
    min-height:10px;
    padding:5px 0 3px;
    border-top:1px solid #666;
    border-bottom:1px solid #333;

  }
  #tdMain {
    /* height:650px; */

  }
  #tdFooter {
    background-color: #000;
    /* background: linear-gradient(#333, #000); */
    color:#fff;
    /* height:40px; */
    border-top:1px solid #888;
  }

  .bold {
    font-size: inherit;
    font-weight: bold;
  }
  .italic {
    font-size: inherit;
    font-style: italic;
  }
  .bold-italic {
    font-size: inherit;
    font-weight: bold;
    font-style: italic;
  }
  .grp-ttip-hdr {
    background-color: #88ccff;
    margin: 0 0 2px;
    padding: 1px 4px;
    border-bottom: 1px solid #36ACFF;
  }
  .grp-boundary-label {
    /* For the IOTA Group rectangle text, like 'EU-026' */
    color: #3cf;
    font-family: Roboto, 'PT Sans', 'Source Sans Pro', Helvetica, Verdana, Arial, sans-serif;
    font-weight: 600;
    /* letter-spacing: 0.1em; */
    font-kerning: normal;
    text-shadow:  /*2px 2px 2px #000, */  /* Drop shadow, plus 1px stroke all round... */
                  -1px -1px 0.5px #026,
                  1px  -1px 0.5px #026,
                  -1px  1px 0.5px #026,
                  1px   1px 0.5px #026;
  }
  .locator-grid-label {
    /* This is a div - For the Maidenhead locator grid texts */
    /*color: #003471;*/
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    /*border:3px solid red;*/
    opacity: 0.4;
    position: absolute;
  }

  /* .island-icon {
    background-color:transparent;
    background-image:url('../grafx/island_marker.png');
    background-repeat:no-repeat;
    width:24px;
    height:30px;
  } */
  .island-ttip-hdr {
    background-color: #FFC13D;
    margin: 0 0 2px;
    padding: 1px 4px;
    border-bottom: 1px solid #C78E00;
  }

  /* Disable Leaflet's default marker image requests
     - doesn't seem to work, however............... */
  .leaflet-marker-icon,
  .leaflet-marker-shadow {
    background-image: none !important;
  }



   /* Control: Display zoom level */
  .ctrl-imp-zoom-level {
    background: #fff url('../grafx/zoom_21.png') 1px 5px no-repeat;
    text-align: left;
    width:55px;
    height:30px;
    min-height:30px;
  }

   /* Control: Mapbox logos
  .ctrl-mapbox-logo-light {
    background: transparent url('../grafx/mapbox/mapbox-logo-white.png') 0 0 no-repeat;
    background-size: 133px;
    text-align: left;
    width:138px;
    height:34px;
    min-height:30px;
    border:0;
  }
  .ctrl-mapbox-logo-dark {
    background: transparent url('../grafx/mapbox/mapbox-logo-black.png') 0 0 no-repeat;
    background-size: 133px;
    text-align: left;
    width:138px;
    height:34px;
    min-height:30px;
    border:0;
  } */

  .imp-logo-ctrl {
    background: transparent;
    position: absolute;
    top: -30px;
    right: -4px;     /* But 10px will be added to this from one of "leaflet-bar leaflet-control leaflet-control-custom" */
    /*transform: translate(50%, 0%);*/
    width: 120px;
  }
  .pos-display-ctrl {
    background: #fff;
    font-family: Arial,Helvetica,sans-serif;
    line-height: 1em;
    padding: 2px 4px;
    position: absolute;
    top: 0;
    left: 42px;     /* But 10px will be added to this from one of "leaflet-bar leaflet-control leaflet-control-custom" */
    /*transform: translate(50%, 0%);*/
    width: 210px;
  }
  .pos-display-ctrl div {
    font-size: 0.9em;
  }
  .pos-display-ctrl div span {
    font-size: 0.9em;
  }

  .layers-ctrl-overlay {
    background-color: #eee;
    width: 75%;
    padding: 0 2px;
    display:inline-block;
  }
  .layers-ctrl-overlay:hover {
    background-color: #cdf;
  }

  /* .latlng-grid-label {
    font-family: 'Tahoma, Arial, Helvetica, sans-serif';
    font-size: '10px';
    font-weight: 'bold';
    opacity: '0.6';
    text-align: 'right';
    white-space: 'nowrap';
  }  */


  /* Custom control to show/hide user-guide dialogs */
  .ctrl-map-dlgs {
    background-color: #fff;
    color: #333;
    width: 85px;
    height: 35px !important;
    margin: 10px 12px 0 0 !important;
    padding: 0;
    border-radius: 5px;
    cursor: pointer;
  }
  #ctrlMapDialogsPicker {
    background: #fff url('../grafx/arrow-down.png') 64px 15px no-repeat;
    /*line-height: 10px;*/
    width: 82px;
    height: 32px !important;
    max-height: 32px !important;
  }
  #ctrlMapDialogsPicker:hover {
    background-color: #f4f4f4;
  }

  .user-guide-container {
    color: #000;
    font-size: 1em;
    height: 330px;
    padding: 3px 5px;
    overflow-y: auto;
  }
  .user-guide-container p {
    color: #000;
    font-size: 0.95em;
    margin: 5px 0;
  }
  .user-guide-container ul {
    margin-top: 10px;
    padding-left: 20px;
  }
  .user-guide-container ul li {
    color: #000;
    font-size: 0.95em;
  }

  .user-guide-main-header {   /* This is a h3 */
    text-align: center;
    margin: 10px 10px;
    border-bottom: 1px solid #5674B9;

  }
  .user-guide-sub-header {   /* This is a h5 */
    margin-top: 30px;

  }
  .user-guide-bottom-spacer {
    height: 50px;
  }







  .drop-shadow1 {
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.4);
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.4);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.4);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=120, Color='#444444')";
  }

  .drop-shadow2 {
    -moz-box-shadow: 2px 2px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.5);
    box-shadow: 2px 2px 3px rgba(0,0,0,0.5);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=120, Color='#555555')";
  }
  .drop-shadow2-light {
    /* For map controls */
    -moz-box-shadow: 1px 2px 2px rgba(0,0,0,0.15);
    -webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.15);
    box-shadow: 1px 2px 2px rgba(0,0,0,0.15);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=120, Color='#aaaaaa')";
  }
  .drop-shadow2-medium {
    /* For map controls */
    -moz-box-shadow: 1px 2px 2px rgba(0,0,0,0.3);
    -webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.3);
    box-shadow: 1px 2px 2px rgba(0,0,0,0.3);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=120, Color='#aaaaaa')";
  }

  .drop-shadow4 {
    -moz-box-shadow: 4px 4px 6px rgba(0,0,0,0.5);
    -webkit-box-shadow: 4px 4px 6px rgba(0,0,0,0.5);
    box-shadow: 4px 4px 6px rgba(0,0,0,0.5);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#555555')";
  }


  .drop-shadow1-medium {
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=120, Color='#777777')";
  }

  .dlg-shadow {
    -moz-box-shadow: 3px 3px 12px rgba(0,0,0,0.7);
    -webkit-box-shadow: 3px 3px 12px rgba(0,0,0,0.7);
    box-shadow: 3px 3px 12px rgba(0,0,0,0.7);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#555555')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#555555');
  }

  .dlg-shadow-light {
    -moz-box-shadow: 1px 1px 8px rgba(0,0,0,0.4);
    -webkit-box-shadow: 1px 1px 8px rgba(0,0,0,0.4);
    box-shadow: 1px 1px 8px rgba(0,0,0,0.4);
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#555555')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, Color='#555555');
  }


  .tv-table {
    background-color:white;
    font-size:0.9em;
    width:100%;
    margin:20px 0px;
  }
  .tv-table td {
    text-align:left;
    vertical-align:top;
    padding:3px 8px;
    border-bottom:1px solid #d8d8d8;
  }
  .tv-table-tr-header {
    background-color:#BEDCFE;
    font-weight:bold;
    color:#007;
  }
  .tv-table-tr-header td {
    padding:6px 8px 3px;
    border-top:1px solid #bbb;
    border-bottom:1px solid #bbb;
    vertical-align:bottom;
  }
  .tv-table-tr-odd {
    background-color:white;
    /* cursor:pointer; */
  }
  .tv-table-tr-odd:hover {
    background-color:#deeaf1;
  }
  .tv-table-tr-even {
    background-color:#F0F0F0;
    /* cursor:pointer; */
  }
  .tv-table-tr-even:hover {
    background-color:#deeaf1;
  }
  .tv-table-tr-chosen {
    background-color:#83C5EC;
    cursor:pointer;
  }
  .tv-table-tr-chosen:hover {
    background-color:#83C5EC;
  }

  .roundedCorners8 {
    -moz-border-radius:8px;    /* Firefox */
    -webkit-border-radius:8px; /* Safari and chrome */
    -khtml-border-radius:8px;  /* Linux browsers */
    border-radius:8px;         /* CSS3 */
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .roundedCorners4 {
    -moz-border-radius:4px;    /* Firefox */
    -webkit-border-radius:4px; /* Safari and chrome */
    -khtml-border-radius:4px;  /* Linux browsers */
    border-radius:4px;         /* CSS3 */
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .roundedCorners4-title {
    background: #8c8c8c url('../grafx/dlg_title_bar_grey_30_60.png') top repeat-x;
    font-weight:bold;
    text-shadow: 1px 1px 0 #666;
    height:22px;
    color:white;
    margin:0;
    padding:0 0 0 3px;
    /* Only apply radius to top of this 'title bar' */
    -moz-border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    -khtml-border-radius:4px 4px 0 0;  /* Linux browsers */
    border-radius: 4px 4px 0 0;
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .roundedCorners4-footer {
    background-color: #ccc;
    padding:4px 4px 6px;
    /* Only apply radius to bottom of this div */
    -moz-border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -khtml-border-radius:0 0 4px 4px;  /* Linux browsers */
    border-radius: 0 0 4px 4px;
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .roundedCorners4-block-hdr {
    /* Only apply radius to top of this 'header bar' */
    -moz-border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    -khtml-border-radius:4px 4px 0 0;  /* Linux browsers */
    border-radius: 4px 4px 0 0;
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .roundedCorners4-block-footer {
    /* Only apply radius to top of this 'header bar' */
    -moz-border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    -khtml-border-radius:4px 4px 0 0;  /* Linux browsers */
    border-radius: 4px 4px 0 0;
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }


  .roundedCorners3 {
    -moz-border-radius:3px;    /* Firefox */
    -webkit-border-radius:3px; /* Safari and chrome */
    -khtml-border-radius:3px;  /* Linux browsers */
    border-radius:3px;         /* CSS3 */
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .roundedCorners2 {
    -moz-border-radius:2px;    /* Firefox */
    -webkit-border-radius:2px; /* Safari and chrome */
    -khtml-border-radius:2px;  /* Linux browsers */
    border-radius:2px;         /* CSS3 */
    behavior: url('/css/border-radius.htc');  /* M$ IE crap hack - path in url behaves differently than for other file types */
  }

  .map-ctrl-main {
    background-color: #fff;
    font-weight: 400;
  }
  .map-ctrl-main:hover, .map-ctrl-main-chosen:hover {
    background-color: #ebebeb;
  }
  .map-ctrl-main-chosen {
    font-weight: 500;
  }

  /* For Position options controls... */
  .pos-option-header {
    background-color: #f6f6f6;
    color:#00a;
    cursor:default;
  }
  .pos-option {
    background-color: #f6f6f6;
    color:#666;
  }
  .pos-option:hover {
    background-color: #ebebeb;
  }
  .pos-option-header td {
    padding:5px 0 0 8px;
    border-bottom:1px solid #ddd;
  }
  .pos-option td {
    padding-left:15px;
  }
  .display-pos {
    /* font-family: Monaco, Consolas, "Lucida Console","Andale Mono", AndaleMono, "Courier New", monospace; */
    font-size: 1em;
  }
  .locator-infobox-text {
    font-family: Monaco, Consolas, 'Lucida Console', 'Andale Mono', AndaleMono, 'Courier New', monospace;
    font-weight:bold;
    color:#600;
    opacity:0.5;
  }

  /* For OpenStreetMaps / OpenCycleMaps controls... */
  .osm-street {
    background-color: white;
    color:#666;
  }
  .osm-cycle-header {
    background-color: #f6f6f6;
    color:#00a;
  }
  .osm-cycle {
    background-color: #f6f6f6;
    color:#666;
  }
  .osm-street:hover, .osm-cycle:hover {
    background-color: #ebebeb;
  }
  .osm-cycle-header td {
    padding:5px 0 0 8px;
    border-bottom:1px solid #ddd;
  }
  .osm-cycle td {
    padding-left:15px;
  }

  .list-hdr-blue, .list-hdr-red-italic {
    /* font-family: "Helvetica Neue", HelveticaNeue, "TeX Gyre Heros", TeXGyreHeros, FreeSans, "Nimbus Sans L", "Liberation Sans", Arimo, Helvetica, Arial, sans-serif; */
    font-weight:600;
  }
  .list-hdr-blue {
    color:#00a;
    font-style:normal;
  }
  .list-hdr-red-italic {
    color:#a00;
    font-style:italic;
  }

  .gm-tooltip {
    position:absolute;
    padding: 1px;
    border: 1px solid gray;
    font-size: 10px;
    font-family: Verdana;
    background-color: #fff;
    white-space: nowrap;
  }

  .ui-tooltip {   /* Base CSS class for the jQuery tooltip */
    padding:0px;
    border:0px;
    font-size:0.9em;
    -moz-box-shadow: 3px 3px 4px rgba(0,0,0,0.5);  /* x, y, blur, (spread,) color */
    -webkit-box-shadow: 3px 3px 4px rgba(0,0,0,0.5);
    box-shadow: 3px 3px 4px rgba(0,0,0,0.5);
  }

  .ui-ttip-noshadow {   /* Custom CSS class for the jQuery tooltip */
    padding:0px;
    border:0px;
    font-size:0.9em;
    -moz-box-shadow: 0 0 0 #888;  /* x, y, blur, (spread,) color */
    -webkit-box-shadow: 0 0 0 #888;
    box-shadow: 0 0 0 #888;
  }

  .ttip-std {   /* Main menu tooltip */
    background-color:white;
    padding:2px 4px;
    border:1px solid #888;
    font-size:0.9em;
    z-index:99999;
  }

  /* Users online popup */
  .ttip-uinfo {
    background-color:#f0f0f0;
    /* border:1px solid #333 !important; */
    width:204px;
    padding:6px;
    z-index:1;
  }
  .users-online-popup {
    border:1px solid #888 !important;
  }
  .users-online-popup-table {
    width:202px;
    padding:0;
    color:white;
    font-size:0.8em;
  }
  .users-online-popup-table thead tr {
    background-color:#5674B9;
  }
  .users-online-popup-table thead tr th {
    border-bottom: 1px solid #003471;
  }



  /* Search results table */
  .search-results-row, .search-results-row-chosen {
    background-color: #fff;
    color: #000;
    cursor: pointer;
  }
  .search-results-row-chosen {
    background-color: #A1DCFF;
    color: #000;
    cursor: pointer;
  }
  .search-results-row:hover, .search-results-row-chosen:hover {
    background-color: #deeaf1;
  }



  .x-close-btn {
    /* background-color: #f00; */
    background-image: url('../grafx/close_btn_flat.png');
    background-size: 15px;
    background-position: 0px 0px;
    background-repeat: no-repeat;
    width: 15px;
    height: 15px;
    margin: 1px 1px 0 0;
    cursor: default;
  }
  .x-close-btn:hover {
    background-image: url('../grafx/close_btn_flat_red.png');
  }

  .txt-shadow1 {
    text-shadow: 1px 1px 0 #000;
  }

  /* Format group islands dialog headers table */
  #divIOTAGroupHeaders table tr td {
    font-size: 0.9em;
  }
  #divIOTAGroupHeaders table tr td span {
    font-size: inherit;
  }
  #tblIslandsListing tr td {
    font-size: 0.9em;
  }

  #divUsersOnline {
    background: #fff url('../grafx/visitors.png') 4px 3px no-repeat;
    width: 45px;
    margin: 2px 5px 2px 25px;
    border: 1px solid #ccc;
    padding: 5px 8px;
  }
  #spanUsersOnline {
    font-weight: bold;
    color: #00a;
  }

  #divSearchDialog * {
    font-size: 0.99em;
  }

  #divPopupMainSettings * {
    font-size: 0.99em;
  }

  #divAdminGroupIslandsDataDlg * {
    font-size: 0.99em;
  }



  .top-menu-btn {
    background-color: transparent;
    border:1px solid transparent;
    width:30px;
  }
  .top-menu-btn-hilite {
    background-color: #e0e0e0;
    border: 1px solid #bbb;
  }
  #divSearch, #divHamburger {
    width:40px;
    padding:2px 0;
    cursor:pointer;
  }
  #divSearch {
    margin:2px 1px 2px 30px;
  }
  #divSearch:hover {
    background-color: #e0e0e0;
    border: 1px solid #bbb;
  }
  #divHamburger {
    background: transparent url('../grafx/hamburger.png') no-repeat;
    background-position: 9px 1px;
    margin:2px 10px 2px 0px;
  }
  #divHamburger:hover {
    background-color: #9EEBFF;
    border: 1px solid #10647A;
  }

  /* .menu-popup-show {
    width: 300px;
    height: 400px;
    transition: width 0.5s, height 0.5s;
    -moz-transition: width 0.5s, height 0.5s;
    -webkit-transition: width 0.5s, height 0.5s;
    -o-transition: width 0.5s, height 0.5s;
  }

  .menu-popup-hide {
    width: 0;
    height: 0;
    transition: width 0.5s, height 0.5s;
    -moz-transition: width 0.5s, height 0.5s;
    -webkit-transition: width 0.5s, height 0.5s;
    -o-transition: width 0.5s, height 0.5s;
  }  */

  /* Main menu */
  .menu-top-border {
    background: transparent url('../grafx/dropdown_menu_top_border.png') -180px 0 no-repeat;
    height:20px;
    margin-top:-13px;
    border:0 solid red;
  }
  .menu-shadow {
    -moz-box-shadow: 0 0 4px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.3);
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
  }
  .menu-item {
    background-color: #fff;
    height: 30px;
    margin: 0 8px 2px;
    padding: 0px 10px 5px 10px;
    line-height: 30px;
    border: 1px solid #fff;
  }
  .menu-item:hover {
    background-color: #f0f0f0;
    border:1px solid #d0d0d0;
  }
  .menu-item-icon {
    background-image: url('../grafx/menu_sprites.png');
    background-repeat: no-repeat;
    width: 30px;
    height: 30px;
    float: left;
    margin-right: 15px;
    overflow:hidden;
  }
  .menu-item-small {
    background-color: #e8e8e8;
    text-align: center;
    height: 50px;
    width: 93px;
    float: left;
    margin: 3px 0;
    padding: 7px 0;
    line-height: 30px;
    border: 1px solid #e8e8e8;
  }
  .menu-item-small:hover {
    background-color: #dbdbdb;
    border:1px solid #bbb;
  }
  .menu-item-small-icon {
    /* background-color:#fff; */
    background-image: url('../grafx/menu_sprites.png');
    background-repeat: no-repeat;
    width: 30px;
    height: 30px;
    margin: 0 32px;
    overflow:hidden;
  }


  #divContactForm {
    background-color: white;
    font-family: "Open Sans";
    border: 0;
    width: 650px;
    padding: 0;
    margin: 20px 0 30px;
    border: 0 solid #aaa;

  }

  /*  For the help dialog  */
  .help-dlg-title {
    background: #8c8c8c url('../grafx/dlg_title_bar_grey_30_60.png') top repeat-x;
    font-weight:bold;
    text-shadow: 1px 1px 0 #666;
    height:22px;
    color:white;
    margin:0;
    padding:0 0 0 3px;
  }
  ul.help-main {
    color:#008;
    margin:3px 0 8px 0;
    padding-left:25px;
  }
  ul.help-main li {
    margin-top:5px;
  }
  ul.help-sub {
    font-size:1em;
    /*color:black;*/
    text-align:left;
    margin:3px 20px 0 0;
    padding-left:25px;
  }
  ul.help-sub li {
    margin-top:5px;
    /*padding:0;*/
  }

  .charfix {
    /* Use this class for special characters, like smilies... */
    font-size:160%;
    line-height:0;
  }
  .charfix-140 {
    /* Use this class for special characters, like smilies... */
    font-size:140%;
    line-height:0;
  }

  .islandsListRow {
    cursor:pointer;
  }

  .infobox-wiki-extract {
    margin:0;
    padding:0 2px;
    cursor:pointer;
  }
  .infobox-wiki-extract a {
    color:#000;
    text-decoration: none;
  }
  .infobox-wiki-extract a:hover {
    color:#006;
  }


  /* BEGIN Navigation Tabs */
  .md-tab-container {
    height:18px;
    border-bottom:1px solid #aaa;
    overflow:hidden;
  }
  .md-tab {  /*  .md-tab is a <ol>  */
    overflow:hidden;
    padding:0;
    margin:0 1px;
    left:0px;
    list-style-type: none;
  }
  .md-tab li {
    margin-right:3px;
    float:left;
    list-style-type:none;
    font-size:0.9em;
  }
  .md-tab li a {
    background-color:#aaa;
    color:#fff;
    font-size:100%;
    font-weight:normal;
    text-decoration:none;
    /* Begin rounded corners */
    -moz-border-radius:4px;    /* Firefox */
    -webkit-border-radius:4px; /* Safari and chrome */
    -khtml-border-radius:4px;  /* Linux browsers */
    border-radius:4px;         /* CSS3 */
    /* End rounded corners */
    border:1px solid #888;
    padding:2px 9px;
    height:30px;
    display:block;
  }
  /* .md-tab li a:link {
    color:#fff;
  }
  .md-tab li a:visited {
    color:#fff;
  }
  .md-tab li a:active {
    color:#fff;
  } */
  .md-tab li a:hover {
    background-color:#bbb;
    border:1px solid #666;
    color:#fff;
  }
  .md-tab li.current a {
    background-color:#02269b;
    color:#fff;
    font-size:100%;
    text-decoration:none;
    border:1px solid #aaa;
    display:block;
  }
  /* .md-tab li.current a:link {
    color:#fff;
  }
  .md-tab li.current a:visited {
    color:#fff;
  }
  .md-tab li.current a:active {
    color:#fff;
  } */
  .md-tab li.current a:hover {
    background-color:#001c79;
    color:#fff;
  }
  /* END Navigation Tabs */


  #tdToolBarLeft {
    /*  width: 420px;
    height: 100%;
    background-color: #fff;
    display: table-cell;
    border-right: 6px double #666;  */    /* resize-handle */
  }
  #tdToolBarRight {    /* Not used */
    width: 0;
    height: 100%;
    background-color: #faa;
    display: none;
    border-left: 5px double #888;   /* resize-handle */
  }
  .ui-resizable-helper { border: 2px dotted #00F; }

  .userInputText {
     font-size:0.9em;
     border:1px inset #E0E0E0;
  }
  .userInputSelect {
     font-size:0.9em;
     border:1px inset #E0E0E0;
  }

  div.navLink {
    text-decoration: none;
    font-weight: normal;
    color: #00376D;
    display:inline;
    border:0px solid red;
    cursor:pointer;

  }
  div.navLink:link {
    color: #00376D;
  }
  div.navLink:visited {
    color: #0054A6;
  }
  div.navLink:active {
    color: #0054A6;
  }
  div.navLink:hover {
    color: #0054A6;
    text-decoration: none;
  }

  /* Bottom menu */
  .bot-menu-link {
    color: #7DBCFF;
    font-family: Montserrat;
    font-size: 0.8em;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-decoration: none;
    cursor:pointer;
  }
  .bot-menu-link:link {
    color: #fff;
  }
  .bot-menu-link:visited {
    color: #333;
  }
  .bot-menu-link:active {
    color: #a00;
  }
  .bot-menu-link:hover {
    color: #fff;
    text-decoration: none;
  }

  .highlighted-border {
    border-width:1px;
    border-style: solid;
    border-color:#999 #777 #555 #aaa;
  }
  .highlighted-border-light {
    border-width:1px;
    border-style: solid;
    border-color:#ccc #666 #666 #ccc;
  }


  .admin-group-islands-list {
    /* Enable user-selection of 'background' texts */
    -webkit-touch-callout: text;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
  }

  /* These for when using the group islands admin dialog */
  .leaflet-grab {
    cursor: auto;
  }
  .leaflet-dragging .leaflet-grab{
    cursor: move;
  }

  /* Fix for misaligned or wide layers control */
  .leaflet-control-layers {
    width: auto !important;
  }
  a.leaflet-control-layers-toggle {
    width: 40px;
  }
  /* .leaflet-control-layers.leaflet-control {
    width: 40px;
  } */
  .leaflet-control-layers-list {
    margin: 0;
    padding: 5px 10px;
    display: block;
    max-width: 180px !important;
    white-space: normal !important;
  }

  .leaflet-control-layers-selector {
    display: inline-block;
    margin-right: 6px;
  }

  .leaflet-control-layers-base label,
  .leaflet-control-layers-overlays label {
    display: block;
    line-height: 1.4em;  /**/
  }

  .leaflet-container.crosshair-cursor-enabled {
    cursor:crosshair;
  }

  .leaflet-tooltip {
    padding: 3px !important;
  }




/**********  EOF  **********/