@layer tokens {
    :root {
        --p2b-br-lg: 2rem;
        --p2b-grey-500: #d9d9d6;
    }
}

body {
    font-family: ProximaNovaRgRegular;
    font-size: 16px;
    background-color: white;
    color: black;
}

section#content #MainMiscContainer .DocumentTitle,
section#content #MainMiscContainer .DatesDivClass {
    display: none;
}

section#content .proudtobeaVINner,
section#content .proudtobeaVINner hgroup,
section#content .proudtobeaVINner section,
section#content .proudtobeaVINner div,
section#content .proudtobeaVINner ul,
section#content .proudtobeaVINner li,
section#content .proudtobeaVINner p,
section#content .proudtobeaVINner blockquote,
section#content .proudtobeaVINner .figure,
section#content .proudtobeaVINner .figCaption {
    margin: 0;
    padding: 0;
    display: block;
    border: none;
    line-height: 1.5;
}

section#content .proudtobeaVINner h1,
section#content .proudtobeaVINner h2,
section#content .proudtobeaVINner h3 {
    margin: 0;
    padding: 0;
    display: block;
    border: none;
    line-height: 1.5;
    width: 100%;
    text-align: center;
}

section#content .proudtobeaVINner h1,
section#content .proudtobeaVINner h3,
section#content .proudtobeaVINner #proudVINnerPage~section h2 {
    margin-bottom: 1.5rem;
}

section#content .proudtobeaVINner h2,
section#content .proudtobeaVINner .end {
    /* 
        makes the selected elements full screen width, despite container not being full screen width
        relies on calc() being supported, if not supported, the selected elements are set to the width of the container instead
    */
    width: 100%;
    margin-left: 0;
    width: calc(100vw);
    /* only sets this width if calc() supported, as the element's width needs to be the full screen width for the margin adjustment to work */
    margin-left: calc((50vw - 50%) * -1);
    /* negative margin to push element end to left of container's end, to the edge of the screen, by the correct amount, requires calc() */
}

section#content .proudtobeaVINner h2 {
    font-size: 2rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: white;
    background-color: #002855;
    padding: .75rem 0;
    margin-bottom: .25rem;
}



section#content .proudtobeaVINner h1,
section#content .proudtobeaVINner h3 {
    color: #002855;
}

section#content .proudtobeaVINner h3 {
    font-size: 1.75rem;
}

section#content .proudtobeaVINner a {
    font-style: normal;
    font-weight: normal;
    color: #002855;
}

section#content .proudtobeaVINner a,
section#content .proudtobeaVINner a:hover {
    cursor: pointer;
}

section#content .proudtobeaVINner a,
section#content .proudtobeaVINner a:hover,
section#content .proudtobeaVINner a:active,
section#content .proudtobeaVINner a:focus {
    text-decoration: underline;
    border: none;
    color: #002855;
}

section#content .proudtobeaVINner a:hover,
section#content .proudtobeaVINner a:active,
section#content .proudtobeaVINner a:focus {
    color: #6cace4;
}

section#content .proudtobeaVINner hgroup,
section#content .proudtobeaVINner section,
section#content .proudtobeaVINner .figure {
    width: 100%;
}

section#content .proudtobeaVINner .figure,
section#content .proudtobeaVINner .figCaption {
    text-align: center;
}

section#content .proudtobeaVINner section {
    margin-bottom: 1.5rem;
}

section#content .proudtobeaVINner em {
    font-style: normal;
    font-weight: normal;
    color: #002855;
}

section#content .proudtobeaVINner img {
    display: block;
    margin: 0 auto;
}

section#content .proudtobeaVINner {
    font-size: 1em;
    padding: 0 1rem;
    max-width: 1320px;
    margin: 0 auto;
}

section#content .proudtobeaVINner ul {
    list-style-type: none;
}

section#content .proudtobeaVINner h1 {
    font-family: ProximaNovaLtLight;
    font-size: 3rem;
}

section#content .proudtobeaVINner h1.lead {
    font-size: 8vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner h1.lead {
        font-size: 7rem;
    }
}

section#content .proudtobeaVINner h1 img {
    display: inline-block;
}

section#content .proudtobeaVINner h1.lead img {
    height: 7.5vw;
    margin-left: .1em;
    margin-right: .2em;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner h1.lead img {
        height: 1em;
    }
}

section#content .proudtobeaVINner blockquote {
    color: #63666a;
    font-size: 2rem;
    font-style: italic;
    text-align: center;
    position: relative;
}

section#content .proudtobeaVINner blockquote .dQuote {
    font-size: 3em;
    display: inline-block;
    position: absolute;
    line-height: 0;
}

section#content .proudtobeaVINner blockquote .dQuote.left {
    margin-left: -.5em;
    top: .4em;
}

section#content .proudtobeaVINner blockquote .dQuote.right {
    bottom: -.1em;
}

section#content .proudtobeaVINner section:not(#badges) .figure img {
    max-height: 30vh;
    max-width: 75%;
    margin-bottom: 1em;
}

section#content .proudtobeaVINner.page9245090 section .figure .figCaption em {
    text-transform: uppercase;
}

section#content .proudtobeaVINner section#clients {
    --figure-gap: 1rem;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--figure-gap);
}

section#content .proudtobeaVINner section#clients .figure {
    display: grid;
    place-items: center;
    gap: calc(var(--figure-gap) / 2);
}

@media screen and (width >= 768px) {
    section#content .proudtobeaVINner section#clients .figure {
        inline-size: calc(50% - (var(--figure-gap) / 2));
    }

    section#content .proudtobeaVINner section#clients .figure:first-of-type {
        position: relative;
    }

    section#content .proudtobeaVINner section#clients .figure:first-of-type > * {
        grid-area: 1 / 1;
    }

    section#content .proudtobeaVINner section#clients .figure:first-of-type img {
        max-block-size: 100%;
    }

    section#content .proudtobeaVINner section#clients .figure:first-of-type .figCaption {
        background-color: white;
        inset: auto 0 0 auto;
        inline-size: 35%;
        position: absolute;
    }
}

