@font-face {
    font-family: vivoNormalFont;
    src: url(../fonts/vivoSansGlobal-Regular.woff2) format("woff2");
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: vivoBoldFont;
    src: url(../fonts/vivoSansGlobal-Bold.woff2) format("woff2");
    font-style: normal;
    font-display: swap
}

#prodvivo {
    overflow: hidden;
    padding: 0;
    font-family: vivoNormalFont, Arial, serif;
    color: #242933;
    background-color: #fff;
    font-size: 1rem;
}

#prodvivo * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline
}

#prodvivo .section {
    width: 100%;
    padding-left: .5rem;
    padding-right: .5rem
}

#prodvivo .lazy {
    width: auto;
    max-width: 100%;
    height: auto
}


#prodvivo .heading-2 {
    font-family: vivoBoldFont, Arial, serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.6em
}

#prodvivo .heading-3 {
    font-family: vivoBoldFont, Arial, serif;
    font-size: 1.025rem;
    font-weight: 400;
    line-height: 1.6em
}

#prodvivo .p {
    font-family: vivoNormalFont, Arial, serif;
    font-size: 1rem;
    line-height: 1.6em;
    font-weight: 400
}

#prodvivo .opacity-80 {
    opacity: .8
}

#prodvivo .small {
    font-size: .75rem;
    opacity: .8;
    font-family: vivoNormalFont, Arial, serif
}

#prodvivo .color-white {
    color: #fff
}

#prodvivo .color-blue {
    color: #00a3ff
}

#prodvivo .color-dark-blue {
    color: #005A91
}

#prodvivo .bg-grey {
    background: #f7f7f8
}

#prodvivo .bg-white {
    background-color: #fff
}

#prodvivo .bg-black {
    background-color: #000
}

#prodvivo .bg-dark-grey {
    background: #131313
}


#prodvivo .text-center {
    text-align: center
}


#prodvivo .rounded {
    border-radius: 1rem
}

#prodvivo .w-100 {
    width: 100%
}

#prodvivo .w-max-100 {
    max-width: 100%
}

#prodvivo .d-block {
    display: block
}

#prodvivo .box {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}


#prodvivo .grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: .5rem;
    margin-left: auto;
    margin-right: auto
}

#prodvivo .col-span-12 {
    grid-column: span 12/span 12
}

#prodvivo .p-3 {
    padding: 2rem
}



#prodvivo .py-4 {
    padding-top: 2rem;
    padding-bottom: 2rem
}


#prodvivo .pt-4 {
    padding-top: 2rem;
}

#prodvivo .pb-4 {
    padding-bottom: 2rem;
}

#prodvivo .px-b {
    padding-left: 1vw;
    padding-right: 1vw
}

#prodvivo .pt-3 {
    padding-top: 2rem
}

#prodvivo .pb-3 {
    padding-bottom: 2rem
}

#prodvivo .mx-auto {
    margin-left: auto;
    margin-right: auto
}

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


    #prodvivo .py-4 {
        padding-top: 4rem;
        padding-bottom: 4rem
    }

    #prodvivo .pt-4 {
        padding-top: 4rem;
    }

    #prodvivo .pb-4 {
        padding-bottom: 4rem;
    }



    #prodvivo .section {
        padding-left: 1vw;
        padding-right: 1vw
    }



    #prodvivo .px-b {
        padding-left: 10vw;
        padding-right: 10vw
    }

    #prodvivo .text-md-left {
        text-align: left
    }

    #prodvivo .text-center.text-md-left {
        text-align: left
    }

    #prodvivo .grid {
        gap: 1rem
    }



    #prodvivo .heading-2 {
        font-size: 2.5rem
    }

    #prodvivo .heading-3 {
        font-size: 1.25rem
    }


    #prodvivo .col-span-md-4 {
        grid-column: span 4/span 4
    }

    #prodvivo .col-span-md-6 {
        grid-column: span 6/span 6
    }


}

@media screen and (min-width:1200px) {
    #prodvivo .py-4 {
        padding-top: 6rem;
        padding-bottom: 6rem
    }

    #prodvivo .pt-4 {
        padding-top: 6rem;
    }

    #prodvivo .pb-4 {
        padding-bottom: 6rem;
    }

    #prodvivo .px-b {
        padding-left: 10vw;
        padding-right: 10vw
    }

    #prodvivo .section {
        padding-left: 5vw;
        padding-right: 5vw
    }


}