/*MAPA */
.directions li span.arrow {
  display:inline-block;
  min-width:28px;
  min-height:28px;
  background-position:0px;
  background-image: url("https://developer.here.com/apiexplorer-v2-sample-data/template-web-two-box/examples/map-with-route-from-a-to-b/img/arrows.png");
  position:relative;
  top:8px;
}
.directions li span.depart  {
  background-position:-28px;
}
.directions li span.rightUTurn  {
  background-position:-56px;
}
.directions li span.leftUTurn  {
  background-position:-84px;
}
.directions li span.rightFork  {
  background-position:-112px;
}
.directions li span.leftFork  {
  background-position:-140px;
}
.directions li span.rightMerge  {
  background-position:-112px;
}
.directions li span.leftMerge  {
  background-position:-140px;
}
.directions li span.slightRightTurn  {
  background-position:-168px;
}
.directions li span.slightLeftTurn{
  background-position:-196px;
}
.directions li span.rightTurn  {
  background-position:-224px;
}
.directions li span.leftTurn{
  background-position:-252px;
}
.directions li span.sharpRightTurn  {
  background-position:-280px;
}
.directions li span.sharpLeftTurn{
  background-position:-308px;
}
.directions li span.rightRoundaboutExit1 {
  background-position:-616px;
}
.directions li span.rightRoundaboutExit2 {
  background-position:-644px;
}

.directions li span.rightRoundaboutExit3 {
  background-position:-672px;
}

.directions li span.rightRoundaboutExit4 {
  background-position:-700px;
}

.directions li span.rightRoundaboutPass {
  background-position:-700px;
}

.directions li span.rightRoundaboutExit5 {
  background-position:-728px;
}
.directions li span.rightRoundaboutExit6 {
  background-position:-756px;
}
.directions li span.rightRoundaboutExit7 {
  background-position:-784px;
}
.directions li span.rightRoundaboutExit8 {
  background-position:-812px;
}
.directions li span.rightRoundaboutExit9 {
  background-position:-840px;
}
.directions li span.rightRoundaboutExit10 {
  background-position:-868px;
}
.directions li span.rightRoundaboutExit11 {
  background-position:896px;
}
.directions li span.rightRoundaboutExit12 {
  background-position:924px;
}
.directions li span.leftRoundaboutExit1  {
  background-position:-952px;
}
.directions li span.leftRoundaboutExit2  {
  background-position:-980px;
}
.directions li span.leftRoundaboutExit3  {
  background-position:-1008px;
}
.directions li span.leftRoundaboutExit4  {
  background-position:-1036px;
}
.directions li span.leftRoundaboutPass {
  background-position:1036px;
}
.directions li span.leftRoundaboutExit5  {
  background-position:-1064px;
}
.directions li span.leftRoundaboutExit6  {
  background-position:-1092px;
}
.directions li span.leftRoundaboutExit7  {
  background-position:-1120px;
}
.directions li span.leftRoundaboutExit8  {
  background-position:-1148px;
}
.directions li span.leftRoundaboutExit9  {
  background-position:-1176px;
}
.directions li span.leftRoundaboutExit10  {
  background-position:-1204px;
}
.directions li span.leftRoundaboutExit11  {
  background-position:-1232px;
}
.directions li span.leftRoundaboutExit12  {
  background-position:-1260px;
}
.directions li span.arrive  {
  background-position:-1288px;
}
.directions li span.leftRamp  {
  background-position:-392px;
}
.directions li span.rightRamp  {
  background-position:-420px;
}
.directions li span.leftExit  {
  background-position:-448px;
}
.directions li span.rightExit  {
  background-position:-476px;
}

.directions li span.ferry  {
  background-position:-1316px;
}

/* MAPA */

/*#map
{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: grey;
    z-index: 0;
}*/

.container-map
{
  background-color: transparent;
  height: 100%;
  z-index: 0;
}

#map
{
  height: 100%;
  width: 100%;
  background-color: transparent;

}

/*#panel
{
    position: absolute;
    width: 30%;
    height: 100%;
    left: 70%;
    background-color: #DCE1DC;
    overflow: auto;
    text-align: justify;
    z-index: 0;
}
*/


