:root
{
    --tpl-vpadding: calc(20 * var(--cms-factor));
    --tpl-hpadding: calc(40 * var(--cms-factor));
    --tpl-logo-width: calc(200 * var(--cms-factor));
}

@media (max-width: 800px)
{
    :root
    {
        --tpl-vpadding: calc(15 * var(--cms-factor));
        --tpl-hpadding: calc(20 * var(--cms-factor));
        --tpl-logo-width: calc(150 * var(--cms-factor));
    }
}

/* page container */
BODY
{
    BOX-SIZING: border-box;
    DISPLAY: grid;
    GRID-TEMPLATE-ROWS: auto auto 1fr auto;
    MARGIN: 0;
    MIN-HEIGHT: 100vh;
    OVERFLOW-X: clip;
    PADDING: 0 var(--tpl-hpadding);
}

/* background gradient */
BODY:before
{
    BACKGROUND: var(--cms-background);
    CONTENT: "";
    INSET: 0;
    POINTER-EVENTS: none;
    POSITION: fixed;
}

/* header sticky wrapper */
#sticky
{
    GRID-COLUMN: 1 / 2;
    GRID-ROW: 1 / 2;
    LEFT: 0;
    MARGIN: 0 calc(-1 * var(--tpl-hpadding));
    OVERFLOW-X: clip;
    POSITION: sticky;
    RIGHT: 0;
    TOP: 0;
    TRANSITION: transform 0.75s;
    Z-INDEX: 2000;
}

/* class set via javascript */
#sticky:not(:focus-within):not(:hover).minimize
{
    TRANSFORM: translateY(calc(-100% + 10 * var(--cms-factor)));
}

/* page header */
#head
{
    ALIGN-ITEMS: center;
    BOX-SIZING: border-box;
    DISPLAY: flex;
    GAP: calc(20 * var(--cms-factor));
    JUSTIFY-CONTENT: space-between;
    MARGIN: 0 auto;
    MAX-WIDTH: calc(1480 * var(--cms-factor));
    PADDING: var(--tpl-vpadding) var(--tpl-hpadding);
    WIDTH: 100%;
}

#head A
{
    FONT-WEIGHT: 600;
}

/* header background frosted glass effect */
#head:before
{
    BACKDROP-FILTER: blur(calc(7.5 * var(--cms-factor)));
    BACKGROUND: rgba(206, 230, 230, 0.65);
    BOTTOM: 0;
    CONTENT: "";
    LEFT: 50%;
    POINTER-EVENTS: none;
    POSITION: absolute;
    TOP: 0;
    WIDTH: 100vw;
    TRANSFORM: translateX(-50%);
    Z-INDEX: -1;
}

/* disable link underline in header */
#head A
{
    TEXT-DECORATION: none;
}

/* home link */
#logo
{
    FLEX: 0 0 auto;
    MAX-WIDTH: var(--tpl-logo-width);
    ORDER: 0;
    WIDTH: 100%;
}

/* logo image fills home link width */
#logo > IMG
{
    WIDTH: 100%;
}

