:root {

    --dark-bg-color: #575757;

    --light-bg-color: #DFDFDF;

    --dark-accent-color: #848469;

    --medium-accent-color: #A9AA8A;

    --light-accent-color: #C7CCB1;

    --text-color: #555;

}



* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



body {

    background-color: var(--light-bg-color);

    font-family: 'Helvetica Neue', Arial, sans-serif;

    font-size: 16px;

    line-height: 1.6;

    color: var(--text-color);

}



a {

    color: var(--light-accent-color);

    transition: color 0.3s;

}



    a:hover {

        color: var(--light-bg-color);

    }



ul {

    list-style-type: none;

}



#container {

    margin: 6px auto 40px;

    background-color: #FFF;

    border-radius: 8px;

    box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.3);

    max-width: 960px;

    padding-bottom: 50px;

}



    #container > * {

        padding: 20px;

    }



header {

    background-color: var(--dark-bg-color);

    border-radius: 8px 8px 0 0;

    color: var(--light-bg-color);

    display: flex;

    align-items: center;

    flex-direction: row;

}



    header hgroup {

        display: flex;

        flex-direction: column;

        margin-left: clamp(1rem, 2vw, 2rem);

        order: 2;

        text-shadow: 2px 2px 2px #333;

    }



    header h1 {

        font-size: clamp(1.5rem, 4vw, 2.5rem);

    }



    header hgroup p {

        font-size: clamp(1rem, 3vw, 1.75rem);

    }



    header img {

        border: solid 3px var(--light-bg-color);

        border-radius: 50%;

        box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.3);

        height: 116px;

        order: 1;

        width: 116px;

    }



#contact {

    align-items: flex-end;

    display: flex;

    flex-direction: column;

    font-size: clamp(.3rem, 3vw, 1rem);

    margin-left: auto;

    order: 3;

}



    #contact > * {

        margin-top: 10px;

    }



header a:first-child::before {

    display: inline-block;

    font: var(--fa-font-solid);

    margin-right: 8px;

    text-rendering: auto;

    -webkit-font-smoothing: antialiased;

}



header .address a:first-child::before {

    content: '\f3c5';

}



header .phone a:first-child::before {

    content: '\f095';

}



header .email a:first-child::before {

    content: '\f0e0';

}



header .linkedIn a:first-child::before {

    content: '\f08c';

    font: var(--fa-font-brands);

}



section > h2 {

    border-bottom: solid 2px var(--dark-bg-color);

    font-size: clamp(1.3em, 3vw, 24px);

    margin-bottom: 10px;

}



#skills {

    background-color: var(--light-bg-color);

    font-weight: bold;

}



    #skills ul {

        display: flex;

        flex-wrap: wrap;

        gap: 10px clamp(1vw, 3vw, 29px);

        justify-content: center;

    }



#experience a, #additionalDetails a {

    color: var(--dark-accent-color);

}



    #experience a:hover, #additionalDetails a:hover {

        color: var(--medium-accent-color);

    }



#experience > ul > li > ul {

    list-style-position: inside;

    padding-left: 10px;

}



#experience summary {

    cursor: pointer;

    margin-bottom: 10px;

}



#experience > details {

    margin-top: 20px;

}



    #experience > ul > li, #experience > details > ul > li {

        border-top: dotted 2px black;

        margin-bottom: 20px;

        padding-top: 14px;

    }



        #experience > ul > li:first-child {

            padding-top: 0;

            border-top: none;

        }



#experience ul > li li {

    margin-bottom: 10px;

}



#experience .titleAndCompany, #experience .locationAndDates {

    align-items: baseline;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

}



#experience .titleAndCompany {

    font-weight: bold;

    line-height: 1.5;

    margin-bottom: 6px;

}



    #experience .titleAndCompany h3 {

        font-size: clamp(1.1em, 2vw, 20px);

    }



#experience .locationAndDates {

    font-style: italic;

    margin-bottom: 10px;

}



#experience .remote {

    margin-left: 10px

}



#experience .employmentDates::before {

    content: '\f133';

    font: var(--fa-font-solid);

    margin-right: 8px;

}



#experience .address::before {

    content: '\f3c5';

    font: var(--fa-font-solid);

    margin-right: 8px;

}



