@charset "UTF-8";

/* CSS Document */
body {
background-color: #C2CFD7;
}

#loader {
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 1;
    overflow: visible;
    background: #C2CFD7 url('/img/preloader-mountains.gif') no-repeat center center;
}

.banner_photo img {
width: 100%;
height: auto;
background-image: url(/img/herald-prov-park-salmon-arm.jpg);
background-position: center;
}

#navlist {
position: fixed;
top: -60px;
width: 100%;
height: auto;
z-index: 0;
display: inline-block;
clear: left;
margin: 0 auto;
font-family: "ubuntu";
background-color: #115D7A;
transition: top 0.3s;
text-align: center;
}

#navlist a {
display: inline-flex;
padding: 14px 20px;
font-size: 15px;
font-family: "ubuntu";
color: white;
text-align: center;
text-decoration: none;
overflow: hidden;
}

#navlist a:hover {
background-color: #849EAE;
color: white;
}

.page-title {
position: relative;
float: none;
font-size: 26px;
font-family: "ubuntu";
color: white;
text-align: center;
background-color: #115D7A;
margin-top:-3%;
}

.text-content {
position: inline-block;
text-align: left;
padding-left: 5px;
font-size: 20px;
font-weight: normal;
font-family: "ubuntu";
text-decoration: none;
}

.text-content a {
position: relative;
display: inline-block;
padding: 5px 0;
font-family: 'ubuntu', serif;
color: white;
text-decoration: none;
background-clip: text;
transition: all 0.3s ease-in-out;
}

.text-content a:before {
content: '';
display: block;
position: absolute;
bottom: -3px;
left: 0;
width: 0;
height: 3px;
background: #849EAE;
transition: all 0.3s ease-in-out;
}

.text-content a:hover {
color: #115D7A;
text-decoration: none;
font-family: 'ubuntu', serif;
background-position: 0;
}

.text-content a:hover::before {
width: 100%;
font-family: 'ubuntu', serif;
}

.back-button {
position: relative;
display: block;
padding: 50px 0 30px 50px;
font-size: 20px;
font-family: 'ubuntu', serif;
text-align: left;
}

.back-button a {
position: relative;
display: inline-block;
padding: 5px 0;
font-family: 'ubuntu', serif;
color: white;
text-decoration: none;
background-clip: text;
transition: all 0.3s ease-in-out;
}

.back-button a:before {
content: '';
display: block;
position: absolute;
bottom: -3px;
left: 0;
width: 0;
height: 3px;
background: #849EAE;
transition: all 0.3s ease-in-out;
}

.back-button a:hover {
color: #115D7A;
text-decoration: none;
font-family: 'ubuntu', serif;
background-position: 0;
}

.back-button a:hover::before {
width: 100%;
font-family: 'ubuntu', serif;
}

footer {
display: table;
margin-left: auto;
margin-right: auto;
margin-bottom: -100px;
font-family: "ubuntu";
text-align: center;
text-decoration: none;
}

footer a {
display: inline;
padding-bottom: 25px;
margin-left: auto;
margin-right: auto;
font-family: "ubuntu";
text-align: center;
text-decoration: none;
color: black;
}

@media (max-width: 767px) {
    body {
        background-color: #c2cfd7;
    }


    #navlist {
        background-color: #115D7A;
        top: 0;
        width: 100%;
        display: inline-block;
        transition: top 0.3s;
        font-family: "ubuntu";
        position: fixed;
        margin: 0 auto;
        clear: left;
        height: auto;
        z-index: 1;
        text-align: center;
    }

    #navlist a {
        display: inline-flex;
        color: white;
        text-align: center;
        padding: 14px 20px;
        text-decoration: none;
        font-size: 15px;
        overflow: hidden;
    }

    #navlist a:hover {
        background-color: #849EAE;
        color: white;
    }

    .page-title {
        font-family: "ubuntu";
        font-size: 24px;
        color: white;
        text-align: center;
        position: relative;
        background-color: #115d7a;
        margin-top: -7%;
        z-index: 0;
    }

    .text-content {
        font-size: 20px;
    }

    .back-button {
        padding-left: 10%;
    }

    footer {
        margin-bottom: 0;
    }
}