/* high resolution / mouse main navigation */
@media (min-width: 801px) and (pointer: fine),
       (min-width: 801px) and (hover: hover)
{
    /* hide unused elements */
    #menu-open,
    #menu-backdrop,
    #menu-close
    {
        DISPLAY: none;
    }

    /* menu container */
    #menu
    {
        FLEX: 1 1 0;
        MARGIN: calc(-5 * var(--cms-factor)) calc(-15 * var(--cms-factor));
        TEXT-ALIGN: right;
    }

    /* general menu list container */
    #menu UL
    {
        LIST-STYLE: none;
        MARGIN: 0;
    }

    /* general menu list item */
    #menu LI
    {
        FONT-SIZE: 1.1em;
        MARGIN: 0;
        TEXT-ALIGN: left;
    }

    /* general menu link */
    #menu A
    {
        COLOR: var(--cms-color);
        DISPLAY: block;
        PADDING: calc(5 * var(--cms-factor)) calc(15 * var(--cms-factor));
    }

    #menu A STRONG
    {
        COLOR: var(--cms-color);
    }

    /* highlight general menu link activity */
    #menu A:hover,
    #menu A:hover STRONG
    {
        COLOR: var(--cms-link-color-alt);
    }

    /* base level menu list item */
    #menu > UL > LI
    {
        DISPLAY: inline-block;
    }

    /* base level menu link */
    #menu > UL > LI > A
    {
        TEXT-TRANSFORM: uppercase;
    }

    /* highlight base level active menu link */
    #menu > UL > LI:has(> A.active):after,
    #menu > UL > LI:hover:after
    {
        BACKGROUND: var(--cms-color);
        BOTTOM: 0;
        CONTENT: "";
        HEIGHT: calc(2.5 * var(--cms-factor));
        LEFT: calc(15 * var(--cms-factor));
        POINTER-EVENTS: none;
        POSITION: absolute;
        RIGHT: calc(15 * var(--cms-factor));
    }

    /* highlight base level activity of non-selected container */
    #menu > UL > LI:has(> A:not(BUTTON):hover):after
    {
        BACKGROUND: var(--cms-link-color-alt);
    }

    /* 2nd+ level menu list container */
    #menu UL UL
    {
        BACKDROP-FILTER: blur(calc(5 * var(--cms-factor)));
        BACKGROUND: var(--cms-overlay-background);
        LINE-HEIGHT: 115%;
        MAX-WIDTH: calc(300 * var(--cms-factor));
        MIN-WIDTH: 100%;
        POSITION: absolute;
        RIGHT: 0;
        WIDTH: max-content;
        Z-INDEX: 1000;
    }

    #menu UL UL:after
    {
        BACKGROUND: var(--cms-color);
        CONTENT: "";
        HEIGHT: calc(2.5 * var(--cms-factor));
        LEFT: calc(15 * var(--cms-factor));
        POINTER-EVENTS: none;
        POSITION: absolute;
        RIGHT: calc(15 * var(--cms-factor));
        TOP: calc(-2.5 * var(--cms-factor));
    }

    #menu > UL > LI:has(> A:not(BUTTON):hover) UL:after
    {
        BACKGROUND: var(--cms-link-color-alt);
    }

    /* 2nd+ level menu link */
    #menu UL UL A
    {
        DISPLAY: block;
    }

    #menu UL UL A.active:after
    {
        BACKGROUND: var(--cms-color);
        BOTTOM: 0;
        CONTENT: "";
        LEFT: 0;
        POINTER-EVENTS: none;
        POSITION: absolute;
        TOP: 0;
        WIDTH: calc(5 * var(--cms-factor));
    }

    #menu UL UL A.active:hover:after
    {
        BACKGROUND: var(--cms-link-color-alt);
    }

    #menu UL UL LI:first-child > A
    {
        PADDING-TOP: calc(12.5 * var(--cms-factor));
    }

    #menu UL UL LI:first-child > BUTTON:after
    {
        TOP: calc(7.5 * var(--cms-factor));
    }

    #menu UL UL LI:last-child > A
    {
        PADDING-BOTTOM: calc(12.5 * var(--cms-factor));
    }

    #menu UL UL LI:last-child > BUTTON:after
    {
        BOTTOM: calc(7.5 * var(--cms-factor));
    }

    /* put 3rd+ level menu list container on left side */
    #menu UL UL UL
    {
        MIN-WIDTH: 0;
        RIGHT: 100%;
        TOP: 0;
    }

    #menu UL UL LI:not(:first-child) UL
    {
        TOP: calc(-7.5 * var(--cms-factor));
    }

    /* hide 2nd+ menu level */
    #menu LI UL,

    /* hide sub-subsequent item when hovered */
    #menu LI:hover LI UL,
    #menu LI LI:hover LI UL,
    #menu LI LI LI:hover LI UL,
    #menu LI LI LI LI:hover LI UL,
    #menu LI LI LI LI LI:hover LI UL
    {
        OPACITY: 0;
        POINTER-EVENTS: none;
        TRANSITION: opacity 0.5s;
        WILL-CHANGE: opacity;
    }

    /* show focused 2nd+ menu level */
    #menu A:focus ~ UL,
    #menu BUTTON:focus ~ UL,

    /* show 2nd+ menu level that contains focus */
    #menu UL:focus-within,

    /* show subsequent menu item on hover */
    #menu LI:hover UL,
    #menu LI LI:hover UL,
    #menu LI LI LI:hover UL,
    #menu LI LI LI LI:hover UL,
    #menu LI LI LI LI LI:hover UL,
    #menu LI LI LI LI LI LI:hover UL
    {
        OPACITY: 1;
        POINTER-EVENTS: auto;
        TRANSITION: opacity 0.5s;
        Z-INDEX: 1000;
    }

    /* make space for open / close button on right side */
    #menu A:has(+ BUTTON)
    {
        PADDING-RIGHT: calc(35 * var(--cms-factor));
    }

    /* put open / close button on right side */
    #menu BUTTON
    {
        ALL: initial;
        BOTTOM: 0;
        CURSOR: pointer;
        PADDING: 0;
        POSITION: absolute;
        RIGHT: 0;
        TOP: 0;
        WIDTH: calc(35 * var(--cms-factor));
    }

    /* display down-pointing arrow on open / close button */
    #menu BUTTON:after
    {
        BACKGROUND: var(--cms-color);
        CONTENT: "";
        INSET: 0;
        MASK-IMAGE: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 1024'><path fill='black' d='M512 320L320 512 128 320 0 448l320 320 320-320L512 320z'/></svg>");
        MASK-POSITION: center;
        MASK-REPEAT: no-repeat;
        MASK-SIZE: calc(10 * var(--cms-factor));
        POSITION: absolute;
    }

    /* highlight arrow on active open / close button */
    #menu BUTTON:focus:after,
    #menu BUTTON:hover:after
    {
        BACKGROUND-COLOR: var(--cms-link-color-alt);
    }

    /* make space for 2nd+ level open / close button on left side */
    #menu UL UL A:has(+ BUTTON)
    {
        PADDING-LEFT: calc(35 * var(--cms-factor));
        PADDING-RIGHT: calc(15 * var(--cms-factor));
    }

    /* put 2nd+ level open / close button on left side */
    #menu UL UL BUTTON
    {
        LEFT: 0;
        RIGHT: auto;
    }

    /* display left-pointing arrow on 2nd+ level open / close button */
    #menu UL UL BUTTON:after
    {
        BACKGROUND: var(--cms-color-alt);
        MASK-IMAGE: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 1024'><g transform='rotate(90 320 512)'><path fill='black' d='M512 320L320 512 128 320 0 448l320 320 320-320L512 320z'/></g></svg>");
    }

    /* highlight reception link */
    #menu1-ivakFYtk A
    {
        BORDER: calc(2.5 * var(--cms-factor)) dotted var(--cms-color);
    }

    #menu1-ivakFYtk:after
    {
        DISPLAY: none;
    }

    #menu1-ivakFYtk A:hover
    {
        BORDER-COLOR: var(--cms-link-color-alt);
    }

    #menu1-ivakFYtk A.active
    {
        BORDER-STYLE: solid;
    }
}

