#navigationTableButtonContainer {
       width:            220px;
       height:           100px;
       display:          inline-block;
       position:         absolute; bottom: 10px; right: 18px;
       z-index:          10500;
       background-color: white;
       border:           1px;
       border-style:     solid;
       border-color:     blue;
       border-radius:    20px;
   }

   #navigationTableButton {
       background-image:    url("./logos/matrix/frontpage_600x250.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       width:               220px;
       height:              100px;
       background-color:    transparent;  /* BCC6CC !CCFF99! */
       position:            relative;
       display:             inline-block;
       border-radius:       20px;
   }

   #navigationTableButton:hover {
       border:           8px;
       border-style:     solid;
       border-color:     #CCFF99;
   }

   #navigationTableContainer {
       width:         1200px;
       height:        auto;
       min-height:    350px;
       display:       none;
       position:      relative;
       margin-left:   auto;
       margin-right:  auto;
       border:        8px;
       border-style:  solid;
       border-color:  #CCFF99;
       z-index:       11000;
   }

   .navigationTable {
       width:           1200px;
       height:          400px;
       border:          12px;
       border-style:    solid;
       border-color:    #A9A9A9;
       empty-cells:     show;
       position:        relative;
       margin-top:      0px;
       margin-left:     0px;
   }
   table.navigationTable th {
       height:          auto;
       font-size:       180%;
       border:          12px;
       border-style:    solid;
       border-color:    #A9A9A9;
       padding:         2px;
   }
   table.navigationTable tr {
       border:          12px;
       border-style:    solid;
       border-color:    #A9A9A9;
       padding:         2px;
   }
   table.navigationTable td {
       width:            282px;
       height:           200px;
       border:           12px;
       border-style:     solid;
       border-color:     #A9A9A9;
       padding:          2px;
       background-color: white;
       text-align:       center;
       font-size:        110%;
       vertical-align:   middle;
       position:         relative;
       background-clip:  padding-box;
   }

   table.navigationTable td:hover {
       border:          14px solid;
       border-color:    #2C2CA0;
       text-align:      center;
   }

   p.navigationElementText {
      font-size:        130%;
      font-weight:      bold;
      font-family:      "Arial";
      color:            black;
      margin-top:       3px;
      display:          inline-block;
   }

   p.navigationElementTextHome {
      font-size:        130%;
      font-weight:      bold;
      font-family:      "Arial";
      color:            black;
      margin-top:       3px;
      margin-left:      30px;
      margin-right:     30px;
      display:          inline-block;
   }

   .android p.navigationElementTextHome {
      font-size:        130%;
      font-weight:      bold;
      font-family:      "Arial";
      color:            black;
      margin-top:       3px;
      margin-left:      30px;
      margin-right:     30px;
      display:          inline-block;
   }

   p.navGrey {
      font-size:        110%;
      font-weight:      bold;
      font-family:      "Arial";
      color:            #A9A9A9;
      margin-top:       3px;
      display:          inline-block;
   }

   .navigationElementTable {
       width:           282px;
       height:          200px;
       border:          none;
       padding:         0px;
       empty-cells:     show;
       position:        relative;
       margin-top:      5px;
       margin-left:     0px;
       margin-right:    0px;
   }
   table.navigationElementTable th {
       height:          auto;
       font-size:       180%;
       border:          none;
   }
   table.navigationElementTable tr {
       border:          none;
       margin-left:     0px;
       margin-right:    0px;
   }
   table.navigationElementTable td.titleContainer {
       width:            282px;
       height:           50px;
       border:           none;
       padding:          0px;
       background-color: white;
       text-align:       center;
       font-size:        130%;
       vertical-align:   top;
       position:         relative;
       background-clip:  padding-box;
       margin-left:      0px;
       margin-right:     0px;
    }
   table.navigationElementTable td:hover {
       border:          none;
   }

   table.navigationElementTable td.nationalMapContainer {
       background-image:    url("./logos/matrix/test.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               282px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.personalItineraryContainer {
       background-image:    url("./logos/matrix/itinerary2_664x404.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.randomItineraryContainer {
       background-image:    url("./logos/matrix/random_and_experts_only_1.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.expertItineraryContainer {
       background-image:    url("./logos/matrix/expert_only_352x196.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.airportMeteogramContainer {
       background-image:    url("./logos/matrix/meteorogram1_840x316.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.hubMeteogramContainer {
       background-image:    url("./logos/matrix/hubtest1_801x497.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.forecastTrendsContainer {
       background-image:    url("./logos/matrix/trend_graphic_720x360.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }

   table.navigationElementTable td.homeContainer {
       background-image:    url("./logos/matrix/frontpage_600x361.png");
       background-size:     100% 100%;
       background-repeat:   no-repeat;
       background-position: center;
       border:              none;
       width:               300px;
       height:              auto;
       padding:             0px;
       text-align:          center;
       vertical-align:      middle;
       position:            relative;
       background-clip:     padding-box;
       margin-left:         0px;
       margin-right:        0px;
   }