@font-face {
    font-family: Comfortaa;
    src: url("/fonts/fonts/Comfortaa-Regular.ttf");
}

@font-face {
    font-family: Comfortaa;
    src: url("/fonts/fonts/Comfortaa-Light.ttf");
    font-weight: light;
}

@font-face {
    font-family: Comfortaa;
    src: url("/fonts/fonts/Comfortaa-Bold.ttf");
    font-weight: bold;
}

@font-face {
    font-family: Frutiger Bold;
    src: url("/fonts/fonts/Frutiger_bold.ttf");
}

/* --- Change the background here ---
   Options:
   - Solid color:  background-color: #1a1a1a;
   - Image:        background: url("./Images/your-image.jpg"); background-size: cover;
                   box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.75);
*/
html {
    min-height: 100%;
    background: url("./Images/74175.JPG");
    background-size: cover;
    background-color: #222;
    box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.8);
}

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    margin: 0;
    font-family: 'Comfortaa', cursive;
    color: #c4c4c4;
}

a {
    color: #8fb1b3;
}
a:hover {
    color: #ffb347;
}

.whiteHover {
    color: #fff;
    text-decoration: none;
}
.whiteHover:hover {
    color: #ffb347;
}

.pageContainer {
    display: flex;
    flex-direction: row;
}
.pageLeft {
    flex: 1;
    padding: 1rem;
}
.pageRight {
    flex: 1;
    padding: 1rem;
}

.mainContainer {
    padding: 25px;
}

/* --- Heading style ---
   Change the font-family here to use a different heading font.
   You can add your own @font-face above and reference it here.
*/
.goodText {
    font-family: 'Frutiger Bold', 'Lucida Sans', Geneva, Verdana, sans-serif;
    font-size: 75px;
}

.tinyText {
    color: #888;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
}

p {
    font-size: 20px;
}

@media (max-width: 1248px) {
    .pageContainer {
        flex-direction: column;
        padding-left: 12px;
        padding-right: 12px;
    }
    .pageLeft, .pageRight {
        flex: none;
        width: 100%;
    }
}

@media (max-width: 767px) {
    body {
        margin: 0px;
    }

    .mainContainer {
        padding: 0px;
        margin: 0px;
    }

    .pageLeft {
        padding: 0;
    }
    .pageRight {
        padding: 0;
    }
}