
/* GOOGLE FONTS */
@import url('https://fonts.googleapis.com/css?family=Roboto');
@import url('https://fonts.googleapis.com/css?family=Montserrat');

/* STYLING */
html {
    height: 100%;
}

body {
    height: 100%;
    font-family: 'Montserrat', sans-serif;
}

p {
    padding: 0 25px 0;
}

hr {
    border-color: #EEB14F;
}

.primary-color {
    color: #EEB14F
}

.primary-background-color {
    background-color: #EEB14F
}

.secondary-color {
    color: #263547;
}

.secondary-background-color {
    background-color: #263547;
}

.navbar {
    margin-bottom: 0;
    border-radius: 0;
    padding: 10px 0;
    font-size: 1.2em;
    border: 0;
}

.navbar-brand {
    float: left;
    vertical-align: middle;
    transform: translateY(-50%);
    font-family: 'Roboto', sans-serif;
}

.navbar-inverse .navbar-nav .active a,
.navbar-inverse .navbar-nav .active a:focus,
.navbar-inverse .navbar-nav .active a:hover {
    color: #EEB14F;
    background-color: #263547;
}

.navbar-inverse .navbar-nav li a {
   color: #EEB14F;
}

#home {
    background: url(../img/lower_antelope.jpg) no-repeat center center fixed;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    background-size: cover;
}

#skills .row [class*=col-] {
    padding: 25px 0 0;
}

.fixed-background {
    background: url(../img/lower_antelope.jpg) no-repeat center center fixed;
    display: table;
    height: 30%;
    position: relative;
    width: 100%;
    background-size: cover;
}

.section-padding {
    padding: 50px 0;
}

.landing-text {
    display: table-cell;
    vertical-align: middle;
    color: #FFF;
}

.landing-text h1 {
    font-size: 500%;
    font-weight: 700;
}

.project-box {
    display: block;
    position: relative;
    margin: 0 auto;
    max-width: 650px;
}

.project-box img {
   max-width: 100%;
}

.sticky-link {
    position: absolute;
    top: 5%;
    right: 5%;
}

.sticky-link:hover {
    color: #FFF;
}

.no-gutters [class*=col-]{
    padding-right: 0;
    padding-left: 0;
}

footer .row [class*=col-]{
    padding: 25px 0 0;
}

.hover-unhide {
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: .35s;
}

.project-box .text-elements {
    width: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.hover-unhide:hover {
    opacity: .9;
}

[class*=fa] {
    color: #EEB14F;
}