/* voor */
#glyph-v1 { left: 58%; top: 25.5%; }
#glyph-v2 { left: 32%; top: 19%; }
#glyph-v3 { left: 75%; top: 55%; }

   /* midden */
#glyph-m1  { left: 55%; top:  7.5%; }
#glyph-m2  { left: 85%; top:   19%; }

#glyph-m3  { left:  4.5%; top:   31%; }
#glyph-m4  { left:   32%; top: 27.5%; }
#glyph-m5  { left:   12%; top:   45%; }
#glyph-m6  { left:   39%; top:   42%; }
#glyph-m7  { left:   66%; top:   37%; }
#glyph-m8  { left:    5%; top: 58.5%; }
#glyph-m9  { left:   31%; top: 58.5%; }
#glyph-m10 { left: 56.5%; top: 58.5%; }

#glyph-m11 { left:    8%; top:   75%; }
#glyph-m12 { left:    4%; top:   62.5%; }
#glyph-m13 { left:   59%; top:   23%; }
#glyph-m14 { left:   72%; top: 49.5%; }

   /* achter */
#glyph-a1 { left: 40%; top: 37%; }
#glyph-a2 { left: 61%; top: 40%; }
#glyph-a3 { left: 18%; top: 59%; }
#glyph-a4 { left: 28%; top: 52%; }

   /* map header + map section + map footer = 719px -- sync this with @media rule in overlay.css */
@media screen and (orientation: landscape) and (max-width: 1280px) and (max-height: 719px)
{
      /* voor */
   #glyph-v1 { top: 16%; }
   #glyph-v2 { top:  8%; }
   #glyph-v3 { top: 60%; }

      /* midden */
   #glyph-m1  { top:  7%; }
   #glyph-m2  { top: 20%; }

   #glyph-m3  { top: 37%; }
   #glyph-m4  { top: 34%; }
   #glyph-m5  { top: 57%; }
   #glyph-m6  { top: 54%; }
   #glyph-m7  { top: 52%; }
   #glyph-m8  { top: 77%; }
   #glyph-m9  { left: 29%; top: 77%; }
   #glyph-m10 { left: 53%; top: 82%; }

   #glyph-m11 { top: 91%; }
   #glyph-m12 { top: 84%; }
   #glyph-m13 { top: 32%; }
   #glyph-m14 { top: 70%; }
   
      /* achter */
   #glyph-a1 { top: 35%; }
   #glyph-a2 { top: 40%; }
   #glyph-a3 { top: 65%; }
}