:root,
body {
    --c-black: var(--wp--preset--color--black);
    --c-black-75:#fff;

    --c-iron: #dadbdd;
    --c-white: var(--wp--preset--color--white);
    --c-accent: #e6fc58;
    --c-accent-secondary: #d6001c;
    --c-background: var(--c-wild-sand);

    color: var(--c-ebony-clay);
    --gradient-home-hero-bg: linear-gradient(0deg, rgba(20, 20, 20, 0.7) 0%, transparent);
    --gradient-home-post-after: linear-gradient(0deg, transparent 50%, #000000 51%);
    --gradient-home-post-before: linear-gradient(0deg, rgba(20, 20, 20, 0.7) 0%, transparent);
    --gradient-icon-hover: linear-gradient(0deg, transparent 50%, #fff 51%);
    --neon-shadow: 0 0 10px 10px var(--c-neon)
}

:root.has-dark-mode {
    --c-black: #fff;
    --c-black-75: hsla(0, 0%, 100%, 0.75);
    --c-black-70: hsla(0, 0%, 100%, 0.7);
    --c-black-60: hsla(0, 0%, 100%, 0.6);
    --c-black-50: hsla(0, 0%, 100%, 0.5);
    --c-ebony-clay: #f4f4f4;
    --c-ebony-clay-90: hsla(0, 0%, 95.7%, 0.9);
    --c-ebony-clay-75: hsla(0, 0%, 95.7%, 0.75);
    --c-ebony-clay-60: hsla(0, 0%, 95.7%, 0.6);
    --c-dark-gray: #e8e8e8;
    --c-abbey: #dcdcdc;
    --c-rolling-stone: #dadbdd;
    --c-rolling-stone-60: rgba(218, 219, 221, 0.6);
    --c-rolling-stone-40: rgba(218, 219, 221, 0.4);
    --c-rolling-stone-20: rgba(218, 219, 221, 0.2);
    --c-iron: #6b6f73;
    --c-alto: #525558;
    --c-mercury: #4a4a4a;
    --c-wild-sand: #1d252d;
    --c-white: #141414;
    --c-white-60: rgba(20, 20, 20, 0.6);
    --c-white-40: rgba(20, 20, 20, 0.4);
    --c-white-15: rgba(20, 20, 20, 0.15);
    --c-white-10: rgba(20, 20, 20, 0.1);
    --c-background: var(--c-white);
    --gradient-home-post-after: linear-gradient(0deg, transparent 50%, #fff 51%);
    color: var(--c-ebony-clay)
}

:root {
    --site-navigation-padding-xl: 0.5rem;
    --site-navigation-padding-xxl: 0.75rem;
    --site-header-height: 72px;
    --secondary-nav-height: 0
}

@media (min-width:76.25em) {
    :root {
        --site-header-height: 80px
    }
}

:root {
    --transition-fast: 0.2s;
    --transition: 0.3s;
    --transition-long-ease: "0.3s ease-in";
    --transition-ease-out: cubic-bezier(0.16, 1.08, 0.38, 0.98);
    --transition-ease-out-slow: cubic-bezier(0.19, 1, 0.22, 1)
}


@media (prefers-reduced-motion:no-preference) {
    .lazy-img img {
        opacity: 1;
        transition: opacity .6s ease-out .1s
    }
}

@-webkit-keyframes bounce {
    0%,
    20%,
    50%,
    80%,
    to {
        transform: translateY(0)
    }
    40% {
        transform: translateY(-20px)
    }
    60% {
        transform: translateY(-15px)
    }
}

@keyframes bounce {
    0%,
    20%,
    50%,
    80%,
    to {
        transform: translateY(0)
    }
    40% {
        transform: translateY(-20px)
    }
    60% {
        transform: translateY(-15px)
    }
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fade-in {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}


@media (min-width:64.0625em) {
    .rich-text h1:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-18x);
        line-height: var(--line-height-17x)
    }
}

.rich-text h2:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    font-family: var(--font-medium);
    font-style: normal;
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-14x);
    letter-spacing: var(--letter-spacing-sm);
    line-height: var(--line-height-9x)
}

@media (min-width:48em) {
    .rich-text h2:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-15x);
        line-height: var(--line-height-7x)
    }
}

@media (min-width:64.0625em) {
    .rich-text h2:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-17x);
        letter-spacing: var(--letter-spacing-normal);
        line-height: var(--line-height-6x)
    }
}

