:root {
    /* Base font size */
    font-size: 16px;

    /* Full grid area variable */
    --fullGrid: 1 / 1 / -1 / -1;
}

body {
    font-family: "elzafont", Arial, sans-serif;
    background-color: #1C261C;
}

header {
    /* Create grid spanning viewport width & height */
    display: grid;
    grid-template-rows: 100vh;
    overflow: hidden;
    box-shadow: 0 0.2em 0.5em rgba(28, 38, 28, 0.5);
}
@font-face {
    font-family: 'elzafont';
    src: url('font/elzafont.eot');
    src: url('font/elzafont.eot?#iefix') format('embedded-opentype'),
    url('font/elzafont.woff2?') format('woff2'),
    url('font/elzafont.woff?') format('woff'),
    url('font/elzafont.ttf?') format('truetype'),
    url('font/elzafont.svg?') format('svg');
    font-weight: normal;
    font-style: normal;
font-size: 16px;
    }
.logo {padding:12px 0; font-size:24px;text-transform:uppercase;color: #D3D6AE;}	
.logo .logo-line {display:inline-block;width:2px;height:60px;background-color:#D3D6AE;vertical-align: middle; margin: 0 24px;}
.contact a{ color:#D3D6AE; text-decoration:none; font-size:24px; display:block}
.video-bg {
    /* Span the full grid */
    grid-area: var(--fullGrid);

    /* Re-size video to cover full screen while maintaining aspect ratio */
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;

    /* Display video below overlay */
    z-index: -1;
}

.video-bg::-webkit-media-controls {
    display: none !important;
}

.video-overlay {
    /* Span the full grid */
    grid-area: var(--fullGrid);

    /* Center Content */
    display: grid;
    justify-content: center;
    align-content: center;
 
    /* Semi-transparent background */
    background-color: rgba(28, 38, 28, 0.55);
}
.service {display: -ms-grid;
    display: grid;grid-template-rows:    repeat(2, 200px);
grid-template-columns: repeat(4, 1fr);}
.service-block {background:#D3D6AE; border-radius:16px; color:#263526; padding:26px 24px;border:1px #1C261C solid}
h1 {
    font-size: calc(1.8em + 2.5vw);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.02em;
    color: #fff;
    text-shadow: 0.05em 0.05em 0.05em rgba(0, 0, 0, 0.4);
}
.footer {color:#D3D6AE}
.footer a{ color:#D3D6AE; text-decoration:none; display:block}
h2 {color: #D3D6AE;text-transform:uppercase}
@media screen and (max-width: 1023px) {header {display:block;}
.logo .logo-line {display:none}
.logo .logo-name {display:block}
	.service {
grid-template-columns: repeat(2, 1fr);}
.video-overlay {position: absolute;   top: 0;}
	
}

::-moz-selection {
    background-color: rgba(0, 0, 0, 0.75);
    color: #fff;
}

::selection {
    background-color: rgba(0, 0, 0, 0.75);
    color: #fff;
}