#experience h4 {

    display: inline;

    font-size: 1em;

    margin-right: 6px

}



    #experience h4::after {

        content: ':';

    }



    #experience h4 + p {

        display: inline;

    }



#additionalDetails li {

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

}



    #additionalDetails li > span {

        margin-left: 20px;

    }



        #additionalDetails li > span:first-child {

            font-weight: bold;

            margin-left: 0;

        }



@media screen and (max-width: 768px) {

    header {

        flex-direction: column;

        text-align: center;

    }



    #contact {

        align-items: flex-start;

        flex-direction: row;

        flex-wrap: wrap;

        gap: 0.1rem 1.8em;

        justify-content: center;

        margin-left: 0;

    }

}



@media print {

    @page {

        margin: 0.65in;

    }



    body {

        background-color: #FFF;

        font-family: Georgia, "Times New Roman", Times, serif;

        font-size: 10pt;

    }



    #container {

        box-shadow: none;

        margin: 0 auto;

    }



    #container > * a {

        color: var(--text-color);

        text-decoration: none;

    }



        #container > * {

            padding: 6pt 0;

        }



    header {

        background:none;

    }



        header img {

            border: none;

            box-shadow: none;

            height: 90px;

            width: 90px;

        }



        header hgroup {

            color: var(--text-color);

            text-shadow: none;

        }



            header hgroup h1 {

                font-size: 16pt;

            }



            header hgroup p {

                font-size: 13pt;

            }



        header #contact .linkedIn {

            display: none;

        }



    #contact {

        font-size: 10pt;

    }



        #contact > * {

            margin-top: 2pt;

        }



    section > h2 {

        border-bottom: solid 2px var(--dark-bg-color);

        font-size: 13pt;

        margin-bottom: 4pt;

    }



        #skills ul {

            gap: 3pt 12pt;

        }



    #experience .titleAndCompany {

        margin-bottom: 2pt;

    }



    #experience .locationAndDates {

        margin-bottom: 12pt;

    }



    #experience .titleAndCompany h3 {

        font-size: 11pt;

    }



    #additionalDetails {

        font-size: 9pt;

    }



    details, summary {

        display: none;

    }



        details[open] {

            display: block;

        }

}


header .address a:first-child::before,#experience .address::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M12%202a7%207%200%200%200-7%207c0%205%207%2013%207%2013s7-8%207-13a7%207%200%200%200-7-7zm0%2010a3%203%200%201%201%200-6%203%203%200%200%201%200%206z%22/%3E%3C/svg%3E") center/contain no-repeat;vertical-align:-.05em}
header .phone a:first-child::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M6%202%202%205c0%209%208%2017%2017%2017l3-4-6-4-3%203a15%2015%200%200%201-6-6l3-3z%22/%3E%3C/svg%3E") center/contain no-repeat;vertical-align:-.05em}
header .email a:first-child::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M2%204h20v16H2zm2%202%208%206%208-6H4zm0%203v9h16V9l-8%206z%22/%3E%3C/svg%3E") center/contain no-repeat;vertical-align:-.05em}
#experience .employmentDates::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M5%202h2v3h10V2h2v3h3v17H2V5h3zm-1%209v9h16v-9z%22/%3E%3C/svg%3E") center/contain no-repeat;vertical-align:-.05em}
header .linkedIn a:first-child::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:8px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M2%202h20v20H2z%22/%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M5%209h3v10H5zm0-4h3v3H5zm5%204h3v1c1-2%206-2%206%203v6h-3v-6c0-2-3-2-3%200v6h-3z%22/%3E%3C/svg%3E") center/contain no-repeat;vertical-align:-.05em}
header .linkedIn a:first-child::before{content:"in";mask:none;background:none;font:bold .8em Arial;line-height:.9;border:1px solid currentColor;width:1em;height:1em;text-align:center}

/* Keyboard focus and complete printing; screen layout follows the existing site. */
a:focus-visible, summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media print {
 details, details[open] { display: block; }
 summary { display: none; }
 details::details-content { content-visibility: visible !important; display: block !important; }
 details > :not(summary) { display: block !important; }
 #experience li li { break-inside: avoid; }
 h2, h3 { break-after: avoid; }
}