.rich-text h3:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    font-family: var(--font-medium);
    font-style: normal;
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-13x);
    line-height: var(--line-height-13x)
}

@media (min-width:64.0625em) {
    .rich-text h3:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-15x);
        line-height: var(--line-height-14x)
    }
}

.rich-text h4:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    font-family: var(--font-medium);
    font-style: normal;
    font-weight: var(--font-weight-normal);
    font-size: 1.375rem;
    line-height: var(--line-height-8x)
}

@media (min-width:64.0625em) {
    .rich-text h4:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-13x);
        line-height: var(--line-height-13x)
    }
}

.rich-text h5:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    font-family: var(--font-medium);
    font-style: normal;
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-7x);
    letter-spacing: var(--letter-spacing-md);
    line-height: var(--line-height-21x);
    line-height: var(--line-height-16x)
}

@media (min-width:64.0625em) {
    .rich-text h5:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {

        line-height: var(--line-height-21x)
    }
}

.rich-text h6:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    font-style: normal;
    font-weight: var(--font-weight-normal);
    font-family: var(--font-medium);
    font-size: var(--font-size-5x);

}

@media (min-width:48em) {
    .rich-text h6:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-6x);
        letter-spacing: var(--letter-spacing-normal);
        line-height: var(--line-height-26x)
    }
}

@media (min-width:64.0625em) {
    .rich-text h6:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        font-size: var(--font-size-8x);
        line-height: var(--line-height-29x)
    }
}

:where(.is-layout-flex) {
    grid-gap: 1rem;
    gap: 1rem
}

@media (min-width:48em) {
    :where(.is-layout-flex) {
        grid-gap: 2rem;
        gap: 2rem
    }
}

.rich-text :where(h1, .is-style-h1):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
    margin-bottom: 20px;
    margin-top: 2pc
}

@media (min-width:64.0625em) {
    .rich-text :where(h1, .is-style-h1):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
        margin-bottom: 40px;
        margin-top: 20px
    }
}

.rich-text :where(h2, .is-style-h2):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
    margin-bottom: 1pc;
    margin-top: 28px
}

@media (min-width:64.0625em) {
    .rich-text :where(h2, .is-style-h2):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
        margin-bottom: 24px;
        margin-top: 40px
    }
}

.rich-text :where(h3, .is-style-h3):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
    margin-bottom: 10px;
    margin-top: 24px
}

@media (min-width:64.0625em) {
    .rich-text :where(h3, .is-style-h3):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
        margin-bottom: 20px;
        margin-top: 40px
    }
}

.rich-text :where(h4, .is-style-h4):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
    margin-bottom: 1pc;
    margin-top: 24px
}

.rich-text :where(h5, .is-style-h5, h6, .is-style-h6):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
    margin-bottom: 10px;
    margin-top: 9pt
}

.rich-text :where(p, li, .is-style-body, .is-style-body-lg):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
    margin-bottom: 20px;
    margin-top: 10px
}

@media (min-width:64.0625em) {
    .rich-text :where(p, li, .is-style-body, .is-style-body-lg):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) {
        margin-bottom: 28px
    }
}

.rich-text :where(p, li, .is-style-body, .is-style-body-lg):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) a {
    text-decoration: underline;
    -webkit-text-decoration-color: var(--c-rolling-stone-60);
    text-decoration-color: var(--c-rolling-stone-60);
    text-underline-offset: 3px;
    background-image: linear-gradient(transparent, transparent 50%, #e6fc58 0, #e6fc58);
    background-position: 0 0;
    background-size: 100% 200%;
    color: inherit;
    display: inline;
    font-weight: var(--font-weight-normal);
    position: relative;
    transition: background .2s cubic-bezier(.29, .18, .26, .83), color .2s cubic-bezier(.29, .18, .26, .83);
    transition: background .2s var(--anim-custom-bezier), color .2s var(--anim-custom-bezier);
    word-break: break-word
}

.rich-text :where(p, li, .is-style-body, .is-style-body-lg):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) a:focus-visible,
.rich-text :where(p, li, .is-style-body, .is-style-body-lg):not([class*=rich-text--reset]):not([class*=rich-text--reset]*):not(figure*) a:hover {
    background-position: 0 60%;
    color: var(--c-ebony-clay)
}

.rich-text :where(ol, ul):not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    list-style-type: none;
    margin-bottom: 20px;
    margin-top: 10px
}

@media (min-width:64.0625em) {
    .rich-text :where(ol, ul):not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        margin-bottom: 28px
    }
}

