/* Colors

    dark gray   #393e41
    gray        #d3d0cb
    yellow      #e2c044
    blue green  #587b7f
    black       #1e2019 
    */

body {
    font-family: 'Quicksand', sans-serif;
}

/* WELCOME SECTION */

#home {
    background: url(images/welcome-bg_01.jpg) no-repeat fixed;
    background-size: cover;
    min-height: 100vh;
    width: 100%;
}

#home .row {
    height: 100vh;
    color: white;
}

.namehighlight {
    color: #e2c044;
}

#home a {
    color: #e2c044;
    text-transform: uppercase;
    border: 1px solid #e2c044;
}

#home a:hover {
    background-color: #393e41;
    box-shadow: 2px 2px 10px

}

.hrWelcome {
    background-color: #e2c044;
    max-width: 80%;
}

/* NAVBAR SECTION */

nav {
    background: #393e41;
    padding: 0 !important;
}


.navbar-toggler-icon {
    border-color: #e2c044;
}

nav ul li a {
    color: white !important;
    text-transform: uppercase !important;
    padding: 10px !important;
}

nav ul li a:hover{
    color: white !important;
    /* text-decoration: underline #e2c044 !important; */
    background: #587b7f !important;
}

#navbar ul .active {
    color: #e2c044 !important;
    background-color: #1e2019 !important;
}

/* ABOUT SECTION */
#about {
    margin-bottom: 50px;
    padding-top: 50px;
    background: white;
}

.title {
    position: relative;
    height: 100px;
    overflow: hidden;
}

.title-highlight {
    width: 75%;
    min-width: 300px;
    height: 75px;
    background: #e2c044;
    border-radius: 0 10px 10px 0;
}

.title-container {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 20px;
}

#about .info-card-container {
    margin-bottom: 20px;
}

#about .info-card img {
    max-width: 125px;
}

#about .info-card h4{
    margin: 20px auto;
}

#skills .dev-lang {
    background-color: #587b7f;
    padding: 25px;
    border-radius: 10px;
}

.dev-lang {
    color: white;
}

.dev-lang h2 {
    color: #e2c044;
}

.dev-lang .hrSkills {
    background-color: #e2c044;
}

#skills .row .col-md-6 {
    margin-bottom: 10px;
}

/* PORTFOLIO SECTION */

#portfolio {
    padding: 50px 0;   
    background: #1e2019;
    color: white;
}

#portfolio h2 {
    color: #e2c044;
}

#portfolio .hrPortfolio {
    background-color: #e2c044;
    max-width: 50%;
}

#portfolio ul {
    padding: 0;
}

#portfolio ul li {
    display: inline-block;
    border-radius: 4px;
    background: #587b7f;
    padding: 5px 10px;
    margin: 5px;
}

#portfolio ul li a {
    cursor: pointer;
}

#portfolio ul .active {
    background: #e2c044;
    color: #1e2019;
}

#portfolio ul li:hover {
    background: white;
    color: #1e2019;
}

.entry-card {
    margin-bottom: 20px;
    background: #587b7f;
}

.portfolioEntry h6 a,
.portfolioEntry p a {
    color: white;
    text-decoration: none;
    display: block;
    padding: 10px 0 5px;
    margin: 0 0;
}

.portfolioEntry p a {
    padding: 5px 0 5px;
}

.portfolioEntry h6:hover,
.portfolioEntry p:hover {
    color: #1e2019;
    background: #e2c044;
    
}

.portfolioEntry h6 a:hover,
.portfolioEntry p a:hover {
    color: #1e2019;
    background: #e2c044;
}

.portfolioEntry h6,
.portfolioEntry p {
    padding: 0;
}

#contact {
    padding-top: 50px;
}


/* CONTACT SECTION */

/* #contact {
    min-height: 100vh;
} */

.title-highlight-2 {
    width: 75%;
    min-width: 300px;
    height: 75px;
    background: #e2c044;
    border-radius: 10px 0 0 10px;
    position: absolute;
    right: 0;
}

/* FOOTER SECTION */


#footer {
    position: relative;
}

.footer-bg {
    -webkit-clip-path: polygon(0 0, 25% 39%, 100% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 25% 39%, 100% 0%, 100% 100%, 0% 100%);
    background-color: #393e41;
    height: 100px;
}

.endnotes {
    position: absolute;
    bottom: 5px;
    text-align: end;
    color: white;
}

#footer img {
    width: 100%;
    height: 300px;
}