/* low resolution / touch screen main navigation */
@media (max-width: 800px), (pointer: coarse), (hover: none)
{
    /* overlay that closes the menu */
    #menu-backdrop
    {
        BACKDROP-FILTER: blur(calc(5 * var(--cms-factor)));
        BACKGROUND: var(--cms-overlay-background);
        INSET: 0;
        OPACITY: 0;
        POINTER-EVENTS: none;
        POSITION: fixed;
        TRANSITION: opacity 0.5s;
        WILL-CHANGE: opacity;
        Z-INDEX: 950;
    }

    /* menu open / close button */
    #menu-open,
    #menu-close
    {
        ALL: initial;
        COLOR: var(--cms-button-color);
        CURSOR: pointer;
        FONT-FAMILY: "Entypo";
        FONT-SIZE: calc(40 * var(--cms-factor));
        FONT-WEIGHT: normal;
        HEIGHT: calc(40 * var(--cms-factor));
        LINE-HEIGHT: calc(40 * var(--cms-factor));
        ORDER: 2;
        TEXT-ALIGN: center;
        WIDTH: calc(40 * var(--cms-factor));
    }

    /* menu open button activity */
    #menu-open:hover
    {
        COLOR: var(--cms-button-color-alt);
    }

    /* menu close button */
    #menu-close
    {
        BACKGROUND: var(--cms-button-background);
        RIGHT: calc(15 * var(--cms-factor));
        OPACITY: 0;
        POINTER-EVENTS: none;
        POSITION: fixed;
        TOP: calc(20 * var(--cms-factor));
        TRANSITION: opacity 0.5s;
        WILL-CHANGE: opacity;
        Z-INDEX: 1000;
    }

    /* menu close button activity */
    #menu-close:hover
    {
        BACKGROUND: var(--cms-button-background-alt);
        COLOR: var(--cms-button-color-alt);
    }

    /* menu container */
    #menu
    {
        BACKGROUND: var(--cms-background);
        BOX-SIZING: border-box;
        CONTAIN: content;
        HEIGHT: 100vh;
        MAX-WIDTH: calc(350 * var(--cms-factor));
        OVERFLOW-Y: auto;
        PADDING: calc(100 * var(--cms-factor))
                 calc(20 * var(--cms-factor))
                 calc(50 * var(--cms-factor));
        POINTER-EVENTS: none;
        POSITION: fixed;
        RIGHT: 0;
        TOP: 0;
        TRANSFORM: translateX(100%);
        TRANSITION: transform 0.5s;
        WIDTH: 100%;
        WILL-CHANGE: transform;
        Z-INDEX: 975;
    }

    /* general menu list container */
    #menu UL
    {
        CONTAIN: content;
        LIST-STYLE: none;
        MARGIN: 0;
    }

    /* general menu list item */
    #menu LI
    {
        FONT-SIZE: 1.1em;
        MARGIN: 0;
    }

    /* general menu link */
    #menu A
    {
        DISPLAY: block;
        LINE-HEIGHT: calc(30 * var(--cms-factor));
        PADDING: calc(5 * var(--cms-factor)) 0;
        TEXT-WRAP: balance;
    }

    /* highlight active menu link */
    #menu A.active
    {
        COLOR: var(--cms-color-highlight);
    }

    /* base level menu link */
    #menu > UL > LI > A
    {
        TEXT-TRANSFORM: uppercase;
    }

    /* 2nd+ level menu list container */
    #menu UL UL
    {
        BORDER-LEFT: calc(2.5 * var(--cms-factor)) solid var(--cms-color-highlight);
        PADDING-LEFT: calc(10 * var(--cms-factor));
    }

    /* 2nd+ level menu link */
    #menu UL UL A
    {

    }

    /* show menu */
    #menu-open:focus ~ #menu,
    #menu:focus-within
    {
        POINTER-EVENTS: auto;
        TRANSFORM: translateX(0);
    }

    /* show menu backdrop */
    #menu-open:focus ~ #menu-backdrop,
    #menu:focus-within ~ #menu-backdrop,

    /* show menu close button */
    #menu-open:focus ~ #menu-close,
    #menu:focus-within ~ #menu-close
    {
        OPACITY: 1;
        POINTER-EVENTS: auto;
    }

    /* hide 2nd+ menu level */
    #menu UL UL
    {
        CLIP-PATH: inset(100% 0 0 0);
        HEIGHT: 0;
        POINTER-EVENTS: none;
        TRANSFORM: translateY(-100%);
        TRANSITION: clip-path 0.5s, height 0.5s 0s, transform 0.5s;
        WILL-CHANGE: clip-path, height, transform;
    }

    /* show focused 2nd+ menu level */
    #menu UL A:focus ~ UL,
    #menu UL BUTTON:focus ~ UL,

    /* show 2nd+ menu level that contains focus */
    #menu UL UL:focus-within
    {
        CLIP-PATH: inset(0 0 0 0);
        HEIGHT: 100%;
        POINTER-EVENTS: auto;
        TRANSFORM: translateY(0);
    }

    /* make space for open / close button on right side */
    #menu A:has(+ BUTTON)
    {
        PADDING-RIGHT: calc(35 * var(--cms-factor));
    }

    /* put open / close button on right side */
    #menu BUTTON
    {
        ALL: initial;
        BACKGROUND: var(--cms-button-background);
        BORDER: var(--cms-button-border);
        COLOR: var(--cms-button-color);
        CURSOR: pointer;
        BOX-SIZING: border-box;
        HEIGHT: calc(30 * var(--cms-factor));
        PADDING: 0;
        POSITION: absolute;
        RIGHT: 0;
        TOP: 5px;
        WIDTH: calc(30 * var(--cms-factor));
    }

    /* highlight active open / close button */
    #menu BUTTON:focus,
    #menu BUTTON:hover,
    #menu BUTTON:has(+ UL:focus-within)
    {
        BACKGROUND: var(--cms-button-background-alt);
        COLOR: var(--cms-button-color-alt);
        BORDER: var(--cms-button-border-alt);
    }

    /* display down-pointing arrow on open / close button */
    #menu BUTTON:after
    {
        BACKGROUND: var(--cms-button-color);
        CONTENT: "";
        INSET: 0;
        MASK-IMAGE: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 1024'><path fill='black' d='M512 320L320 512 128 320 0 448l320 320 320-320L512 320z'/></svg>");
        MASK-POSITION: center;
        MASK-REPEAT: no-repeat;
        MASK-SIZE: calc(12.5 * var(--cms-factor));
        POSITION: absolute;
    }

    /* highlight down-pointing arrow on active open / close button */
    #menu BUTTON:focus:after,
    #menu BUTTON:hover:after,
    #menu BUTTON:has(+ UL:focus-within):after
    {
        BACKGROUND: var(--cms-button-color-alt);
    }
}