.rich-text:where(ol):not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    counter-reset: ordered-list-counter
}

.rich-text .wp-block-image:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
    margin-bottom: 15px;
    margin-top: 35px;
    padding: 0
}

@media (min-width:64.0625em) {
    .rich-text .wp-block-image:not([class*=rich-text--reset]):not([class*=rich-text--reset]*) {
        margin-bottom: 60px;
        margin-top: 60px
    }
}

.rich-text .wp-block-image:not([class*=rich-text--reset]):not([class*=rich-text--reset]*).is-style-vertical-spacing-tight {
    margin-bottom: 10px;
    margin-top: 10px
}

@-webkit-keyframes loading-bg-color {
    0%,
    to {
        opacity: .4
    }
    50% {
        opacity: 1
    }
}

.grid-item {
    display: block;
    height: 100%;
    margin-bottom: 3px;
    position: relative
}

@media (min-width:48em) {
    .grid-item {
        margin-bottom: 0
    }
}

.grid-item:before {
    content: "";
    display: inline-block;
    height: 0;
    padding-top: 100%;
    position: relative;
    width: 1px;
    z-index: -1
}

.grid-item.grid-item--title:before {
    padding-top: 50%
}

.grid-item .grid-item__img-wrapper {
    position: absolute !important;
    top: 0
}

@media (min-width:48em) {
    .grid-item .grid-item__content {
        bottom: 0;
        display: flex;
        flex-flow: column nowrap;
        justify-content: center;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
        align-items: center;
        display: -ms-grid;
        display: grid;
        justify-items: start
    }
}

@supports (display:grid) {
    .grid--three-column {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: (minmax(0, 1fr))[2];
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin: -4px
    }
    .grid--three-column>* {
        width: 100%
    }
    @media (min-width:48em) {
        .grid--three-column {
            -ms-grid-columns: (minmax(0, 1fr))[3];
            grid-template-columns: repeat(3, minmax(0, 1fr));
            margin: -5px
        }
    }
    @media (min-width:76.25em) {
        .grid--three-column {
            margin: -10px
        }
    }
    .grid--three-column.mobile-one-column {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr
    }
    @media (min-width:48em) {
        .grid--three-column.mobile-one-column {
            -ms-grid-columns: (minmax(0, 1fr))[3];
            grid-template-columns: repeat(3, minmax(0, 1fr))
        }
    }
}

:root {
    --padding-question-link-even: 60px 0 60px 40px;
    --padding-question-link-odd: 60px 40px 60px 0;
    --padding-question: 3.125rem;
    --width-home-item-large: 515px;
    --width-home-item-offset: 16.25%;
    --width-home-item: 25.9375rem
}

@media (min-width:23.4375em) {
    :root {
        --padding-question: 4.0625rem
    }
}

@media (min-width:48em) {
    :root {
        --padding-question: 4.6875rem
    }
}

@media (min-width:64.0625em) {
    :root {
        --padding-question: 0.1875rem
    }
}

@media (min-width:90em) {
    :root {
        --padding-question-link-even: 90px 0 90px 50px;
        --padding-question-link-odd: 90px 50px 90px 0
    }
}

.grid-block {
    margin-bottom: 2.1875rem
}

@media (min-width:48em) {
    .grid-block {
        margin-bottom: 4.375rem
    }
}

