.dark-mode {
    background-color: #232121;
}

#lj-svg {
    position: absolute;
    width: 6%;
    height: auto;
    left: 47%;
    bottom: 2%;
}

/* General */

html,
body {
    height: 100%;
    background-color: #d0cecd;
}

body {
    display: -ms-flexbox;
    display: flex;
    color: #ffffff;
    text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
    box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
}

.white-text {
    color: #FFFFFF;
    text-shadow: 0 .05rem .25rem rgb(193, 189, 189);
}

.main-container {
    max-width: 72em;
    padding: 0;
}

/* Resume */
#resume-paper{
    -webkit-box-shadow: -4px -4px 5px 2px #3d3d3d;
    box-shadow: -4px -4px 5px 2px #3d3d3d;
    background: #FFFFFF;
    padding: 0;
}

#resume-name{
    font-size: 2rem;
    font-weight: 600;
}

.resume-text{
    color: black;
    font-size: 1.4rem;
}

.resume-list{
    list-style: none;
    color: black;
}

.resume-list li::before{
    content: "\25AA";
    color: #8b0000;
    font-size: 1.3em;
    padding-right: .3em;
    margin-left: -1em;
}

.popup-border {
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 55% 75%, 50% 100%, 45% 75%, 0% 75%);
    background-color: black;
    position: absolute;
    height: 20%;
    width: 100%;

    top:10%

}

.popup {
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 55% 75%, 50% 100%, 45% 75%, 0% 75%);
    position: absolute;
    background-color: white;

    left: 0.5%;
    top: 3%;
    width: 99%;
    height: 92%;
}

.popup-inner {
    clip-path: none;
    background-color: lightgrey;
    height: 75%;
    width: auto;
}

/* Header */
.header-links:link, .header-links:visited, .header-links:active {
    color: white;
    text-decoration: none;
}

.header-links:hover{
    color: #f0eeed;
    text-decoration: none;
    border-bottom: .15em solid #8b0000;
}

a:link, a:visited, a:hover, a:active{
    color: darkred;
}