/* hero image container */
#banner-image
{
    CONTAIN: strict;
    GRID-COLUMN: 1 / 2;
    GRID-ROW: 2 / 3;
    JUSTIFY-SELF: stretch;
    MARGIN: 0 calc(-1 * var(--tpl-hpadding));
    MIN-HEIGHT: calc(400 * var(--cms-factor));
}

#banner-image:after,
#banner-image:before
{
    BACKGROUND: var(--cms-h1-color);
    CONTENT: "";
    HEIGHT: calc(12.5 * var(--cms-factor));
    LEFT: 0;
    OPACITY: 0.75;
    POSITION: absolute;
    RIGHT: 0;
    TOP: 0;
    Z-INDEX: 1;
}

#banner-image:after
{
    BOTTOM: 0;
    TOP: auto;
}

/* hero image */
#banner-image > IMG
{
    HEIGHT: 100%;
    LEFT: 0;
    OBJECT-FIT: cover;
    POSITION: absolute;
    TOP: 0;
    WIDTH: 100%;
}

/* hero content container */
#banner-content
{
    CONTAIN: layout;
    GRID-COLUMN: 1 / 2;
    GRID-ROW: 2 / 3;
    PADDING: calc(var(--cms-vpadding) * 1.5) calc(var(--cms-hpadding) * 1.5);
    PLACE-SELF: center;
}

