.w-full {
    width: 100%;
}

.lg-w-3/4 {
    width: 75%;
}

.pb-12 {
    padding-bottom: 3rem;
}

.pt-4 {
   padding-top: 1rem;
}

.my-8 {
   margin-top: 2rem;
   margin-bottom: 2rem;
}

.flex-wrap {
   flex-wrap: wrap;
}

.flex {
    display: flex;
}

@media (min-width: 1200px)
.container {
  max-width: 1200px;
}

@media (min-width: 992px)
.container {
   max-width: 992px
}

@media (min-width: 768px)
.container {
   max-width: 768px
}

@media (min-width: 576px)
.container {
   max-width: 576px
}

.container {
   width: 100%;
   margin-right: auto;
   margin-left: auto;
   padding-right: 1rem;
   padding-left: 1rem;
}


/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

footer,header,section {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

strong {
    font-weight: inherit;
    font-weight: bolder
}

img {
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

input,textarea {
    font-family: sans-serif;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

input {
    overflow: visible
}

/* 1 */
[type=reset],[type=submit],html [type=button] {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText
}

progress {
    display: inline-block;
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],[type=radio] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

/* 1 */
[hidden] {
    display: none
}

html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: sans-serif
}

*,:after,:before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}

h1,h2,h3,h4,h5,p {
    margin: 0
}

ul {
    margin: 0
}

*,:after,:before {
    border: 0 solid currentColor
}

img {
    border-style: solid
}

[type=button],[type=reset],[type=submit] {
    border-radius: 0
}

textarea {
    resize: vertical
}

img {
    max-width: 100%;
    height: auto
}

input,textarea {
    font-family: inherit
}

input::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
    color: inherit;
    opacity: .5
}

input:-ms-input-placeholder,input::-ms-input-placeholder,textarea:-ms-input-placeholder,textarea::-ms-input-placeholder {
    color: inherit;
    opacity: .5
}

input::placeholder,textarea::placeholder {
    color: inherit;
    opacity: .5
}

[role=button] {
    cursor: pointer
}

table {
    border-collapse: collapse
}

.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 1rem;
    padding-left: 1rem
}

@media (min-width: 576px) {
    .container {
        max-width:576px
    }
}

@media (min-width: 768px) {
    .container {
        max-width:768px
    }
}

@media (min-width: 992px) {
    .container {
        max-width:992px
    }
}

@media (min-width: 1200px) {
    .container {
        max-width:1200px
    }
}

.bg-back-light {
    background-color: #fff
}

.text-back-light {
    color: #fff
}

svg {
    fill: currentColor
}

.fill-lead {
    fill: #eee841
}

.section-header {
    color: #1f1f1f;
    font-size: .875rem;
    text-transform: uppercase
}

.btn,.section-header {
    font-family: Source Sans Pro,sans-serif;
    font-weight: 600
}

.btn {
    display: inline-block;
    text-decoration: none;
    padding: .5rem 1.5rem;
    line-height: 1.25;
    cursor: pointer;
    outline: 0;
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    will-change: opacity
}

.btn:hover {
    opacity: .75
}

.hover\:opacity-75 {
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    will-change: opacity
}

.dot {
    width: .5rem;
    height: .5rem;
    margin-right: .25rem
}

.dot,.dot-double {
    display: inline-block;
    border-radius: 9999px
}

.dot-double {
    position: relative;
    width: 54px;
    height: 54px
}

.dot-double:after {
    position: absolute;
    background-color: #fff;
    border-radius: 9999px;
    top: 18px;
    left: 18px;
    right: 18px;
    bottom: 18px;
    content: ""
}

.status-green {
    background-color: #53c72b
}

.status-default {
    background-color: #e58b5f
}

.contact {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 3.5rem;
    height: 3.5rem;
    padding-left: .5rem;
    padding-right: .5rem;
    background-color: #eee841;
    border-radius: 9999px;
    color: #1f1f1f;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (min-width: 992px) {
    .contact {
        width:auto;
        height: auto;
        font-family: Source Sans Pro,sans-serif;
        display: inline-block;
        text-decoration: none;
        font-weight: 600;
        padding-left: 1.5rem;
        padding-right: 1.5rem;
        line-height: 1.25;
        cursor: pointer;
        outline: 0;
        -webkit-transition: opacity .2s ease-out;
        transition: opacity .2s ease-out;
        will-change: opacity;
        padding: .5rem 1.5rem;
        border-radius: 1rem;
        -ms-flex-item-align: start;
        align-self: flex-start;
        margin-top: 1rem
    }
}

.avatar-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 9999px;
    background-color: #eee841;
    z-index: 0;
    -webkit-transform: translateX(35%);
    transform: translateX(35%)
}