section#content .proudtobeaVINner section#clients .video-js {
    inline-size: 100%;
    block-size: auto;
    aspect-ratio: 16 / 9;
}

@media screen and (width >= 768px) {
    section#content .proudtobeaVINner section#clients .video-js {
        inline-size: 75%;
    }
}

section#content .proudtobeaVINner #badges ul {
    display: grid;
    gap: 2rem;
    padding-inline: 1rem;
}

@media screen and (width >= 768px) {
    section#content .proudtobeaVINner #badges ul {
        grid-template-columns: repeat(auto-fit, minmax(30ch, 30%));
        padding-inline: 0;
        justify-content: center;
    }
}

section#content .proudtobeaVINner #badges ul li {
    inline-size: 100%;
    block-size: 100%;

    display: grid;
    align-items: end;
    justify-items: center;

    padding: 1rem;
    
    background-color: white;
    border-radius: var(--p2b-br-lg);
    box-shadow: 5px 5px 11px 2px var(--p2b-grey-500);
}

section#content .proudtobeaVINner #badges .figure {
    display: grid;
    gap: 1rem;
}

section#content .proudtobeaVINner #badges .figure img {
    inline-size: 75%;
    max-block-size: 25vh;
    aspect-ratio: 1;
}

section#content .proudtobeaVINner #store h2 {
    margin-bottom: 1rem;
}

section#content .proudtobeaVINner #store h3 {
    color: #b3a369;
    line-height: 1;
}

section#content .proudtobeaVINner #store h3 em {
    color: #002855;
    font-size: 2.5em;
}

section#content .proudtobeaVINner #store img {
    max-width: 2126px;
    width: 100%
}

section#content .proudtobeaVINner .end {
    background-color: var(--p2b-grey-500);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 1rem;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner .end {
        flex-direction: row;
        padding: 1rem 0;
    }
}

section#content .proudtobeaVINner .end blockquote {
    margin-bottom: 1rem;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner .end blockquote {
        margin-bottom: 0;
    }
}

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

    section#content .proudtobeaVINner .end blockquote,
    section#content .proudtobeaVINner .end .figure {
        width: 40%;
    }
}

@media screen and (min-width: 992px) {

    section#content .proudtobeaVINner .end blockquote,
    section#content .proudtobeaVINner .end .figure {
        width: 30%;
    }
}

section#content .proudtobeaVINner .end .figure {
    flex: 1 1 auto;
    padding: 0 1rem;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner .end .figure {
        flex: none;
    }
}

section#content .proudtobeaVINner .end .figure img {
    max-width: 670px;
    border-radius: var(--p2b-br-lg);
}

section#content .proudtobeaVINner .end .figure .figCaption {
    font-size: 1rem;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner #decalInfo {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: baseline;
    }
}

@media screen and (min-width: 992px) {
    section#content .proudtobeaVINner #decalInfo {
        align-items: stretch;
    }
}

section#content .proudtobeaVINner #decalInfo li {
    width: 100%;
    border-bottom: 1px solid #d9d9d6;
    padding: 1rem 0;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner #decalInfo li {
        width: 45%;
        padding: 2rem 0;
    }
}

@media screen and (min-width: 992px) {
    section#content .proudtobeaVINner #decalInfo li {
        width: 100%;
        display: flex;
        justify-content: space-around;
        align-items: flex-start;
    }
}

@media screen and (min-width: 1320px) {
    section#content .proudtobeaVINner #decalInfo li {
        width: 50%;
    }
}

section#content .proudtobeaVINner #decalInfo li:first-of-type {
    padding-top: 0;
}

@media screen and (min-width: 992px) {
    section#content .proudtobeaVINner #decalInfo li:first-of-type {
        padding: 2rem 0;
    }
}

section#content .proudtobeaVINner #decalInfo li:last-of-type {
    border-bottom: none;
}

section#content .proudtobeaVINner #decalInfo li .figure,
section#content .proudtobeaVINner #decalInfo li>div {
    width: 100%;
}

@media screen and (min-width: 992px) {
    section#content .proudtobeaVINner #decalInfo li .figure {
        width: 30%;
    }
}

section#content .proudtobeaVINner #decalInfo li>div:not(.figure) {
    padding-top: 1rem;
}

@media screen and (min-width: 992px) {
    section#content .proudtobeaVINner #decalInfo li>div:not(.figure) {
        padding-top: 0;
        width: 40%;
    }
}

@media screen and (min-width: 992px) {
    section#content .proudtobeaVINner h2 {
        font-size: 3rem;
        padding: .5rem 0;
    }
}

section#content .proudtobeaVINner #decalInfo li .figure,
section#content .proudtobeaVINner #decalInfo li>div>p {
    margin-bottom: 1rem;
}

section#content .proudtobeaVINner #decalInfo li>div>p,
section#content .proudtobeaVINner #decalInfo li>div>code {
    width: 100%;
}

section#content .proudtobeaVINner #decalInfo li>div>code {
    display: block;
    background-color: #cbd3eb;
    padding: 1rem;
    color: #002855;
    font-size: 1rem;
    overflow: hidden;
    overflow-x: auto;
}

section#content .proudtobeaVINner #decalInfo li .figure img {
    max-width: 90%;
    max-height: 60vw;
}

@media screen and (min-width: 768px) {
    section#content .proudtobeaVINner #decalInfo li .figure img {
        max-height: 30vw;
    }
}