@font-face {
    font-family: 'PFBeauSansPro-Regular';
    src: url('fonts/PFBeauSansPro-Regular.woff');

}

@font-face {
    font-family: 'PFBeauSansPro-Bold';
    src: url('fonts/PFBeauSansPro-Bold.woff');

}

@font-face {
    font-family: 'ArcherBoldPro';
    src: url('fonts/ArcherBoldPro.otf');

}

.no-horizontal-scrollbar {
    /* Keeps the horizontal scrollbar hidden */
    overflow-x: hidden;
}

.no-vertical-scrollbar {
    /* Keeps the vertical scrollbar hidden */
    overflow-y: hidden;
}

.no-scrollbars {
    /* Keeps both the horizontal and vertical 
     scrollbars hidden */
    overflow: hidden;
}

@font-face {
    font-family: 'ArcherBookPro';
    src: url('fonts/ArcherBookPro.otf');

}

@font-face {
    font-family: 'ArcherSemiboldPro';
    src: url('fonts/ArcherSemiboldPro.otf');

}

@font-face {
    font-family: 'BourtonBase';
    src: url('fonts/Bourton/BourtonBase.ttf');

}

@keyframes float {
    0% {

        transform: translatey(0px);
    }

    50% {

        transform: translatey(-4vw);
    }

    100% {

        transform: translatey(0px);
    }
}

html, body {
    /* overflow-x: hidden; */
    /* max-width: 1080px; */
}

.general-bg {
    /* background-image:url('../img/fondo.jpg'); */
    /* background-position: center; */
    /* background-repeat: no-repeat; */
    /* background-size: cover; */
    /* padding-bottom: 22px; */
    /* min-height: 100vh; */
    /* min-width: 100%; */
    /* min-width: 1080px; */
    /* height: 100vh; */
    /* width: 33vw; */
    /* margin: 0 auto; */
    /* max-width: 1080px; */
}





    .general {
        font-family: 'ArcherBoldPro';
        z-index: 2;
        margin-top: 25px;
        width: 100%;
        position: relative;
    }

    .contenedor-totem {
        max-width: 100%;
        background-image: url(../../fondo-gris.jpg);
        padding: 0;
        margin: 0;
        /* height: 100vh; */
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    .contenedor-totem .tarjeta-img {

width: 34%;

margin: 0 auto;

padding-top: 3vw;

padding-bottom: 3vw;
}

    .contenedor-totem .tarjeta-img img {

        width: 100%;
    }

    .subgeneral {
        position: absolute;
        top: 18%;
        bottom: 25%;
        z-index: -1;
        left: 25%;
        right: 25%;
        background: #fff5d0ba;
        box-shadow: 0px 0px 113px 129px #fff5d0ba;
    }

    .contenedor-totem .title-img {

max-width: 44%;

margin: 0 auto;

padding-top: 2vw;

text-align: center;

padding-bottom: 4vw;
}

    .contenedor-totem .img-title {
        max-width: 100%;
    }

    .general .titular {

        display: block;

        margin-bottom: 7px;

        text-align: center;

        width: 94%;
    }

    .general .titular .mensaje {

        font-size: 25px;

        line-height: 30px;

        color: #132245;

        margin-left: 4%;

        width: 100%;

        font-weight: bold;

        text-transform: uppercase;
    }

    .general .titular .mensaje span {
        padding-left: 12px;
    }

    .general .titular .image-oster {

        margin-left: auto;

        margin-right: auto;

        width: 34%;

        padding-bottom: 2%;
    }

    .general .titular .image-oster img {

        width: 100%;

        padding-top: 7%;
    }

    .general .btn-oster {

        width: 80%;

        margin-left: 10%;
    }

    .general .btn-oster img {

        width: 100%;
    }

    .general .texto-btn {

        text-align: center;

        font-size: 20px;

        /* font-family: 'ArcherSemiboldPro'; */

        line-height: 27px;

        margin-top: 13px;

        font-weight: bold;

        text-transform: uppercase;
    }

    .general .texto-btn span {

        text-align: center;

        font-size: 21px;
    }

    .general .imagens75 {

        width: 80%;

        position: relative;

        margin: 0 auto;

        margin-top: -3%;
    }

    .general .imagens75 .torta {

        position: absolute;

        z-index: 8;

        left: -9%;

        top: 8%;

        width: 64%;

        display: none;
    }

    .general .imagens75 .premio {
        margin-left: -5%;
        position: relative;
        margin-top: 2%;
        z-index: 99;
        width: 110%;
    }

    .contenedor-totem {}

    .contenedor-totem .contenido {

position: absolute;

height: 100vh;

top: 0;

width: 100vw;

}

    .contenedor-totem .contenido .title-img2 {

        width: 58%;

        margin: 0 auto;

        margin-top: 23%;
    }

    .contenedor-totem .contenido .title-img2 .img-title {
        width: 100%;
    }

    .contenedor-totem .contenido .title-img3 {

        margin-top: 14%;
    }

    .contenedor-totem .contenido .tarjeta-img2 {
        width: 57%;
        margin: 0 auto;
        margin-top: 12%;
        animation: float 6s ease-in-out infinite;
    }

    .contenedor-totem .contenido .tarjeta-img3 {

        margin-top: 4%;

        animation: none;

        width: 49%;
    }

    .contenedor-totem .contenido .tarjeta-img2 .img-tarjeta {

        width: 100%;
    }

    .participante {}

    .participante .participante-name {
        color: #3f3f3f;
        font-family: PFBeauSansPro-Regular;
        text-align: center;
        font-size: 5.5vw;
    }

    .participante .participante-name br {}

    .participante .participante-name span {
        color: #4fad32;
        font-weight: bold;
        font-family: PFBeauSansPro-Bold;
        font-size: 8vw;
    }

    .contenedor-totem .contenido .footer-botones {
        position: absolute;
        bottom: 10vw;
        display: flex;
        padding: 3% 12%;
        width: 100%;
        justify-content: space-between;
        height: 15vw;
    }

    .contenedor-totem .contenido .footer-botones .falabella-btn {
        display: flex;
        position: relative;
        justify-content: center;
        flex-direction: column;
    }

    .contenedor-totem .contenido .footer-botones .falabella-btn img {
        width: auto;
        height: 100%;
    }

    .contenedor-totem .contenido .footer-botones .mastercard-btn {
        display: flex;
        position: relative;
        justify-content: center;
        flex-direction: column;
    }

    .contenedor-totem .contenido .footer-botones .mastercard-btn img {
        width: auto;
        height: 125%;
    }