#banner-image + #banner-content
{
    BACKDROP-FILTER: blur(calc(5 * var(--cms-factor)));
    BACKGROUND: var(--cms-overlay-background);
}

/* main content container */
#body
{
    CONTAIN: layout;
    GRID-COLUMN: 1 / 2;
    GRID-ROW: 3 / 4;
    JUSTIFY-SELF: center;
    MAX-WIDTH: calc(1280 * var(--cms-factor));
    PADDING: calc(50 * var(--cms-factor)) 0;
    WIDTH: 100%;
}

/* reduce main content container padding */
@media (max-width: 800px)
{
    #body
    {
        PADDING: calc(20 * var(--cms-factor)) 0;
    }
}

#cta
{
    MARGIN-TOP: var(--cms-vspacing);
    TEXT-ALIGN: center;
}

#cta .button
{
    MARGIN: 0;
}

/* page footer */
#foot
{
    ALIGN-ITEMS: flex-end;
    ALIGN-SELF: start;
    CONTAIN: content;
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    GRID-COLUMN: 1 / 2;
    GRID-ROW: 4 / 5;
    GAP: var(--cms-vspacing) var(--cms-hspacing);
    JUSTIFY-CONTENT: space-between;
    MARGIN: 0 auto;
    MAX-WIDTH: calc(1400 * var(--cms-factor));
    PADDING: calc(50 * var(--cms-factor)) 0 calc(100 * var(--cms-factor));
    TEXT-ALIGN: left;
    TEXT-TRANSFORM: uppercase;
    WIDTH: 100%;
}

/* address */
#address
{
    FONT-SIZE: 1.25em;
}

