:root {
    --green-light: #F2F5DF;
    --green: #52540A;
}

body {
    background-color: var(--green-light);
}

.container-fluid {
    padding: 0 40px;
}

header.header {
    z-index: 10000;
    position: absolute;
}

.loading {
    background-color: var(--green-light);
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 10;
}
.tooltip .tooltip-inner {
    background-color: #132349;
    padding: 10px;
    border-radius: 10px;
    font-size: 14px;
}
.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before {
    border-top-color: #132349;
}
.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before {
    border-left-color: #132349;
}
.bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before {
    border-right-color: #132349;
}
.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before {
    border-bottom-color: #132349;
}

.pin {
    width: 66px;
    height: 66px;
    background: url(../img/infografico/pin.svg) center center no-repeat;
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 1;
}
.pin.right-bottom {
    background: url(../img/infografico/pin-right-bottom.svg) center center no-repeat;
}
.pin.left-top {
    background: url(../img/infografico/pin-left-top.svg) center center no-repeat;
}
.pin.right-top {
    background: url(../img/infografico/pin-right-top.svg) center center no-repeat;
}
.pin:hover:before {
    transform: rotate(360deg);
}
.pin:before {
    content: '';
    background: url(../img/infografico/mais.svg) center center no-repeat;
    background-size: 100% 100%;
    width: 28px;
    height: 28px;
    display: block;
    transition: all .3s ease;
}

.pin-azul {
    background: url(../img/infografico/pin-azul.svg) center center no-repeat;
    background-size: 100% 100%;
}
.pin.right-bottom-azul {
    background: url(../img/infografico/pin-right-bottom-azul.svg) center center no-repeat;
}
.pin.left-top-azul {
    background: url(../img/infografico/pin-left-top-azul.svg) center center no-repeat;
}
.pin.right-top-azul {
    background: url(../img/infografico/pin-right-top-azul.svg) center center no-repeat;
}

/* view1 */
.view1 {
    position: relative;
    padding-top: 140px;
    min-height: 650px;
}
.view1 .bola-mosaico {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 112%;
    max-width: 1400px;
}
.view1 .bola-verde {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 93%;
    max-width: 1200px;
}
.view1 .logos {
    display: flex;
    gap: 18px;
    justify-content: center;
    align-items: baseline;
    margin-bottom: 37px;
}
.view1 .text {
    max-width: 900px;
    position: relative;
    z-index: 1;
    margin: 0 auto 0;
}
.view1 .text h1 {
    font-family: 'Sentient-Medium';
    font-size: 50px;
    font-weight: 500;
    color: var(--green-light);
    text-align: center;
}
.view1 .text h1 strong {
    font-family: 'Sentient-Medium';
    font-size: 64px;
    font-weight: 500;
    color: var(--green-light);
    display: block;
}
.view1 .bt {
    font-size: 16px;
    text-transform: uppercase;
    color: var(--green);
    background-color: var(--green-light);
    padding: 10px 25px;
    border-radius: 100px;
    margin: 22px auto 0;
    display: table;
    text-decoration: none;
}

/* view2 */
.view2 {
    padding-top: 150px;
    position: relative;
}
.view2 .ilustracao2 {
    width: 100%;
}
.view2 .title1 {
    max-width: 630px;
    margin-left: 12%;
}
.view2 .title2 {
    max-width: 500px;
    position: absolute;
    top: 50%;
    left: 8%;
}
.view2 .content {
    position: relative;
}
.view2 .nuvem1 {
    position: absolute;
    width: 180px;
    top: 3%;
    left: 4%;
}
.view2 .nuvem2 {
    position: absolute;
    width: 220px;
    top: 5%;
    left: 30%;
}
.view2 .nuvem3 {
    position: absolute;
    width: 140px;
    right: 10%;
    top: 2%;
}
.view2 .nuvem4 {
    position: absolute;
    right: 2%;
    top: 52%;
    z-index: 1;
}
.view2 .nuvem4 img {
    width: 500px;
}

.view2 .pin1 {
    right: 31%;
    top: 5%;
}
.view2 .pin2 {
    left: 50%;
    top: 33%;
}
.view2 .pin3 {
    left: 45%;
    top: 30%;
}
.view2 .pin4 {
    left: 38%;
    bottom: 31%;
}
.view2 .pin5 {
    left: 42%;
    bottom: 10%;
}
.view2 .vacas1 {
    position: absolute;
    bottom: 6%;
    z-index: 1;
    width: 30%;
    right: 14%;
}

