html, body, #map-canvas {
        margin: 0;
        padding: 0;
      }

/* Panneau des objets ajoutés */
      #added-objects-container {
        background: #eee;
        font-size: 11px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
        z-index: 3;
      }
      #added-objects-panel {
        background: #fff;
        font-size: 11px;
        font-family: Arial;
//        border: 1px solid #ccc;
//        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
        max-height: 450px;
        overflow-y: auto;
//        max-width: 360px;
//        overflow-x: hidden;
      }
      #trash-added-objects-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #eee url('../../../images/iconePoubelleeee.png') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #close-added-objects-bt {
        width: 18px;
        height: 18px;
        background: #eee url('../../../images/croixeee.png') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
        cursor:pointer;
      }
      #open-added-objects-bt {
        width: 18px;
        height: 18px;
        background: #eee url('../../../images/carreeee.png') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
        cursor:pointer;
      }
      #added-objects-bt, #added-objects-btlb  {cursor:pointer; }

      #added-boats-container, #added-places-container, #added-itinaries-container, #added-forecast-areas-container {
        background: #bbb;
        font-size: 11px;
        font-family: Arial;
      }
      #added-boats-panel, #added-places-panel, #added-itinaries-panel, #added-forecast-areas-panel {
        background: #fff;
        width: 100%;
        max-height: 125px;
        overflow-y: auto;
        font-size: 11px;
        font-family: Arial;
      }
      #trash-added-boats-bt, #trash-added-places-bt, #trash-added-itinaries-bt, #trash-added-forecast-areas-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #bbb url('../../../images/iconePoubellebbb.png') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #close-added-boats-bt, #close-added-places-bt, #close-added-itinaries-bt, #close-added-forecast-areas-bt {
        width: 18px;
        height: 18px;
        background: #bbb url('../../../images/croixbbb.png') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
//        border-radius:5px;
        cursor:pointer;
      }
      #open-added-boats-bt, #open-added-places-bt, #open-added-itinaries-bt, #open-added-forecast-areas-bt  {
        width: 18px;
        height: 18px;
        border:solid 0px #fdfdfd;
//        border-radius:5px;
        background: #bbb url('../../../images/carrebbb.png') no-repeat scroll 3px center;
        cursor:pointer;
      }
      #add-boat-bt, #add-place-bt, #add-itinary-bt, #add-forecast-area-bt, #add-forecast-area-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #bbb url('../../../images/plusbbb.png') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #added-boats-bt, #added-places-bt, #added-itinaries-bt, #added-forecast-areas-bt,
      #added-boats-btlb, #added-places-btlb, #added-itinaries-btlb, #added-forecast-areas-btlb {cursor:pointer; }

/* Panneau des historiques */
      #history-container {
        background: #eee;
        max-height: 350px;
        overflow-y: auto;
        max-width: 350px;
        overflow-x: hidden;
        font-size: 11px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
        z-index: 3;
        display: none;
      }
      #trash-history-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #eee url('../../../images/iconePoubelle.gif') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #close-history-bt {
        width: 18px;
        height: 18px;
        background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
        border-radius:5px;
        cursor:pointer;
      }
      #history-panel {
        background: #fff;
        font-size: 11px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #history-bt {cursor:pointer; }          #history-btlb {cursor:pointer; }

      #photo-history {
        background: #6cc;
        max-height: 180px;
        overflow-y: auto;
        font-size: 11px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #trash-photo-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #6cc url('../../../images/iconePoubelle.gif') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #photo-panel {
        background: #fff;
        width: 100%;
        font-size: 11px;
        font-family: Arial;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #photo-bt {cursor:pointer; }            #photo-btlb {cursor:pointer; }

      #weather-history {
        background: #6cc;
        max-height: 180px;
        overflow-y: auto;
        font-size: 11px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #trash-weather-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #6cc url('../../../images/iconePoubelle.gif') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #weather-panel {
        background: #fff;
        width: 100%;
        font-size: 11px;
        font-family: Arial;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #weather-bt {cursor:pointer; }          #weather-btlb {cursor:pointer; }

      #mark-history {
        background: #6cc;
        max-height: 180px;
        overflow-y: auto;
        font-size: 11px;
        font-family: Arial;
        border: 1px solid #ccc;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #trash-mark-bt {
        width: 18px;
        height: 18px;
        border:solid 0px grey;
        background: #6cc url('../../../images/iconePoubelle.gif') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #mark-panel {
        background: #fff;
        width: 100%;
        font-size: 11px;
        font-family: Arial;
        box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
      }
      #mark-bt {cursor:pointer; }             #mark-btlb {cursor:pointer; }