/* language selector */
#language
{
    MARGIN: 0 calc(-5 * var(--cms-factor));
    TEXT-TRANSFORM: uppercase;
}

/* language selector link */
#language A
{
    DISPLAY: inline-block;
    PADDING: 0 calc(5 * var(--cms-factor));
}

/* separate adjacent language selector links */
#language A + A
{
    BORDER-LEFT: calc(1.5 * var(--cms-factor)) solid var(--cms-color-alt);
}

/* meta link container */
#link
{
    DISPLAY: flex;
    FLEX-WRAP: wrap;
    GAP: calc(25 * var(--cms-factor));
}

/* landing page menu */
#menu-lp
{
    DISPLAY: flex;
    FLEX: 1 1 100%;
    FLEX-WRAP: wrap;
    GAP: calc(25 * var(--cms-factor));
    JUSTIFY-CONTENT: center;
    MARGIN-TOP: calc(50 * var(--cms-factor));
}

/* top button */
#goto-top
{
    BACKDROP-FILTER: blur(calc(5 * var(--cms-factor)));
    BACKGROUND: var(--cms-overlay-background);
    BOTTOM: calc(25 * var(--cms-factor));
    BORDER: calc(2.5 * var(--cms-factor)) solid var(--cms-link-color);
    BORDER-RADIUS: 50%;
    BOX-SHADOW: var(--cms-box-shadow);
    FONT-FAMILY: "Entypo";
    FONT-SIZE: calc(40 * var(--cms-factor));
    FONT-WEIGHT: normal;
    HEIGHT: calc(40 * var(--cms-factor));
    LEFT: calc(25 * var(--cms-factor));
    LINE-HEIGHT: calc(40 * var(--cms-factor));
    POSITION: fixed;
    TEXT-ALIGN: center;
    TEXT-DECORATION: none;
    TRANSFORM: translateY(calc(75 * var(--cms-factor)));
    TRANSITION: transform 0.5s;
    WIDTH: calc(40 * var(--cms-factor));
    WILL-CHANGE: transform;
}

#goto-top:hover
{
    BORDER-COLOR: var(--cms-link-color-alt);
}

/* slide in top button */
#goto-top.goto-top-show
{
    TRANSFORM: translateY(0);
}

/* fixed contact button */
#contact
{
    BACKGROUND: var(--cms-background-alt);
    BOTTOM: calc(22.5 * var(--cms-factor));
    BOX-SHADOW: var(--cms-box-shadow);
    COLOR: var(--cms-color-alt);
    DISPLAY: block;
    HEIGHT: calc(50 * var(--cms-factor));
    LINE-HEIGHT: calc(50 * var(--cms-factor));
    PADDING-RIGHT: calc(20 * var(--cms-factor));
    POSITION: fixed;
    RIGHT: calc(20 * var(--cms-factor));
    TEXT-TRANSFORM: uppercase;
    WHITE-SPACE: nowrap;
}

#contact SPAN[class^="icon-"]
{
    DISPLAY: inline-block;
    FONT-SIZE: calc(25 * var(--cms-factor));
    FONT-WEIGHT: normal;
    HEIGHT: calc(50 * var(--cms-factor));
    MARGIN-RIGHT: 0;
    TEXT-ALIGN: center;
    WIDTH: calc(50 * var(--cms-factor));
}

@media (min-width: 801px) and (pointer: fine),
       (min-width: 801px) and (hover: hover)
{
    #contact
    {
        TRANSFORM: translateX(calc(100% + 35 * var(--cms-factor)));
        TRANSITION: transform 0.5s;
        WILL-CHANGE: transform;
    }

    #contact:hover
    {
        BACKGROUND: var(--cms-link-color-alt);
        COLOR: var(--cms-link-background-alt);
    }
}

#sticky.minimize ~ #contact
{
    TRANSFORM: translateX(0);
}

/* loading transition effect */
@keyframes transition
{
      0% { OPACITY: 1; }
    100% { OPACITY: 0; }
}

#transition
{
    ANIMATION: transition 1.5s forwards;
    BACKGROUND: var(--cms-color);
    INSET: 0;
    POINTER-EVENTS: none;
    POSITION: fixed;
    WILL-CHANGE: opacity;
    Z-INDEX: 5000;
}