@media (min-width:76.25em) {
    .grid-block {
        margin-bottom: 9rem
    }
}
/*
.grid-card {
    height: auto;
    margin-top: 0;
    width: 100%
}

.grid-card,
.grid-card__link-wrapper {
    display: flex;
    flex-flow: column nowrap
}

.grid-card__link-wrapper {
    height: 100%;
    touch-action: manipulation
}

.grid-card__link-wrapper:focus-visible {
    box-shadow: var(--c-accent) 0 0 3px 3px;
    box-shadow: var(--c-accent) 0 0 var(--focus-width) var(--focus-width);
    outline-color: var(--c-black);
    outline-offset: 3px;
    outline-offset: var(--focus-width);
    outline-style: solid;
    outline-width: 3px;
    outline-width: var(--focus-width)
}

.grid-card__thumbnail {
	background-color: #000;
    height: 0;
    overflow: hidden;
    padding-top: 80.8451345%;
    position: relative;
    width: 100%
}

.grid-card__thumbnail img {
    border: 0;
    display: block;
    height: 100%;
    left: 0;
    max-width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    opacity: 1;
    position: absolute;
    top: 0;
    transition: none 0s ease 0s;
    vertical-align: middle;
    width: 100%
}

.grid-card__header {
    background-color: var(--c-white);
    display: flex;
    flex: 1 0 auto;
    flex-flow: column nowrap;
    overflow: hidden;
    padding: 14px;
    position: relative
}

@media (min-width:36.25em) {
    .grid-card__header {
        justify-content: flex-start
    }
}

@media (min-width:64.0625em) {
    .grid-card__header {
        padding: 25px
    }
}


.grid-card__header>* {
    position: relative;
    transition: color .2s;
    z-index: 1
}

.grid-card__link-wrapper:focus-visible .grid-card__header>*,
.grid-card__link-wrapper:hover .grid-card__header>* {
    color: var(--c-white)
}

.grid-card__header:after {
    background-image: var(--gradient-home-post-after);
    background-position: 0 100%;
    background-size: 100% 200%;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transform: translateX(0);
    transition: background-position .2s ease;
    width: 100%;
    will-change: transform
}

.grid-card__link-wrapper:focus-visible .grid-card__header:after,
.grid-card__link-wrapper:hover .grid-card__header:after {
    background-position: 0 200%;
    height: 102%
}

.grid-card__name {
	font-size: 32px;;
	color: #000;
}

.grid-card__name,
    font-style: normal;
    font-size: 32px;
    letter-spacing: -.05px;
    line-height: 1.1;
}

.grid-card__title {
    font-size: 20px;
        letter-spacing: -.05px;
    line-height: 1.1;

}

@media (min-width:64.0625em) {
    .grid-card__title {
        font-size: 24px;
    }
}

.grid-card__title {
    color: #fff;
}

.grid-card--office .grid-card__title {

}

@media (min-width:48em) {
    .grid-card--office .grid-card__title {

    }
}

.grid-card--office .grid-card__title {
    margin-top: 3px
}

@media (min-width:48em) {
    .grid-card--office .grid-card__title {
        margin-bottom: 0;
        margin-top: 5px
    }
}

.grid-card--content .grid-card__title {

    font-style: normal;
}

@media (min-width:48em) {
    .grid-card--content .grid-card__title {

    }
}

@media (min-width:64.0625em) {
    .grid-card--content .grid-card__title {

    }
}

.grid-card__name+.grid-card__title {
    margin-top: 6px;
    text-transform: uppercase;
    color: #000;
    font-family: "ABCDiatypeLight";
    font-size: 18px;
    letter-spacing: .5px;

    }

@media (min-width:48em) {
    .grid-card__name+.grid-card__title {
        margin-bottom: 0
    }
}

.grid-card__office {
    margin: 10px 0;
    word-wrap: break-word
}

@media (min-width:36.25em) {
    .grid-card__office {
        margin: 10px 0 0
    }
}

@media (min-width:64.0625em) {
    .grid-card__office {
        margin-top: 10px
    }
}
*/
.header-block {
    padding: 0 11px;
    width: 100%
}

@media (min-width:48em) {
    .header-block {
        padding: 0 2pc
    }
}

@media (min-width:64.0625em) {
    .header-block {
        padding: 0 52px
    }
}

.header-block.header-block--dark {
    padding: 0
}

.header-block__title-wrapper {
    margin-bottom: 25px
}





.header-block--dark .header-block__title-wrapper {
    align-items: center;


    display: flex;
    flex-flow: row nowrap;
    height: 100%;
    justify-content: space-between;
    margin-bottom: 8px;
    padding: 11px 15px
}

@media (min-width:48em) {
    .header-block--dark .header-block__title-wrapper {
        padding: 13px 20px
    }
}

@media (min-width:64.0625em) {
    .header-block--dark .header-block__title-wrapper {
        margin-bottom: 4px;
        padding: 18px 25px
    }
}

.header-block__title {
    font-family: var(--font-medium);
    font-style: normal;
    font-weight: var(--font-weight-normal)
}

.header-block__title {
    font-size: var(--font-size-12x);
    letter-spacing: var(--letter-spacing-sm);
    line-height: var(--line-height-10x)
}

@media (min-width:48em) {
    .header-block__title {

    }
}

@media (min-width:64.0625em) {
    .header-block__title {
         
    }
}

.header-block__title {
    margin: 0
}

.header-block--dark .header-block__title {
    font-style: normal;
}

@media (min-width:64.0625em) {
    .header-block--dark .header-block__title {

        line-height: var(--line-height-21x)
    }
}