.connect-icon {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 3rem;
    height: 3rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 9999px;
    background-color: #1f1f1f;
    color: #fff;
    margin-left: -.75rem;
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    will-change: opacity
}

.connect-icon:first-child {
    margin-left: 0
}

.connect-icon:nth-child(2n) {
    background-color: #fff;
    color: #1f1f1f
}

.connect-icon svg {
    fill: currentColor;
    width: 1.5rem;
    height: 1.5rem
}

.connect-icon:hover {
    opacity: .75
}

.skills {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin-left: -.5rem;
    margin-right: -.5rem
}

.skill {
    position: relative;
    border-radius: 9999px;
    border-width: 2px;
    font-family: Source Sans Pro,sans-serif;
    font-weight: 600;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    font-size: 1rem;
    color: #1f1f1f;
    padding-left: .5rem;
    padding-right: .5rem;
    margin: .5rem;
    width: calc(50vw - 2rem);
    height: calc(50vw - 2rem);
    max-width: 200px;
    max-height: 200px
}

.skill svg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transform: translate(8px,8px);
    transform: translate(8px,8px);
    opacity: .8;
    width: calc(100% - 16px)
}

.skill:nth-child(3n+1) {
    border-color: #b2a2e6
}

.skill:nth-child(3n+1) svg {
    color: #9079db
}

.skill:nth-child(3n+2) {
    border-color: #ecad8d
}

.skill:nth-child(3n+2) svg {
    color: #e58b5f
}

.skill:nth-child(3n+3) {
    border-color: #68b6e3
}

.skill:nth-child(3n+3) svg {
    color: #3ba1db
}

@media (min-width: 992px) {
    .skill {
        width:130px;
        height: 130px
    }
}

@media (min-width: 1200px) {
    .skill {
        width:144px;
        height: 144px
    }
}

.tools {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin-top: .5rem
}

.tool {
    display: inline-block;
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
    background-color: #eee841;
    padding: .25rem .75rem;
    font-family: Source Sans Pro,sans-serif;
    font-weight: 300;
    font-size: 1.5rem;
    color: #1f1f1f;
    margin-bottom: .25rem
}