/* view3 */
.view3 {
    position: relative;
}
.view3 .ilustracao3 {
    width: 100%;
}
.view3 .nuvem5 {
    position: absolute;
    top: 17%;
    right: 2%;
    z-index: 2;
    width: 52%;
}
.view3 .nuvem5 img {
    width: 100%;
}
.view3 .nuvem5 .pin6 {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 45%;
}
.view3 .sol1 {
    position: absolute;
    top: -50px;
    right: 12%;
    width: 32%;
    z-index: 1;
}
.view3 .title3 {
    max-width: 850px;
    position: absolute;
    top: 10%;
    left: 2%;
}
.view3 .indio1 {
    width: 9%;
    position: absolute;
    left: 20%;
    bottom: 19%;
    z-index: 1;
}
.view3 .abelha1 {
    width: 5%;
    position: absolute;
    left: 6%;
    bottom: 15%;
    z-index: 1;
}
.view3 .abelha2 {
    width: 3%;
    position: absolute;
    left: 14%;
    bottom: 12%;
    z-index: 1;
}
.view3 .peixe1 {
    width: 5%;
    position: absolute;
    left: 49%;
    bottom: 5%;
    z-index: 1;
}

/* view4 */
.view4 {
    position: relative;
    padding: 150px 0 200px;
}
.view4 .content {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
}
.view4 .box {
    background-color: #C2D385;
    padding: 50px 16px 58px;
    text-align: center;
    width: 350px;
}
.view4 .box h3 {
    font-size: 30px;
    font-weight: 500;
    line-height: 120%;
    color: #52531A;
}
.view4 .box.left {
    border-radius: 42px 0 0 42px;
}
.view4 .box.right {
    border-radius: 0 42px 42px 0;
}
.view4 .box .bt {
   background-color: #132349;
   color: var(--green-light);
   text-transform: uppercase;
   font-size: 16px;
   font-weight: 600;
   text-decoration: none;
   padding: 5px 15px;
   border-radius: 100px;
   margin: 32px auto 0;
   display: table;
}

/* view5 */
.view5 {
    position: relative;
}
.view5 .grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
}
.view5 .text {
    max-width: 500px;
    margin-top: 50px;
}
.view5 .grid .ball {
    width: 100%;
    position: relative;
}
.view5 .bola-mosaico {
    width: 100%;
}
.view5 .ilustracao {
    position: absolute;
    left: 9%;
    top: 5%;
    width: 81%;
}
.view5 .onda-verde {
    width: 100%;
}
.view5 .foto1 {
    position: absolute;
    top: 26%;
    z-index: 4;
}
.view5 .foto2 {
    position: absolute;
    top: 38%;
    left: 11%;
    z-index: 3;
}
.view5 .foto3 {
    position: absolute;
    top: 59%;
    left: 20%;
    z-index: 2;
}
.view5 .foto4 {
    position: absolute;
    top: 65%;
    left: 2%;
    z-index: 1;
}
.view5 .ball .pin7 {
    z-index: 1;
    top: 25%;
    left: 65%;
}
.view5 .ball .pin8 {
    z-index: 1;
    top: 37%;
    left: 37%;
}
.view5 .ball .pin9 {
    z-index: 1;
    top: 57%;
    left: 32%;
}
.view5 .ball .pin10 {
    z-index: 1;
    top: 67%;
    left: 67%;
}