@media (min-width:64.0625em) {
    .header-block__content-wrapper {
        align-items: flex-start;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between
    }
}

@media (min-width:48em) {
    .header-block__content {
        max-width: 580px
    }
}

@media (min-width:64.0625em) {
    .header-block__content {
        max-width: 642px
    }
}

.header-block__content-text {

    font-style: normal;

}

@media (min-width:48em) {
    .header-block__content-text {


    }
}

.header-block__content-text {

}



.post-grid__inner {
    display: grid;
    grid-gap: 24px
}

@media (min-width:48em) {
    .post-grid__inner {
        grid-gap: 2pc 4px;
        -ms-grid-columns: (minmax(0, 1fr))[3];
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

.post-grid__item {
    box-sizing: border-box;
    display: flex;
    width: 100%
}




.card {
    padding: 1.5px
}

@media (min-width:48em) {
    .card:first-child {
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1/3;
        -ms-grid-row: 1;
        -ms-grid-row-span: 2;
        grid-row: 1/3
    }
}

@media (min-width:48em) {
    .card:nth-child(2) {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3/4;
        -ms-grid-row: 1;
        grid-row: 1
    }
}

@media (min-width:48em) {
    .card:nth-child(3) {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3/4;
        -ms-grid-row: 2;
        grid-row: 2
    }
}

@media (min-width:48em) {
    .card:nth-child(4) {
        -ms-grid-column: 1;
        -ms-grid-column-span: 3;
        grid-column: 1/4;
        -ms-grid-row: 3;
        grid-row: 3
    }
}

@media (min-width:48em) {
    .card:nth-child(5) {
        -ms-grid-column: 2;
        -ms-grid-column-span: 2;
        grid-column: 2/4;
        -ms-grid-row: 4;
        grid-row: 4
    }
}

@media (min-width:48em) {
    .card:nth-child(6) {
        -ms-grid-column: 1;
        -ms-grid-column-span: 1;
        grid-column: 1/2;
        -ms-grid-row: 4;
        grid-row: 4
    }
}

@media (min-width:48em) {
    .card:nth-child(7) {
        -ms-grid-column: 1;
        -ms-grid-column-span: 3;
        grid-column: 1/4;
        -ms-grid-row: 5;
        grid-row: 5
    }
}

@media (min-width:48em) {
    .card:nth-child(8) {
        -ms-grid-column: 1;
        -ms-grid-column-span: 2;
        grid-column: 1/3;
        -ms-grid-row: 6;
        grid-row: 6
    }
}

@media (min-width:48em) {
    .card:nth-child(9) {
        -ms-grid-column: 3;
        -ms-grid-column-span: 1;
        grid-column: 3/4;
        -ms-grid-row: 6;
        grid-row: 6
    }
}

.card .img {
    height: 100%;
    width: 100%
}

.card .img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center
}

.card .article,
.card .article:before {
    bottom: 0;
    position: absolute;
    width: 100%
}

.card .article:before {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, .7) 0, transparent);
    content: "";
    height: 150%;
    left: 0
}

@-webkit-keyframes animateRightTopLeftBorder {
    0% {
        background-size: 2px 0, 0 2px, 100% 2px, 2px 0
    }
    33% {
        background-size: 2px 0, 0 2px, 100% 2px, 2px 100%
    }
    66% {
        background-size: 2px 0, 100% 2px, 100% 2px, 2px 100%
    }
    to {
        background-size: 2px 100%, 100% 2px, 100% 2px, 2px 100%
    }
}

@keyframes animateRightTopLeftBorder {
    0% {
        background-size: 2px 0, 0 2px, 100% 2px, 2px 0
    }
    33% {
        background-size: 2px 0, 0 2px, 100% 2px, 2px 100%
    }
    66% {
        background-size: 2px 0, 100% 2px, 100% 2px, 2px 100%
    }
    to {
        background-size: 2px 100%, 100% 2px, 100% 2px, 2px 100%
    }
}

@-webkit-keyframes animateBottomBorder {
    0% {
        background-size: 2px 0, 0 2px, 0 2px, 2px 0
    }
    to {
        background-size: 2px 0, 0 2px, 100% 2px, 2px 0
    }
}

@keyframes animateBottomBorder {
    0% {
        background-size: 2px 0, 0 2px, 0 2px, 2px 0
    }
    to {
        background-size: 2px 0, 0 2px, 100% 2px, 2px 0
    }
}