/* Boutons remove */
      #cross-bt {
        width: 18px;
        height: 18px;
        background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
        cursor:pointer;
        border:solid 0px #fdfdfd;
        border-radius:5px;
        visibility: hidden;
        display: none;
      }
      #cross2-bt {
        width: 18px;
        height: 18px;
        background: #fdfdfd url('../../../images/croix.gif') no-repeat scroll 3px center;
        cursor:pointer;
        border:solid 0px #f8f8f8;
        border-radius:5px;
        visibility: hidden;
        display: none;
      }

/* panneaux de control */
    #controls {
        border: 0px solid #999;
        background: #eee;
    }
    #tools_controls {
      border: 1px solid #999;
      background: #eee;
      padding-bottom: 3px;
    }
    #tools_controls input, label {
      cursor: pointer;
    }
    #tools_box {
      border-left: 1px solid #888;
      border-bottom: 1px solid #888;
      border-right: 1px solid #888;
      padding: 1px;
      padding-bottom: 3px;
      background: #fdfdfd;
      position:relative;
      left:5px;
    }
   #history-tools {
      border-left: 1px solid #9e9;
      border-bottom: 1px solid #9e9;
      border-right: 1px solid #9e9;
      background: #f8f8f8;
      visibility: hidden;
      display: none;
      padding: 1px;
    }
    #marks-tools, #routing-tools, #polar-tools {
/*
      border-left: 1px solid #9e9;
      border-bottom: 1px solid #9e9;
      border-right: 1px solid #9e9;
*/
      background: #f8f8f8;
      padding: 1px;
    }

    #mark-container {
      border-left: 1px solid #9e9;
      border-bottom: 1px solid #9e9;
      border-right: 1px solid #9e9;
      background: #f8f8f8;
      padding: 1px;
      visibility: hidden;
      display: none;
    }
    #mark-datas {
/*
      background:#66cccc;
*/
      border: 1px solid #b7ffb7;
      border-left: 1px solid #cfffcf;
      border-top: 1px solid #cfffcf;
      background: #fdfdfd;
    }

    #mark-container label {
      font-size:10pt;
      font-family:"Arial","sans-serif";
    }

    #mark-datas input{
      text-align:center;
/*
      background:#66cccc;
      border:solid 2px #88eeee;
      border-left: 2px solid #229999;
      border-top: 2px solid #229999;
*/
      font-size:10pt;
      font-family:"Arial","sans-serif";
      color:black;
    }
    #mark-edit-box {
      border-left: 1px solid #afffaf;
      border-bottom: 1px solid #afffaf;
      border-right: 1px solid #afffaf;
      background: #fdfdfd;
    }


#remove-map2D-bt {
   width: 18px;
   height: 18px;
   background: #fdfdfd url('../../../images/croix.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 1px #f8f8f8;
   border-radius:5px;
}
#update-map2D-bt {
   width: 18px;
   height: 18px;
   background: #fdfdfd url('../../../images/actualiser.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 1px #f8f8f8;
   border-radius:5px;
}

