/* ----------------------------------------------------------------- */
/* this section is styling the navigation bar on the portfolio page */
body {
    font-family: diazo-mvb-ex-cond, san-serif;
    font-style: normal;
    font-weight: 300;
}

.scribbleBG {
    background-size: cover;
    -webkit-mask-image: -webkit-gradient(linear, right bottom, left top, from(rgba(0, 0, 0, .25)), to(rgba(0, 0, 0, 0)));
    mask-image: linear-gradient( to top, rgba(0,0,0,.25), rgba(0,0,0,0));
    z-index: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
}

#navbar {
    top: 0;
    border-bottom: 1px solid white;
    height: 7.5vh;
}

#homepageIcon {
    font-style: bold;
    font-weight: 300;
    font-size: 4vh;
    text-decoration: none;
    top: 1vh;
}

#homepageIcon > span {
    margin: 1.5vh;
    padding: 0 1vw;
}

#homepageIcon:hover {
    text-decoration: none;
    opacity: .5;
}

#aboutIcon {
    font-size: 2.75vh;
    text-decoration: none;
    position: relative;
    top: 2.25vh;
}

#aboutIcon:hover {
    text-decoration: none;
    opacity: .5;
}

#galleryIcon {
    font-size: 2.75vh;
    text-decoration: none;
    position: relative;
    top: 2.25vh;
}

#galleryIcon:hover {
    text-decoration: none;
    opacity: .5;
}

.mainContainer {
    z-index: 1;
}

.paragraph {
    font-family: "Zain", sans-serif;
    font-weight: 300;
    font-style: normal;
}

#artLink {
    color: #fff;
    margin-top: 5.5px;
}

#artLink > a:hover {
    text-decoration-line: none;
    color: gray;
}

#art > a:hover {
    text-decoration-line: none;
}

.glyphicon-home {
    color: #fff;
    margin-top: 5.5px;
}

.glyphicon-home:hover {
    color: #de805b;
}

#x {
    color: black;
    margin-top: 5.5px;
}