
:root {
    --personal-information-line-weight: 35px;
    --date-and-place-span-font-size: smaller; 
  }

#main{
    padding: 5em;
}

#main > *{
    border-top: none;
    padding: 2rem 4rem 2rem 4rem;
} 

h2{
    border-bottom: 2px #383838 solid;
}

a{
    border: 0px;
}

.resume-sections, .resume-sections>*{
    text-align: left;
}

.bold-text{
    font-weight: bold;
}

.italic-text{
    font-style: italic;
}

.txt-lt{
    font-weight: lighter;
}

.txt-bld{
    font-weight: bold;
}

.txt-sm{
    font-size: small;
}

.txt-lg{
    font-size: 1.5em;
}

.txt-center{
    text-align: center;
}
.txt-right{
    text-align: right;
}

.li-dash{
    list-style-type: "-";
}

.no-list-style-type{
    list-style-type: none;
}

.sticky{
    position: sticky;
    text-align: end;
    top: 5em;
}

.fixed{
    position: fixed;
    text-align: end;
    /* top: 5em; */
}

.absolute{
    position: absolute;
    top: 0em;
    left: 55vw;
}

.bt-0{
    bottom: 0em;
}

.r-8{
    right: 8em;
}

.border-t-0{
    border-top: none !important;
}

.flex{
    display: flex;
    justify-content: space-between;
}

.left-side-flex{
    width: 45vw;
}


#coordinates{
    
    line-height: var(--personal-information-line-weight);
    margin-left: 15px;
}

#coordinates > h3{
    margin-bottom: 0px;
}

#personal-contact {
    line-height: var(--personal-information-line-weight);
}

.date-and-place{
    font-size: var(--date-and-place-span-font-size);

}

@media screen and (max-width: 992px) {
    .lg-no-show{
        display: none;
    }
    .lg-container-grid{
        display: grid;
    }

    .left-side-flex{
        width: 60vw;
    }
    
    #main > *{
        padding: 1rem 0;
    }

    #main{
        padding:3em;
        /* width: 100%; */
    }
}

@media screen and (max-width: 768px) {
    .md-no-show{
        display: none;
    }
    .md-container-grid{
        display: grid;
    }

    .left-side-flex{
        width: 85vw;
    }
    
    #main > *{
        padding: 1rem 0;
    }

    #main{
        padding:3em;
        /* width: 100%; */
    }

    .image{
        display: none;
    }
}

.col-12{
    grid-template-columns: repeat(12, 1fr);
}

.pos-1-4{
    grid-column: 1/4;
}

.pos-1-4{
    grid-column: 1/4;
}

@media screen and (max-width: 600px) {
    #intro{
        height: 10vh;
        padding-top: 0;
    }

    #header{
        margin: 0;
    }
}

@media screen and (max-width: 520px) {
    #personal-information, #personal-contact{
        display: block;
        text-align: center;
        width: 80vw;
    }
    .flex{
        display: block;
    }
    #main{
        padding:3em;
        width: 100%;
    }

    #intro{
        height: 20vh;
    }
}

#download-icon{
    box-sizing: border-box;
    position: fixed;
    right:8%;

}