#2Dmap-window {
   z-index: 2;
}

    #map2D-datas input{
      text-align:center;
      background:#66cccc;
      border:solid 2px #88eeee;
      border-left: 2px solid #229999;
      border-top: 2px solid #229999;
      font-size:10pt;
      font-family:"Arial","sans-serif";
      color:black;
      font-weight:bold;
    }

    #boat_controls {
      border: 1px solid #999;
      padding-bottom: 3px;
    }
    #boat_controls li {
      list-style: none;
    }
    #boat-tools {
      border-left: 1px solid #888;
      border-bottom: 1px solid #888;
      border-right: 1px solid #888;
      background: #fdfdfd;
      padding: 1px;
    }

    #boat-tools input, label {
      cursor: pointer;
    }

    #display_controls {
      border: 1px solid #999;
      background: #fdfdfd;
      display: inline;
      font-size: 12px;
      font-family: Arial,sans-serif;
      color: black;
      padding: 5px;
    }
    #display_controls li{
      list-style: none;
      display: inline;
    }
    #boat-show-cb { cursor: pointer; } #boat-show-cblb { cursor: pointer; }
    #photo-cb { cursor: pointer; } #photo-cblb { cursor: pointer; }
    #weather-cb { cursor: pointer; } #weather-cblb { cursor: pointer; }
    #cloud-cb { cursor: pointer; } #cloud-cblb { cursor: pointer; }
    #wind-cb { cursor: pointer; } #wind-cblb { cursor: pointer; }
    #isobar-cb { cursor: pointer; } #isobar-cblb { cursor: pointer; }
    #cloud-li {
      visibility: hidden;
      display: none;
      padding: 3px;
      border-top: 1px solid #9e9;
      border-bottom: 1px solid #9e9;
      border-right: 1px solid #9e9;
      background: #f8f8f8;
    }
   #weather-source, #wind-scale, #wind-meshing, #isobar-spacing, #weather-date{
      font-size: 11px;
      font-family: Arial,sans-serif;
      cursor: pointer;
   }
   #weather-date-previous {
     width: 13px;
     height: 13px;
     background: #FAFAFA url('../../../images/insertBeforefafafa.png') no-repeat scroll 1px center;
     cursor:pointer;
     border:solid 0px #fdfdfd;
   }
   #weather-date-next {
     width: 13px;
     height: 13px;
     background: #FAFAFA url('../../../images/insertAfterfafafa.png') no-repeat scroll 1px center;
     cursor:pointer;
     border:solid 0px #fdfdfd;
   }

/* Menu contextuel bateaux */
#boat-menu {
   background:#fdfdfd;
   border-left: 2px solid  #9e9;
   border-bottom: 2px solid  #9e9;
   border-right:2px solid  #9e9;
   border-top: 2px solid  #9e9;
   padding: 3px;
   font-size: 12px;
   font-family: Arial,sans-serif;
   color: black;
   display: none;
   visibility:hidden;
}
#boat-menu label, input, select{
   font-size: 14px;
   font-family: Arial,sans-serif;
   cursor: pointer;
}
#boat-menu select{
   border: 0px;
   border-top: 1px solid  #9e9;
}
#boat-menu-name{
   border:0px;
   background:#66CCCC;
   font-weight:bold;
}
#boat-menu-ebox{
      border-left: 1px solid #afffaf;
      border-bottom: 1px solid #afffaf;
      background: #f8f8f8;
      padding: 1px;
      position:relative;
      left:5px;
}
#boat-menu-hide-bt {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}
#boat-menu-remove-bt {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/iconePoubelleeee.png') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}