.project {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: #fff;
    padding: 2rem;
    background-repeat: no-repeat;
    font-size: .875rem;
    margin-bottom: 1.5rem;
    background-image: -webkit-gradient(linear,left top,right top,color-stop(1%,#c3c8d5),color-stop(35%,#c3c8d5),color-stop(35%,#d2d6e0),to(#d2d6e0));
    background-image: linear-gradient(90deg,#c3c8d5 1%,#c3c8d5 35%,#d2d6e0 0,#d2d6e0);
    background-size: 100% 4px;
    background-repeat: no-repeat
}

.project-image {
    width: 100%;
    padding-bottom: 1rem
}

@media (min-width: 992px) {
    .project-image {
        width:40%;
        padding-right: 2rem;
        padding-bottom: 0
    }
}

.project h4 {
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto;
    width: 100%
}

.project p {
    padding-top: 1rem;
    padding-bottom: 1rem
}

.tags {
    list-style: none;
    padding: 0;
    padding-right: .5rem
}

.tag {
    display: inline-block;
    padding: .25rem .75rem;
    margin-right: .25rem;
    margin-top: .25rem;
    font-weight: 500;
    font-size: .75rem;
    border-radius: 1rem;
    border-width: 1px;
    border-color: #e8eaef
}

.project-icon {
    position: absolute;
    right: 0;
    bottom: 0;
    margin-bottom: 1.25rem;
    margin-right: 1.25rem;
    color: #e8eaef;
    width: 1.5rem;
    height: 1.5rem
}

.history {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem
}

.history:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    background-color: #cfd1d7;
    left: 50%;
    width: 2px;
    -webkit-transform: translateX(-1px);
    transform: translateX(-1px);
    content: ""
}

.history-entry {
    position: relative;
    width: 50%;
    padding-top: 1rem;
    padding-bottom: 1rem
}

.history-entry h4 {
    -webkit-font-smoothing: auto;
    -moz-osx-font-smoothing: auto
}

.history-entry h5 {
    font-size: .875rem;
    font-weight: 400
}

.history-entry:nth-child(odd) {
    -ms-flex-item-align: end;
    align-self: flex-end;
    padding-left: 3rem
}

.history-entry:nth-child(2n) {
    -ms-flex-item-align: start;
    align-self: flex-start;
    padding-right: 3rem;
    text-align: right
}

.history-entry .dot-double {
    position: absolute;
    top: 0;
    background-color: #cfd1d7;
    top: 50%
}

.history-entry:nth-child(odd) .dot-double {
    left: 0;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.history-entry:nth-child(2n) .dot-double {
    right: 0;
    -webkit-transform: translate(50%,-50%);
    transform: translate(50%,-50%)
}

.history-entry:first-child .dot-double {
    background-color: #1f1f1f
}

.history-entry:first-child .dot-double:after {
    background-color: #eee841
}

.form-control {
    width: 100%;
    color: #1f1f1f;
    padding: .75rem 1rem;
    font-family: Source Sans Pro,sans-serif;
    font-weight: 600;
    font-size: .875rem;
    outline: 0;
    line-height: 1.5
}

.form-input {
    background-color: #fff;
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out;
    will-change: opacity
}

.form-input:focus {
    opacity: .7
}

.checkbox {
    position: relative;
    display: inline-block;
    border-width: 2px;
    vertical-align: middle;
    margin-right: .5rem;
    margin-top: -.25rem;
    cursor: pointer;
    border-color: #e8eaef;
    width: 22px;
    height: 22px
}

.checkbox:after {
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    content: ""
}

.checkbox-on:after {
    background-color: #eee841
}

[data-checkbox-toggle] {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.inquiry-details {
    opacity: .3;
    height: 0;
    overflow: hidden;
    -webkit-transition: height .25s ease-in-out,opacity .25s ease-in-out;
    transition: height .25s ease-in-out,opacity .25s ease-in-out;
    will-change: opacity,height
}

.input-range {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    outline: 0;
    margin-bottom: .25rem;
    height: 1rem;
    background: transparent
}

.input-range:focus {
    outline: 0
}

.input-range::-moz-range-track {
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    background-color: #e8eaef;
    cursor: pointer;
    outline: 0;
    height: 2px
}

.input-range::-ms-track {
    appearance: none;
    width: 100%;
    background-color: #e8eaef;
    cursor: pointer;
    outline: 0;
    height: 2px
}

.input-range::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    background-color: #e8eaef;
    cursor: pointer;
    outline: 0;
    height: 2px
}

.input-range::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    border-radius: 9999px;
    width: 1rem;
    height: 1rem;
    background-color: #eee841;
    cursor: pointer;
    outline: 0;
    -webkit-transform: translateY(-6.5px);
    -moz-transform: translateY(0)
}

.input-range::-ms-thumb {
    appearance: none;
    border-radius: 9999px;
    width: 1rem;
    height: 1rem;
    background-color: #eee841;
    cursor: pointer;
    outline: 0;
    -webkit-transform: translateY(-6.5px);
    -moz-transform: translateY(0)
}

.input-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 9999px;
    width: 1rem;
    height: 1rem;
    background-color: #eee841;
    cursor: pointer;
    outline: 0;
    -webkit-transform: translateY(-6.5px);
    -moz-transform: translateY(0)
}

.bg-back {
    background-color: #e8eaef
}

.bg-front {
    background-color: #1f1f1f
}

.bg-lead {
    background-color: #eee841
}

.border-back {
    border-color: #e8eaef
}

.border-front {
    border-color: #1f1f1f
}

.border-line {
    border-color: #cfd1d7
}

.rounded-full {
    border-radius: 9999px
}

.border-solid {
    border-style: solid
}

.border-2 {
    border-width: 2px
}

.border-b-0 {
    border-bottom-width: 0
}

.border-r-2 {
    border-right-width: 2px
}

.border-r {
    border-right-width: 1px
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.table {
    display: table
}

.hidden {
    display: none
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.inline-flex {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.flex-col {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.flex-wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.font-header {
    font-family: Source Sans Pro,sans-serif
}

.font-text {
    font-family: Roboto,sans-serif
}

.font-light {
    font-weight: 300
}

.font-normal {
    font-weight: 400
}

.font-medium {
    font-weight: 500
}

.font-semibold {
    font-weight: 600
}

.font-bold {
    font-weight: 700
}

.font-black {
    font-weight: 900
}

.h-4 {
    height: 1rem
}

.h-5 {
    height: 1.25rem
}

.h-6 {
    height: 1.5rem
}

.h-14 {
    height: 3.5rem
}

.h-56 {
    height: 14rem
}

.h-full {
    height: 100%
}

.leading-none {
    line-height: 1
}

.leading-tight {
    line-height: 1.25
}

.leading-normal {
    line-height: 1.5
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.my-8 {
    margin-top: 2rem;
    margin-bottom: 2rem
}

.mb-1 {
    margin-bottom: .25rem
}

.mr-4 {
    margin-right: 1rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mt-12 {
    margin-top: 3rem
}

.mt-16 {
    margin-top: 4rem
}

.opacity-50 {
    opacity: .5
}

.p-4 {
    padding: 1rem
}

.py-1 {
    padding-top: .25rem;
    padding-bottom: .25rem
}

.py-3 {
    padding-top: .75rem;
    padding-bottom: .75rem
}

.px-3 {
    padding-left: .75rem;
    padding-right: .75rem
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem
}

.py-px {
    padding-top: 1px;
    padding-bottom: 1px
}

.pb-0 {
    padding-bottom: 0
}

.pt-1 {
    padding-top: .25rem
}

.pt-2 {
    padding-top: .5rem
}

.pb-3 {
    padding-bottom: .75rem
}

.pt-4 {
    padding-top: 1rem
}

.pr-4 {
    padding-right: 1rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pl-4 {
    padding-left: 1rem
}

.pb-6 {
    padding-bottom: 1.5rem
}

.pt-8 {
    padding-top: 2rem
}

.pb-8 {
    padding-bottom: 2rem
}

.pb-12 {
    padding-bottom: 3rem
}

.pb-16 {
    padding-bottom: 4rem
}

.relative {
    position: relative
}

.resize-none {
    resize: none
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.text-back {
    color: #e8eaef
}

.text-front {
    color: #1f1f1f
}

.text-lead {
    color: #eee841
}

.text-xs {
    font-size: .75rem
}

.text-sm {
    font-size: .875rem
}

.text-lg {
    font-size: 1.125rem
}

.text-xl {
    font-size: 1.25rem
}

.text-2xl {
    font-size: 1.5rem
}

.text-5xl {
    font-size: 3rem
}

.uppercase {
    text-transform: uppercase
}

.antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.visible {
    visibility: visible
}

.break-words {
    word-wrap: break-word
}

.w-4 {
    width: 1rem
}

.w-5 {
    width: 1.25rem
}

.w-6 {
    width: 1.5rem
}

.w-14 {
    width: 3.5rem
}

.w-56 {
    width: 14rem
}

.w-auto {
    width: auto
}

.w-1\/2 {
    width: 50%
}

.w-1\/3 {
    width: 33.33333%
}

.w-2\/3 {
    width: 66.66667%
}

.w-1\/4 {
    width: 25%
}

.w-3\/4 {
    width: 75%
}

.w-full {
    width: 100%
}

.z-10 {
    z-index: 1
}

@media (min-width: 992px) {
    .lg\:border-r {
        border-right-width:1px
    }

    .lg\:block {
        display: block
    }

    .lg\:hidden {
        display: none
    }

    .lg\:h-36 {
        height: 9rem
    }

    .lg\:mt-4 {
        margin-top: 1rem
    }

    .lg\:p-px {
        padding: 1px
    }

    .lg\:py-0 {
        padding-top: 0;
        padding-bottom: 0
    }

    .lg\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem
    }

    .lg\:px-px {
        padding-left: 1px;
        padding-right: 1px
    }

    .lg\:pl-8 {
        padding-left: 2rem
    }

    .lg\:pr-12 {
        padding-right: 3rem
    }

    .lg\:pl-12 {
        padding-left: 3rem
    }

    .lg\:w-36 {
        width: 9rem
    }

    .lg\:w-1\/3 {
        width: 33.33333%
    }

    .lg\:w-2\/3 {
        width: 66.66667%
    }

    .lg\:w-1\/4 {
        width: 25%
    }

    .lg\:w-3\/4 {
        width: 75%
    }

    .lg\:w-1\/5 {
        width: 20%
    }

    .lg\:w-3\/5 {
        width: 60%
    }

    .lg\:w-4\/5 {
        width: 80%
    }
}

@media (min-width: 1200px) {
    .xl\:px-12 {
        padding-left:3rem;
        padding-right: 3rem
    }

    .xl\:pl-12 {
        padding-left: 3rem
    }
}


/* Vertical line */
.history:before {
    @apply absolute block top-0 bottom-0 bg-line;
    left: 50%;
    width: 2px;
    transform: translateX(-1px);
    content: "";
  }
  
/* Copy on the right */
.history-entry:nth-child(odd) {
@apply self-end pl-12;
}

/* Copy on the left */
.history-entry:nth-child(even) {
@apply self-start pr-12 text-right;
}

.dot-bg {
@apply transform -translate-y-1/2;
top: 50%;
}

/* Dot positioning when copy on the right */
.history-entry:nth-child(odd) .dot-bg {
@apply left-0 -translate-x-1/2;
}

/* Dot positioning when copy on the left */
.history-entry:nth-child(even) .dot-bg {
@apply right-0 translate-x-1/2;
}

/* Different colors on the first item */
.history-entry:first-child .dot-bg {
@apply bg-front;
}

.history-entry:first-child .dot {
@apply bg-lead;
}

@media (prefers-color-scheme: dark) {
.history:before { @apply bg-line-dark; }
.history-entry:first-child .dot-bg { @apply bg-front-dark; }
.history-entry:first-child .dot { @apply bg-lead-dark; }
}
.dark .history:before { @apply bg-line-dark; }
.dark .history-entry:first-child .dot-bg { @apply bg-front-dark; }
.dark .history-entry:first-child .dot { @apply bg-lead-dark; }