/* view 6 */
.view6 {
    margin-top: -5px;
    background-color: #6E7135;
    padding-bottom: 30px;
}
.view6 .container-fluid {
    max-width: 1500px;
}
.view6 .grid {
    display: grid;
    grid-template-columns: 1fr 4fr;
    gap: 100px;
    margin-bottom: 100px;
}
.view6 h2, .view6 .grid h3, .view6 p {
    color: var(--green-light);
}
.view6 .grid .right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
}
.view6 .grid h3 {
    padding-left: 10px;
    min-height: 87px;
    font-size: 36px;
}
.view6 .grid p {
    max-width: 450px;
    padding-left: 10px;
    min-height: 135px;
}
.view6 .grid img {
    max-width: 100%;
    height: auto;
}
.view6 .blocks {
    display: flex;
    align-items: center;
    gap: 40px;
    margin: 50px auto 0;
    justify-content: center;
}
.view6 .blocks .box {
    color: var(--green);
    border-radius: 42px;
    background-color: #C2D385;
    text-align: center;
    padding: 30px;
    max-width: 400px;
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.view6 .blocks .box h3, .view6 .blocks .box p {
    color: var(--green);
}

/* view 7 */
.view7 {
    margin: -10px;
}
.view7 h2 {
    padding-top: 100px;
}
.view7 .ilustracao {
    margin-top: -50px;
}
.view7 .ilustras {
    position: relative;
}
.view7 .pessoa {
    position: absolute;
    z-index: 1;
    width: 4%;
    top: 15%;
    left: 37%;
}
.view7 .vaca1 {
    position: absolute;
    z-index: 2;
    width: 11%;
    top: 56%;
    left: 46%;
}
.view7 .vaca2 {
    position: absolute;
    z-index: 1;
    width: 100px;
    top: 50%;
    left: 52%;
    width: 12%;
}
.view7 .galinha1 {
    position: absolute;
    z-index: 3;
    width: 3%;
     top: 63%;
    left: 60%;
}
.view7 .galinha2 {
    position: absolute;
    z-index: 3;
    width: 4%;
     top: 62%;
    left: 65%;
}
.view7 .pin11 {
    left: 16%;
    top: 43%;
}
.view7 .pin12 {
    left: 28%;
    top: 34%;
}
.view7 .pin13 {
    left: 37%;
    top: 41%;
}
.view7 .pin14 {
    left: 63%;
    top: 18%;
}
.view7 .pin15 {
    left: 78%;
    top: 38%;
}

/* view8 */
.view8 {
    position: relative;
    margin-top: -100px;
    background-color: #4B1C18;
    padding-bottom: 150px;
    z-index: 2;
}
.view8 h2 {
    margin-bottom: 30px;
}
.view8 h2, .view8 p {
    color: var(--green-light);
    max-width: 515px;
}
.view8 .foto11 {
    position: absolute;
    top: -15%;
    width: 26%;
}
.view8 .foto12 {
    position: absolute;
    top: 80%;
    left: 13%;
    width: 24%;
}


/* view9 */
.view9 {
    margin-top: -100px;
}
.view9 .ball {
    position: relative;
    max-width: 1000px;
    margin: 100px auto 500px;
}
.view9 .ball .ilustracao {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 850px;
    width: 100%;
}
.view9 .pin16 {
    left: 20%;
    top: 30%;
}
.view9 .pin17 {
    left: 65%;
    top: 20%;
}
.view9 .pin18 {
    left: 30%;
    top: 72%;
}
.view9 .pin19 {
    left: 60%;
    top: 57%;
}
.view9 .foto13 {
    position: absolute;
    right: -20%;
    bottom: -35%;
}
.view9 .foto14 {
    position: absolute;
    right: 40%;
    bottom: -40%;
}
.view9 .foto15 {
    position: absolute;
    right: 5%;
    bottom: -55%;
}

/* view 10 */
.view10 {
    margin-top: -5px;
    background-color: #CC7B2F;
    padding-bottom: 30px;
    z-index: 1;
}
.view10 .container-fluid {
    max-width: 1500px;
}
.view10 .grid {
    display: grid;
    grid-template-columns: 1fr 4fr;
    gap: 100px;
    margin-bottom: 100px;
}
.view10 h2, .view10 .grid h3, .view10 p {
    color: var(--green-light);
}
.view10 .grid .right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
}
.view10 .grid h3 {
    padding-left: 10px;
    font-size: 36px;
    min-height: 88px;
}
.view10 .grid p {
    max-width: 450px;
    padding-left: 10px;
    min-height: 82px;
}
.view10 .grid img {
    max-width: 100%;
    height: auto;
}
.view10 .blocks {
    display: flex;
    align-items: center;
    gap: 40px;
    margin: 50px auto 0;
    justify-content: center;
}
.view10 .blocks .box {
    color: var(--green-light);
    border-radius: 42px;
    background-color: #4B1C18;
    text-align: center;
    padding: 50px 40px;
    max-width: 500px;
    height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.view10 .blocks .box h3, .view10 .blocks .box p {
    color: var(--green-light);
}
.view10 .blocks .box p:last-child {
    margin-bottom: 0;
}

/* view11 */

.view11 {
    margin-top: -80px;
    position: relative;
}
.view11 .bg {
    margin-bottom: 100px;
}
.view11 h2 {
    max-width: 800px;
}
.view11 .pin20 {
    top: 73.2%;
    left: 23%;
}
.view11 .pin21 {
    top: 42%;
    left: 35%;
}
.view11 .pin22 {
    top: 58%;
    left: 47%;
}
.view11 .pin23 {
    top: 58%;
    left: 60%;
}
.view11 .pin24 {
    top: 45%;
    left: 67%;
}
.view11 .pin25 {
    top: 42%;
    left: 82%;
}
.view11 .pessoa1 {
    position: absolute;
    z-index: 1;
    width: 6.5%;
    top: 52%;
    left: 27%;
}
.view11 .pessoa2 {
    position: absolute;
    z-index: 1;
    width: 4%;
    top: 36%;
    left: 72%;
}

/* view12*/
.view12 {
    position: relative;
    margin-top: -100px;
    background-color: #132349;
    padding-top: 50px;
    padding-bottom: 100px;
}
.view12 h2, .view12 p, .view12 p strong {
    color: var(--green-light);
}
.view12 h2 {
    max-width: 600px;
}
.view12 .button {
    background-color: var(--green-light);
    border-radius: 100px;
    text-transform: uppercase;
    font-size: 16px;
    margin-top: 30px;
}

@media (max-width: 1800px) {
    .pin {
        width: 50px;
        height: 50px;
    }
    .pin:before {
        width: 20px;
        height: 20px;
    }
    h2 {
        font-size: 42px;
    }
    .view3 .title3 {
        max-width: 750px;
    }
    .view3 .nuvem5 {
        top: 19%;
        width: 46%;
    }
    .view3 .sol1 {
        right: 8%;
    }

    .view5 .foto1 {
        width: 295px;
        top: 31%;
    }
    .view5 .foto2 {
       width: 284px;
       top: 42%;
    }
    .view5 .foto3 {
        width: 345px;
    }
    .view5 .foto4 {
        width: 266px;
    }
    .view9 .ball .ilustracao {
        max-width: 756px;
    }
    .view9 .ball {
        max-width: 880px;
    }
    .view9 .foto13 {
        width: 50%;
        right: -13%;
        bottom: -30%;
    }
    .view9 .foto14 {
        right: 38%;
        bottom: -32%;
        width: 43%;
    }
    .view9 .foto15 {
        right: 9%;
        bottom: -51%;
        width: 33%;
    }
    .view10 .grid h3, .view6 .grid h3 {
        font-size: 32px;
        min-height: 78px;
    }
}

@media (max-width: 1350px) {
    .view5 .text {
        margin-top: 10px;
    }
    .view5 .foto1 {
        top: 34%;
    }
    .view10 .grid h3, .view6 .grid h3 {
        font-size: 30px;
        min-height: 74px;
    }
}

@media (max-width: 767px) {
    .container-fluid {
        padding: 0 20px;
    }
    body {
        font-size: 15px;
    }
    h2 {
        font-size: 20px;
    }
    h3 {
        font-size: 20px;
    }

    img {
        max-width: 100%;
        height: auto;
    }
    .pin {
        width: 38px;
        height: 38px;
        z-index: 10;
    }
    .pin:before {
        width: 14px;
        height: 14px;
    }
    .view1 {
        min-height: 500px;
    }
    .view1 .text h1 {
        font-size: 28px;
    }
    .view1 .text h1 strong {
        font-size: 28px;
    }
    .view1 .logos {
        max-width: 300px;
        margin: 0 auto 20px;
    }
    .view1 .logos .fundo {
        width: 132px;
    }
    .view1 .logos .caixa {
        width: 174px;
    }
    .view1 {
        padding-top: 120px;
    }
    .view1 .bola-verde {
        width: 600px;
        top: 139px;
    }
    .view1 .bola-mosaico {
        width: 960px;
        top: 10px;
    }
    .view1 .bt {
        font-size: 14px;
        padding: 6px 21px;
    }
    .view2 {
        padding-top: 60px;
    }
    .view2 .title1 {
        width: 100%;
        margin: 0;
        padding: 0 30px;
    }
    .view2 .ilustracao2 {
        width: 137%;
        max-width: none;
        margin-left: -14%;
    }
    .view2 .nuvem1 {
        width: 82px;
        top: 3%;
        left: -9%;
    }
    .view2 .nuvem2 {
        width: 89px;
        top: 5%;
        left: 24%;
    }
    .view2 .nuvem3 {
        display: none;
    }
    .view2 .pin1 {
        right: 18%;
        top: 4%;
    }
    .view2 .pin2 {
        left: 57%;
        top: 32%;
    }
    .view2 .nuvem4 img {
        width: 200px;
    }
    .view2 .title2 {
        max-width: 134px;
        top: 45%;
        left: 8%;
    }
    .view2 .pin3 {
        left: 37%;
        top: 21%;
    }
    .view2 .pin4 {
        left: 36%;
        bottom: 30%;
    }
    .view2 .pin5 {
        left: 42%;
        bottom: 7%;
    }
    .view3 {
        padding-top: 130px;
    }
    .view3 .title3 {
        max-width: 270px;
        top: 3%;
    }
    .view3 .sol1 {
        right: -10%;
        top: 30%;
        width: 28%;
    }
    .view3 .nuvem5 {
        top: 40%;
        width: 52%;
        right: -5%;
    }
    .view3 .nuvem5 .pin6 {
        top: 30%;
        left: 37%;
    }
    .view4 {
        padding: 50px 0;
    }
    .view4 .box .bt {
        margin: 15px auto 0;
    }
    .view4 .content {
        flex-direction: column;
        gap: 5px;
    }
    .view4 .box {
        padding: 30px 16px 30px;
    }
    .view4 .box.left {
        border-radius: 42px 42px 0 0;
    }
    .view4 .box.right {
        border-radius: 0 0 42px 42px;
    }
    .view4 .box h3 {
        font-size: 20px;
        max-width: 200px;
        margin: 0 auto;
    }
    .view4 .box .bt {
        font-size: 14px;
    }

    .view5 .grid, .view10 .grid {
        display: block;
    }
    .view5 .foto1 {
        position: relative;
        width: 230px;
    }
    .view5 .foto2 {
        position: relative;
        margin-top: -16%;
        width: 220px;
        margin-left: 15%;
    }
    .view5 .foto3 {
        position: relative;
        margin-top: -18%;
        margin-left: 10%;
        z-index: 0;
        width: 240px;
    }
    .view5 .foto4 {
        position: relative;
        margin-top: -9%;
        width: 210px;
    }
    .view5 .ilustracao {
        width: 91%;
        left: 4%;
        top: -1%;
    }
    .view6 .grid {
        padding-bottom: 0;
        margin-bottom: 50px;
    }
    .view6 .grid p, .view10 .grid p, .view10 .grid h3, .view6 .grid h3 {
        min-height: 0;
    }
    .view6 h2, .view10 h2 {
        margin: 0 0 20px 10px;
    }
    .view6 .grid h3, .view10 .grid h3 {
        font-size: 20px;
    }
    .view6 .grid img, .view10 .grid img  {
        margin-bottom: 30px;
    }

    .view6 .grid, .view6 .grid .right, .view10 .grid .right {
       display: block;
    }
    .view6 .blocks, .view10 .blocks {
        display: block;
    }
    .view6 .blocks .box {
        margin-bottom: 30px;
    }
    .view7 {
        margin: 0;
    }
    .view7 h2 {
        padding-top: 22px;
        max-width: 217px;
        margin-bottom: 0;
    }
    .view7 .ilustracao {
        margin-top: -20%;
        max-width: none;
        width: 264%;
        margin-left: -9%;
    }
    .view7 .ilustracao-mobile {
        max-width: none;
        width: 216%;
        margin-left: -103%;
    }

    .view7 .pin11 {
        left: 21%;
        top: 14%;
    }
    .view7 .pin12 {
        left: 64%;
        top: 23%;
    }
    .view7 .pin13 {
        left: 17%;
        top: 30%;
    }
    .view7 .pin14 {
        left: 33%;
        top: 67%;
    }
    .view7 .pin15 {
        left: 69%;
        top: 83%;
    }
    .view7 .pessoa {
        position: absolute;
        z-index: 1;
        width: 12%;
        top: 9%;
        left: 81%;
    }
    .view7 .vaca1 {
        position: absolute;
        z-index: 2;
        width: 24%;
        top: 92%;
        left: 4%;
    }
    .view7 .vaca2 {
        position: absolute;
        z-index: 1;
        top: 89%;
        left: 20%;
        width: 27%;
    }
    .view7 .galinha1 {
        position: absolute;
        z-index: 3;
        width: 6%;
        top: 96%;
        left: 33%;
    }
    .view7 .galinha2 {
        position: absolute;
        z-index: 3;
        width: 7%;
        top: 96%;
        left: 41%;
    }

    .view8 {
        position: relative;
        margin-top: 43px;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .view8 .container-fluid {
        display: flex;
        flex-direction: column-reverse;
    }
    .view8 .foto11 {
        position: relative;
        top: 0;
        width: 59%;
        margin: -27% 0% -50% 37%;

    }
    .view8 .foto12 {
        position: relative;
        top: 0;
        left: 0%;
        width: 51%;
    }
    .view9 {
        margin-top: 0;
    }
    .view9 .ball {
        margin: 80px auto 0;
    }
    .view9 .ball .ilustracao {
        width: 92%;
        top: 2%;
        transform: none;
        left: 4%;
    }
    .view9 .foto13 {
        position: relative;
        top: 0;
        left: 0;
    }
    .view9 .foto14 {
        position: relative;
        top: 0;
        left: 0;
    }
    .view9 .foto15 {
        position: relative;
        top: 0;
        left: 0;
    }
    .view9 .foto13 {
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: -13% 0 0 40%;
    }
    .view9 .foto14 {
        position: relative;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: -41% 0 0 12%;
    }
    .view9 .foto15 {
        position: relative;
        top: 0;
        left: 0;
        width: 36%;
        right: 0;
        bottom: 0;
        margin: -4% 0% 0% -3%;
    }
    .view9 .pin16 {
        left: 15%;
        top: 15%;
    }
    .view9 .pin17 {
        left: 62%;
        top: 7%;
    }
    .view9 .pin18 {
        left: 29%;
        top: 42%;
    }
    .view9 .pin19 {
        left: 72%;
        top: 36%;
    }
    .view10 {
        padding-bottom: 0;
        z-index: 1;
        position: relative;
    }
    .view10 .grid {
        margin-bottom: 50px;
    }
    .view10 .blocks .box {
        height: auto;
        margin-bottom: 30px;
    }
    .view12 {
        text-align: center;
        padding-bottom: 50px;
    }
    .view12 .button {
        margin-bottom: 30px;
    }
    .view11 {
        margin-top: -8%;
    }
    .view11 .bg {
        margin-bottom: 60px;
        width: 150%;
        max-width: none;
        margin-left: -40%;
    }
    .view11 h2 {
        max-width: 268px;
    }
    .view11 .ilustracao-mobile {
        max-width: none;
        width: 236%;
        margin-left: -29%;
        margin-top: -15%;
    }
    .view11 .ilustracao {
        max-width: none;
        width: 267%;
        margin-left: -150%;
    }
    .view12 {
        padding-top: 0;
        margin-top: -185px;
    }
    .view12 h2 {
        max-width: 201px;
        margin: 0 auto;
    }
    .view12 .button {
        font-size: 14px;
        padding: 6px 21px;
        margin-top: 5px;
    }
    .view11 .pin20 {
        top: 42.8%;
        left: 26%;
    }
    .view11 .pin21 {
        top: 22%;
        left: 54%;
    }
    .view11 .pin22 {
        top: 32.5%;
        left: 82%;
    }
    .view11 .pin23 {
        top: 57%;
        left: 26%;
    }
    .view11 .pin24 {
        top: 55.7%;
        left: 70%;
    }
    .view11 .pin25 {
        top: 67%;
        left: 15%;
    }
    .view11 .pessoa2 {
        width: 10%;
        top: 54%;
        left: 44%;
    }
    .view11 .pessoa1 {
        width: 13.5%;
        top: 33%;
        left: 35%;
    }


}