/* Menu contextuel itineraires */
#itinary-menu {
   background:#fdfdfd;
   border-left: 2px solid  #9e9;
   border-bottom: 2px solid  #9e9;
   border-right:2px solid  #9e9;
   border-top: 2px solid  #9e9;
   padding: 3px;
   font-size: 12px;
   font-family: Arial,sans-serif;
   color: black;
   display: none;
   visibility:hidden;
}
#itinary-menu label, input, select{
   font-size: 14px;
   font-family: Arial,sans-serif;
   cursor: pointer;
}
#itinary-menu select{
   border: 0px;
   border-top: 1px solid  #9e9;
}
#itinary-menu-title, #itinary-menu-name, #itinary-submenu-anchor, #itinary-submenu-anchor-name{
   border:0px;
   background:#66CCCC;
}
#itinary-menu-name, #itinary-submenu-anchor-name{
   font-weight:bold;
}
#itinary-menu-hide-bt {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}
#itinary-menu-remove-bt, #itinary-submenu-remove-bt {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/iconePoubelleeee.png') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}
#itinary-submenu-insert-bt {
   width: 18px;
   height: 18px;
   background: #F8F8F8 url('../../../images/insertAfter.png') no-repeat scroll 1px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}

/* Help window  */
#help-window {
   background: #f8f8f8;
   border: 1px solid #ccc;
   box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
   max-height: 250px;
   overflow-y: auto;
   max-width: 500px;
   overflow-x: auto;
   position:absolute;
   left:160px;
   top:58px;
   display: none;
   visible: hidden;
   z-index: 4;
}
#help-message {
   max-height: 220px;
   overflow-y: auto;
   max-width: 500px;
   overflow-x: auto;
   font-size: 18px;
   font-family: Arial,sans-serif;
}
#help-abort {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}

/* Param window  */
#param-window {
   background: #f8f8f8;
   border: 1px solid #ccc;
   box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
   max-height: 250px;
   overflow-y: auto;
   max-width: 500px;
   overflow-x: auto;
   position:absolute;
   left:160px;
   top:58px;
   display: none;
   visible: hidden;
   z-index: 4;
}
#param-abort {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}
#param-valid {
   width: 18px;
   height: 18px;
   background: #f8f8f8 url('../../../images/actualiser.gif') no-repeat scroll 3px center;
   cursor:pointer;
   border:solid 0px #fdfdfd;
   border-radius:5px;
}


#puce_boat {
  width:12px;
  height:12px;
  border-radius: 12px;
  margin:1px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 2px rgba(0,0,0,0.5);
}

#puce_place {
  width:12px;
  height:12px;
  margin:1px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 2px rgba(0,0,0,0.5);
}

#puce_itinary {
  width:16px;
  height:4px;
  margin:1px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 2px rgba(0,0,0,0.5);
}


/* Measure window  */
#measure-container {
   max-width: 465px;
   overflow-x: auto;
   font-size:8pt;font-family:"Arial","sans-serif"; font-weight:bold;
   color:black; background:#eee;
   display:none;
}
#measure-tools {
   font-size:7pt;font-family:"Arial","sans-serif";
   color:black; background:#ddd;
   display:none;
}
#measure-tools option {
   font-size:7pt;font-family:"Arial","sans-serif";
   color:black; background:#FFFF55;   //ligth green(editable) #55FF55 or light yellow(not editable) #FFFF55;
}
#measure-tools select {
   font-size:7pt;font-family:"Arial","sans-serif";
   color:black; background:#FFFF55;   //ligth green(editable) #55FF55 or light yellow(not editable) #FFFF55;
}
#measure-close-tools-bt{
        width: 18px;
        height: 18px;
        background: #eee url('../../../images/croixeee.png') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
        cursor:pointer;
      }
