All z-indexes found in css files have been moved into css
variables. If the z-index is used only once, the variable
name will be the same as the selector it is used in. If
the z-index is used multiple times, then the plain name
of $zindex# was used. This allowed a more confident
moving down of the toolbar so that the new modal dialog,
with z-index 500, could display on top of it.

#1436

Previously the z-index was introduced in order to have the avatar
visible on top of the black video element, but now we're always hiding
the video element when the avatar is displayed, so it's no longer
required.

For small window sizes and many video thumbnails the message may go on
top of the thumbnails.

Renames 'videoConnectionMessage' to 'localConnectionMessage', because
it is displayed when we're having problems with our local connection
and a different one will be shown for the remote connectivity issues.

Grey filter will be applied to the remote video/avatar displayed on
"large" and a message indicating remote connectivity issues will be
shown on top of that.

The video or the avatar on a thumbnail will be displayed in greyscale
when the user is having connectivity issues.