// #####################################################
//  Vita
// #####################################################

@import "../lib/main"

.wrapper
    display: flex
    padding: 4vw
    position: relative
    flex-direction: column

    +respond(medium, min)
        flex-direction: row


.contentLeft
    margin-left: 8vw

    +respond(medium, min)
        width: 52vw



.contentRight

    +respond(medium, min)
        width: 40vw


.headlineIntroduction
    font-size: modular-scale(px, 9)
    max-width: 300px
    color: black

    span
        display: block

    &:after
        content: ""
        position: absolute
        top: 0
        left: 2vw
        width: 15vw
        height: 80vh
        background-color: $accent
        z-index: -1


.description
    color: black
    font-size: modular-scale(px, -1)
    max-width: 450px


.vitaPicture
    width: 200px

    +respond(medium, min)
        width: auto


// #####################################################
//  contentRight
// #####################################################

.vita
    font-size: modular-scale(px, 9)
    color: $accent


.headlineTopic
    color: black
    font-size: modular-scale(px, 5)


.headlineDescription
    color: black
    font-size: modular-scale(px, -2)
    text-transform: uppercase
    font-weight: $bold
    margin-bottom: 10px

.textJobDescription
    color: black
    font-size: modular-scale(px, -1)
    max-width: 500px
    margin-bottom: 50px


.educationItem
    flex: 0 0 100%