#measure-panel {
   max-height: 150px;
   overflow-y: auto;
   border-left:solid 1px #9e9;
   border-bottom:solid 1px #9e9;
   border-right:solid 1px #9e9;
   background:#bbb;
}
#anchors-view {
   font-size:7pt;font-family:"Arial","sans-serif";
   color:black;
}
#anchors-view input {
   font-size:7pt;font-family:"Arial","sans-serif";
}
#anchors-view-titles {
   font-weight:bold;
}
#anchor-remove-bt {
   width: 12px;
   height: 18px;
   border:solid 0px grey;
   cursor:pointer;
   background: #FFFFFF url('../../../images/iconePoubelleeee.png') no-repeat scroll 1px center;
}
#anchor-removeDark-bt {
   width: 12px;
   height: 18px;
   border:solid 0px grey;
   cursor:pointer;
   background: #FAFAFA url('../../../images/iconePoubelleeee.png') no-repeat scroll 1px center;
}
#anchor-insertBeforeFirst-bt {
   width: 13px;
   height: 13px;
   border:solid 0px grey;
   cursor:pointer;
   background: #BBBBBB url('../../../images/insertBeforeFirst.png') no-repeat scroll 1px center;
}
#anchor-insertAfter-bt {
   width: 13px;
   height: 13px;
   border:solid 0px grey;
   cursor:pointer;
   background: #FFFFFF url('../../../images/insertAfter.png') no-repeat scroll 1px center;
}
#anchor-insertAfterDark-bt {
   width: 13px;
   height: 13px;
   border:solid 0px grey;
   cursor:pointer;
   background: #FAFAFA url('../../../images/insertAfterfafafa.png') no-repeat scroll 1px center;
}
#anchor-name-tx {
   cursor: text;
   height=10px;
}
#anchor-edit-bt {
   width:11px;height:11px;
   cursor:pointer;
}

      #measure-link-bt {
        width: 13px;
        height: 13px;
        border:solid 0px grey;
        background: #eee url('../../../images/linkeee.png') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #measure-tools-bt {
        width: 13px;
        height: 13px;
        border:solid 0px grey;
        background: #eee url('../../../images/toolseee.png') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #measure-reset-bt {
        width: 12px;
        height: 15px;
        border:solid 0px grey;
        background: #bbb url('../../../images/iconePoubellebbb.png') no-repeat scroll 1px center;
        cursor:pointer;
      }
      #measure-close-bt {
        width: 13px;
        height: 13px;
        background: #eee url('../../../images/croixeee.png') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
        cursor:pointer;
      }
      #measure-open-bt {
        width: 13px;
        height: 13px;
        background: #eee url('../../../images/carreeee.png') no-repeat scroll 3px center;
        border:solid 0px #fdfdfd;
        cursor:pointer;
      }

/* Menu contextuel bateaux */
#polar-view-menu {
	background:#fdfdfd;
	border-left: 2px solid  #9e9;
	border-bottom: 2px solid  #9e9;
	border-right:2px solid  #9e9;
	border-top: 2px solid  #9e9;
	padding: 3px;
	font-size: 12px;
	font-family: Arial;
	color: black;
	display: none;
	visibility:hidden;
}
#polar-view-menu label, input, select{
	font-size: 12px;
	font-family: Arial;
	cursor: pointer;
}
#polar-view-menu select{
	border: 0px;
/*	border-top: 1px solid  #9e9;*/
}
#polar-view-menu-name{
	border:0px;
	background:#66CCCC;
	font-weight:bold;
	font-size: 14px;
}
#polar-view-menu-hide-bt {
	width: 18px;
	height: 18px;
	background: #f8f8f8 url('../../../images/croix.gif') no-repeat scroll 3px center;
	cursor:pointer;
	border:solid 0px #fdfdfd;
	border-radius:5px;
}
#polar-view-menu-remove-bt {
	width: 18px;
	height: 18px;
	background: #f8f8f8 url('../../../images/iconePoubelleeee.png') no-repeat scroll 3px center;
	cursor:pointer;
	border:solid 0px #fdfdfd;
	border-radius:5px;
}
#polar-view-menu-duplicate-bt {
	width: 18px;
	height: 18px;
	background: #f8f8f8 url('../../../images/iconeDuplicPolar.png') no-repeat scroll 3px center;
	cursor:pointer;
	border:solid 0px #fdfdfd;
	border-radius:5px;
}