.elementor-32 .elementor-element.elementor-element-97fd0f3{--display:flex;--min-height:88vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overflow:hidden;--margin-top:-210px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0%;--padding-bottom:1%;--padding-left:0%;--padding-right:0%;}.elementor-32 .elementor-element.elementor-element-fca5189 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-32 .elementor-element.elementor-element-79e3b9a .premium-atext__wrapper:not(.premium-atext__typing):not(.premium-atext__slide) .premium-fancy-list-items{animation-duration:1000ms;}.elementor-32 .elementor-element.elementor-element-f78cd98{--display:flex;}.elementor-32 .elementor-element.elementor-element-f78cd98:not(.elementor-motion-effects-element-type-background), .elementor-32 .elementor-element.elementor-element-f78cd98 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.fluttrspinthebottle.com/wp-content/uploads/2024/08/FONDO_B.png");}.elementor-32 .elementor-element.elementor-element-071ae4d{--display:flex;}.elementor-32 .elementor-element.elementor-element-56c80db{--display:flex;}.elementor-32 .elementor-element.elementor-element-4fd8b2f{width:100%;max-width:100%;}.elementor-32 .elementor-element.elementor-element-7984da3{width:100%;max-width:100%;}.elementor-32 .elementor-element.elementor-element-bd18010{--display:flex;}.elementor-32 .elementor-element.elementor-element-32f0e40{--display:flex;}.elementor-32 .elementor-element.elementor-element-32f0e40:not(.elementor-motion-effects-element-type-background), .elementor-32 .elementor-element.elementor-element-32f0e40 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.fluttrspinthebottle.com/wp-content/uploads/2024/08/FONDO_seccionC.png");}.elementor-32 .elementor-element.elementor-element-c376cb2{--display:flex;}.elementor-32 .elementor-element.elementor-element-9784acd{--display:flex;}.elementor-32 .elementor-element.elementor-element-5910c4a{--display:flex;}.elementor-32 .elementor-element.elementor-element-60cbd31{--display:flex;}.elementor-32 .elementor-element.elementor-element-60cbd31:not(.elementor-motion-effects-element-type-background), .elementor-32 .elementor-element.elementor-element-60cbd31 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.fluttrspinthebottle.com/wp-content/uploads/2024/09/FONDO_D.png");}.elementor-32 .elementor-element.elementor-element-920ee15{width:initial;max-width:initial;}.elementor-32 .elementor-element.elementor-element-1af4c02{--display:flex;}.elementor-32 .elementor-element.elementor-element-8ab89fe{--display:flex;}.elementor-32 .elementor-element.elementor-element-a20b9af{--display:flex;}.elementor-32 .elementor-element.elementor-element-af9ba4f{--display:flex;}.elementor-32 .elementor-element.elementor-element-3ad4b00{--display:flex;}.elementor-32 .elementor-element.elementor-element-eab7691{--display:flex;}.elementor-32 .elementor-element.elementor-element-3dec761{--display:flex;}.elementor-32 .elementor-element.elementor-element-97d49f5{--display:flex;}.elementor-32 .elementor-element.elementor-element-47a09e4{--display:flex;}.elementor-32 .elementor-element.elementor-element-d4b4808{--display:flex;}.elementor-32 .elementor-element.elementor-element-c307d5a{--e-n-carousel-swiper-slides-to-display:5;--e-n-carousel-swiper-slides-gap:-20px;width:initial;max-width:initial;}.elementor-32 .elementor-element.elementor-element-55b8e2b{width:initial;max-width:initial;}.elementor-32 .elementor-element.elementor-element-4878710{--display:flex;}.elementor-32 .elementor-element.elementor-element-203bcca{--display:grid;}.elementor-32 .elementor-element.elementor-element-bf6e29e{--display:flex;}.elementor-32 .elementor-element.elementor-element-1edfdc1{--display:grid;}.elementor-32 .elementor-element.elementor-element-9ba0189{--display:grid;}.elementor-32 .elementor-element.elementor-element-3ad0a91{--display:grid;}.elementor-32 .elementor-element.elementor-element-9af9be3{--display:flex;}.elementor-32 .elementor-element.elementor-element-a6923c7{--display:grid;}.elementor-32 .elementor-element.elementor-element-f30ded9{width:initial;max-width:initial;}.elementor-32 .elementor-element.elementor-element-a8765ec{--display:flex;}.elementor-32 .elementor-element.elementor-element-a8765ec:not(.elementor-motion-effects-element-type-background), .elementor-32 .elementor-element.elementor-element-a8765ec > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.fluttrspinthebottle.com/wp-content/uploads/2024/08/FONDO_E.png");}.elementor-32 .elementor-element.elementor-element-0d1ce41{--display:flex;}.elementor-32 .elementor-element.elementor-element-4266697{--display:flex;}.elementor-32 .elementor-element.elementor-element-4266697:not(.elementor-motion-effects-element-type-background), .elementor-32 .elementor-element.elementor-element-4266697 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.fluttrspinthebottle.com/wp-content/uploads/2024/09/FONDO_subscribe.jpg");}.elementor-32 .elementor-element.elementor-element-d5f5ccb{--display:flex;}.elementor-32 .elementor-element.elementor-element-d5f5ccb:not(.elementor-motion-effects-element-type-background), .elementor-32 .elementor-element.elementor-element-d5f5ccb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.fluttrspinthebottle.com/wp-content/uploads/2023/12/Mask-group.png");}.elementor-32 .elementor-element.elementor-element-82d70c7{--display:flex;}.elementor-32 .elementor-element.elementor-element-0546b73{--display:flex;}.elementor-32 .elementor-element.elementor-element-6bca0e1{width:initial;max-width:initial;}@media(max-width:1401px){.elementor-32 .elementor-element.elementor-element-97fd0f3{--margin-top:-170px;--margin-bottom:-109px;--margin-left:0px;--margin-right:0px;}.elementor-32 .elementor-element.elementor-element-c307d5a{--e-n-carousel-swiper-slides-gap:1px;}.elementor-32 .elementor-element.elementor-element-2112bed{width:100%;max-width:100%;}.elementor-32 .elementor-element.elementor-element-1d37584{width:100%;max-width:100%;}}@media(max-width:1024px){.elementor-32 .elementor-element.elementor-element-97fd0f3{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-32 .elementor-element.elementor-element-c307d5a{--e-n-carousel-swiper-slides-to-display:4;}}@media(max-width:880px){.elementor-32 .elementor-element.elementor-element-97fd0f3{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(max-width:767px){.elementor-32 .elementor-element.elementor-element-97fd0f3{--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-32 .elementor-element.elementor-element-fca5189 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-32 .elementor-element.elementor-element-eb0c084{width:100%;max-width:100%;}.elementor-32 .elementor-element.elementor-element-c3e85f6{width:initial;max-width:initial;}.elementor-32 .elementor-element.elementor-element-7984da3{width:initial;max-width:initial;}.elementor-32 .elementor-element.elementor-element-c307d5a{--e-n-carousel-swiper-slides-to-display:2;}}@media(min-width:2400px){.elementor-32 .elementor-element.elementor-element-97fd0f3{--min-height:84vh;--margin-top:-206px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-32 .elementor-element.elementor-element-cf3cf7a{width:100%;max-width:100%;}}/* Start custom CSS for html, class: .elementor-element-fca5189 */.carta {
    position: absolute;
    width: 200px;
    height: 300px;
    cursor: pointer;
    transform-style: preserve-3d;
    transition: transform 0.1s ease;
}

.cara {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border-radius: 10px;
}

.cara img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cara-frontal {
    z-index: 2;
    transform: rotateY(0deg);
}

.cara-trasera {
    transform: rotateY(180deg);
    z-index: 1;
}


.container {
    perspective: 1000px;
    perspective-origin: center;
}

.carta,
.cara {
    will-change: transform;
}

.carta {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.carta:hover {
    cursor: grab;
}

.carta:active {
    cursor: grabbing;
}

.carta img {
    pointer-events: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

.card-background {
    width: 100%;
    height: 100%;
    position: relative;
}

@media (max-width: 800px) {
    .carta {
        width: 150px;
        height: 225px;
    }
}

@media (max-width: 480px) {
    .carta {
        width: 120px;
        height: 180px;
    }
}

.carta {
    filter: none !important;
    overflow: visible !important;
}/* End custom CSS */
/* Start custom CSS for premium-addon-fancy-text, class: .elementor-element-79e3b9a */h3.premium-atext__headline {
    display: flex;
    justify-content: center;
    align-items: center;
}
.premium-atext__clip .premium-atext__items-wrapper::after {
	background-color: #0d0d0d00 !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-97fd0f3 */body{
    box-sizing:border-box ;
    margin: 0;
    padding: 0;
}

.container {
    position: relative; /* Contenedor para posicionar las cartas absolutamente */
    width: 100%; /* Ajustar al ancho del contenedor */
    height: 103vh;
    overflow: hidden;
    background: radial-gradient(circle, #4A02DC 5%, #300c79 44%, #1C0F46 70%);
}

.carta {
    position: absolute; 
    width: 180px; /* Ancho de la carta */
    height: 270px; /* Altura de la carta */
    border-radius: 4px;
    box-shadow: 4px 8px 16px rgba(0, 2, 4, 0.53);
    cursor: pointer;
    transition: all 0.3s ease; /* Transiciones para suavizar la animación */
    opacity: 0; /* Ocultar las cartas inicialmente */
    overflow: hidden; /* Asegurar que el contenido adicional esté dentro de los bordes */
    transform-origin: center center;
}

.carta img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.card-content {
    background-color: rgba(163, 131, 175, 0.123); 
    position: relative; /* Necesario para los pseudo-elementos */
    z-index: 1; /* Asegura que el contenido esté por encima de los pseudo-elementos */
}

.carta::before,
.carta::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 20px;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    display: none; /* Ocultar los pseudo-elementos inicialmente */
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    box-sizing: border-box;
}

.carta.clicked::before,
.carta.clicked::after {
    display: flex; /* Mostrar los pseudo-elementos cuando se haga clic */
}

.carta::before {
    top: 0;
    content: attr(data-before); /* Tomar contenido desde el atributo data-before */
}

.carta::after {
    bottom: 0;
    content: attr(data-after); /* Tomar contenido desde el atributo data-after */
}
#card5 {
    transform: rotate(30deg); 
}
/*.carta {
    perspective: 1000px; /* Añade perspectiva para un mejor efecto 3D 
}*/

.cara {
    width: 100%;
    height: 100%;
    position: absolute;
    backface-visibility: hidden; /* Oculta la cara trasera al hacer flip */
    transition: transform 0.6s ease; /* Añade transición para el efecto de flip */
}

.cara-trasera {
    transform: rotateY(180deg); /* Rota la cara trasera */
}


.interaction-blocked * {
    pointer-events: none;
}

/* **********RESPONSIVE********** */

@media (max-width: 767px) {
    .carta {
        width: 100px; /* Ajustar ancho de la carta */
        height: 160px; /* Ajustar altura de la carta */
    }
    .container {
    height: 116vh;
    padding-top:8%;
    }
}
@media (max-width: 1280px) {
  .container {
    height: 112vh;
    }
}
@media (max-width: 1440px) {
  .container {
    height: 115vh;
    }
}
@media (max-width: 1740px) {
  .container {
    height: 118vh;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-5910c4a */.separadorBack {
    background: linear-gradient(to right, #800080, #FF4500, #FFFF00, #008000, #00FFFF, #0000FF);
   position: relative;
   overflow: hidden;
   height: 4px;
}
.separadorBack::before {
 content: '';
    position: absolute;
    top: 0;
    right: -100%; 
    width: 100%;
    height: 100%;
    background: inherit; 
    animation: shine 3s linear infinite; 
    mix-blend-mode: color-dodge; 
    opacity: 0.8; 
}
@keyframes shine {
    0% {
        left: -50%;
    }
    100% {
        left: 100%;
    }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-eb4737c */@media (min-width: 1621){
    #titleFluttrAvatars h2 {
	font-size: 100px;
	}
	}/* End custom CSS */
/* Start custom CSS for ucaddon_justified_image_carousel, class: .elementor-element-227f8d9 */.owl-stage-outer .item.ue-item {
    border-radius: 16px;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0d1ce41 */#separadorBack {
    background: linear-gradient(to right, #800080, #FF4500, #FFFF00, #008000, #00FFFF, #0000FF);
   position: relative;
   overflow: hidden;
   height: 4px;
}
#separadorBack::before {
 content: '';
    position: absolute;
    top: 0;
    right: -100%; 
    width: 100%;
    height: 100%;
    background: inherit; 
    animation: shine 3s linear infinite; 
    mix-blend-mode: color-dodge; 
    opacity: 0.8; 
}
@keyframes shine {
    0% {
        left: -50%;
    }
    100% {
        left: 100%;
    }
}/* End custom CSS */
/* Start custom CSS for form, class: .elementor-element-6bca0e1 */#form-field-field_60de19a {
	text-align: center;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4266697 */@media (min-width:1621px){
    .subscribeImag {
	width: 47%;
    }
    .subscribeImag img {
	width: 78% !important;
	margin-bottom: -6px;
    }
    .subscribeH3Title h3 {
	font-size: 42px;
	line-height: 42px;
    }
    
}/* End custom CSS */