* {
    font-family: "Montserrat", sans-serif;
}

/* Regular */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

/* Bold */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
}

/* Extrabold */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-ExtraBold.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
}

/* Extralight */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-ExtraLight.ttf") format("truetype");
    font-weight: 200;
    font-style: normal;
}

/* Fat */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Fat.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
}



/* Light */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

/* Semibold */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

/* Thin */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Thin.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
}

/* Black */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
}

/* Fuente cursiva  */
@font-face {
    font-family: "Panton";
    src: url("https://arenscristian.com/fonts/Panton-Trial-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: italic;
}

.ff-pan {
    font-family: "Panton", sans-serif;
}

html,
body {
    overflow-x: hidden;
}

h1.text-dark,
h2.text-dark,
h3.text-dark,
h4.text-dark,
h5.text-dark,
label.text-dark,
p.text-dark {
    color: #333333 !important;
}

h1.text-light,
h2.text-light,
h3.text-light,
h4.text-light,
h5.text-light,
p.text-light {
    color: #dddddd !important;
}

h1.text-white,
h2.text-white,
h3.text-white,
h4.text-white,
h5.text-white,
i.text-white,
p.text-white {
    color: #ffffff !important;
}

button.btn,
input.btn,
a.btn {
    transition: all 0.4s ease !important;
    box-shadow: 0px 2px 4px #aaa;
    border-radius: 5px;
    border-width: 2px;
}

button.btn-primary,
input.btn-primary,
a.btn-primary {
    color: #ffffff !important;
    background-color: #fa5e26;
    border-color: #fa5e26;
    font-weight: 600;
}

button.btn-primary:hover,
input.btn-primary:hover,
a.btn-primary:hover {
    background-color: #fd7a4b;
    border-color: #fd7a4b;
}

button.btn-primary:focus,
input.btn-primary:focus,
a.btn-primary:focus {
    background-color: #fd7a4b;
    border-color: #fd7a4b;
}

button.btn-primary:active,
input.btn-primary:active,
a.btn-primary:active {
    background-color: #fd7a4b;
    border-color: #fd7a4b;
}

button.btn-dark-primary,
input.btn-dark-primary,
a.btn-dark-primary {
    color: #ffffff !important;
    background-color: #fc7b4d;
    border-color: #fc7b4d;
    font-weight: 600;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 50%);
}

button.btn-dark-primary:hover,
input.btn-dark-primary:hover,
a.btn-dark-primary:hover {
    background-color: #fa855b;
    border-color: #fa855b;
}

button.btn-dark-primary:focus,
input.btn-dark-primary:focus,
a.btn-dark-primary:focus {
    background-color: #fa855b;
    border-color: #fa855b;
}

button.btn-dark-primary:active,
input.btn-dark-primary:active,
a.btn-dark-primary:active {
    background-color: #fa855b;
    border-color: #fa855b;
}

button.btn-outline-primary,
input.btn-outline-primary,
a.btn-outline-primary {
    color: #fa5e26 !important;
    background-color: #ffffff;
    border-color: #fa5e26;
    font-weight: 600;
}

button.btn-outline-primary:hover,
input.btn-outline-primary:hover,
a.btn-outline-primary:hover {
    color: #ffffff !important;
    background-color: #fa5e26;
    border-color: #fa5e26;
}

button.btn-lg,
input.btn-lg,
a.btn-lg {
    border-width: 4px;
    border-radius: 10px;
}

div.course-card,
div.press-card {
    background-color: white;
    box-shadow: 0px 0px 10px #cccc;
    border-radius: 15px;
    transition: all 0.25s ease-in-out;
}

.press-card:hover {
    box-shadow: 0px 0px 15px #bbbbbb;
}

.arrow {
    transition: all 0.25s ease-in-out;
}

.press-card:hover .arrow {
    transform: translateX(5px);
}

div.pricing-card {
    background-color: white;
    box-shadow: 0px 0px 10px #ccc;
    border-radius: 15px;
}

div.best-price {
    background-color: #fa5e26;
    color: white;
    border-radius: 15px 15px 0px 0px;
}

h1.text-primary,
h2.text-primary,
h3.text-primary,
h4.text-primary,
h5.text-primary,
p.text-primary,
i.text-primary {
    color: #fa5e26 !important;
}

p.text-justify {
    text-align: justify;
}

a.press {
    text-decoration: none !important;
    color: #dddddd;
    transition: all 0.5s ease;
}

a.press:hover {
    color: white;
}

a.text-primary {
    font-weight: 600;
    color: #fa5e26 !important;
    transition: all 0.5s ease;
    text-underline-position: under;
}

a.text-primary:hover {
    color: #d65020 !important;
}

img.logo-press {
    transition: all 0.5s ease;
}

img.logo-press:hover {
    -webkit-filter: brightness(200%);
    transform: scale(1.1);
}

a.nav-link,
span.nav-link {
    transition: all 0.5s ease;
    color: #333333 !important;
    font-weight: 600;
    font-style: italic;
}

a.nav-link:hover {
    text-decoration: none;
    color: #fa5e26 !important;
}

a.nav-link.active,
span.nav-link.active {
    text-decoration: underline;
    text-decoration-color: #fa5e26;
    text-underline-position: under;
}

div.icon {
    background-color: #f7f8ff;
    height: 125px;
    width: 125px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

div.dashed-vertical-line {
    background-image: url("svg/dashed-vertical-line.svg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
}

div.bg-light {
    background-color: #dddddd !important;
}

div.box {
    display: flex;
    align-items: center;
}

a.social-media-icon {
    color: white;
    transition: all 0.5s ease;
}

a.social-media-icon:hover {
    color: #fc7b4d;
    text-decoration: none;
}

div.number-icon {
    background-color: white;
    border-style: solid;
    border-color: #fa5e26;
    border-width: 3px;
    height: 60px;
    width: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 27px;
    color: #fa5e26;
    font-weight: 600;
}

div.number-icon-small {
    background-color: white;
    border-style: solid;
    border-color: #fa5e26;
    border-width: 2px;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
    color: #fa5e26;
    font-weight: 600;
}

span.text-medium {
    font-weight: 600;
}

#book-cover-sm {
    background-image: url("illustrations/traveller_and_mountain_small.svg");
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center bottom;
}

.fade-in {
    animation: fadeIn ease 2s;
    -webkit-animation: fadeIn ease 2s;
    -moz-animation: fadeIn ease 2s;
    -o-animation: fadeIn ease 2s;
    -ms-animation: fadeIn ease 2s;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-o-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-ms-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

#photo-1 {
    animation: floatAnim 5s ease-in-out infinite;
}

#photo-2 {
    animation: floatAnim2 5s ease-in-out infinite;
}

#photo-3 {
    animation: floatAnim 5s ease-in-out infinite;
}

@keyframes floatAnim {
    0% {
        transform: translate(0px, -10px);
    }
    50% {
        transform: translate(0px, 10px);
    }
    100% {
        transform: translate(0px, -10px);
    }
}

@keyframes floatAnim2 {
    0% {
        transform: translate(0px, 10px);
    }
    50% {
        transform: translate(0px, -10px);
    }
    100% {
        transform: translate(0px, 10px);
    }
}

div.buy-option {
    width: 100%;
    max-width: 200px;
    height: 90px;
    border-color: #dddddd;
    border-width: 2px;
    border-radius: 10px;
    border-style: solid;
    position: relative;
    transition: all 0.4s ease !important;
}

ol.carousel-indicators li {
    background-color: #555555;
    height: 8px;
}

ol.carousel-indicators li.active {
    background-color: #fa5e26;
}

div.buy-option:hover {
    background-color: #504f4b;
}

.importante{
    margin-left: 15px;
    margin-right: 15px;
}
img.buy-option {
    height: 30px;
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    right: 0;
    margin: auto;
}

div.modal-buy-option {
    width: 100%;
    border-color: #333333;
    border-width: 2px;
    border-radius: 10px;
    border-style: solid;
    transition: all 0.4s ease !important;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}

div.modal-buy-option:hover {
    background-color: #dddddd;
}

img.modal-buy-option {
    height: 25px;
    margin: auto;
}

.card-header.chapter {
    background-color: #f2f4f8 !important;
}

a.chapter {
    text-underline-position: under;
    text-decoration-color: #fa5e26 !important;
}

p.p-16 {
    font-size: 16px;
    line-height: 24px;
}

iframe.youtube {
    width: 100%;
    max-width: 500px;
    height: 225px;
    border-width: 0px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.ff-saira-condensed {
    font-family: "Saira Condensed", sans-serif !important;
}

.ff-saira {
    font-family: "Saira", sans-serif;
}

.ff-saira-semicondensed {
    font-family: "Saira SemiCondensed", sans-serif !important;
}

.ff-bebas {
    font-family: "Bebas Neue", sans-serif !important;
}

.map-container {
    position: relative;
    width: 100%;
    padding-bottom: 75%; /* 4:3 aspect ratio */
    height: 0;
    overflow: hidden;
}

.map-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
}

.video-container-square {
    position: relative;
    width: 100%;
    padding-bottom: 100%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container-square iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.press-card-date,
.press-card-date:hover {
    color: #3a3936 !important;
}

.no-underline,
.no-underline:hover {
    text-decoration: none !important;
}

div.iframe-wrapper {
    position: relative;
    padding-bottom: 56.25%;
}

iframe.wrapped {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#books {
    background-image: url("https://arenscristian.com/images/books-bg.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.circulo-de-influencia-bg {
    background-image: url("https://arenscristian.com/images/circulo-de-influencia-fondo.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

.text-black {
    font-weight: 900;
}

.course-image {
    cursor: pointer;
    width: 100%;
    max-width: 300px;
}

.btn-taller {
    background-color: #fff500;
    color: black;
    font-size: 20px;
    text-decoration: none;
    border: 1px solid #fff500;
    border-radius: 20px;
    padding: 1rem 2rem;
    font-weight: 600;
    text-transform: uppercase;
    display: inline-block;
}

@media (min-width: 768px) {
    .taller-hero {
        background-image: url("taller/cristian-arens-hero.webp");
        background-size: auto 100%;
        background-repeat: no-repeat;
        background-position: right center;
    }

    .sectiona {
        background: -moz-linear-gradient(
                238deg,
                rgba(13, 45, 161, 1) 28%,
                rgba(17, 3, 55, 1) 51%,
                rgba(14, 35, 135, 1) 83%,
                rgba(17, 6, 62, 1) 94%
        );
        background: -webkit-linear-gradient(
                238deg,
                rgba(13, 45, 161, 1) 28%,
                rgba(17, 3, 55, 1) 51%,
                rgba(14, 35, 135, 1) 83%,
                rgba(17, 6, 62, 1) 94%
        );
        background: linear-gradient(
                238deg,
                rgba(13, 45, 161, 1) 28%,
                rgba(17, 3, 55, 1) 51%,
                rgba(14, 35, 135, 1) 83%,
                rgba(17, 6, 62, 1) 94%
        );
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffe927", endColorstr="#11063e", GradientType=1);
    }
}

img.social-media-icon,
img.close-icon,
img.social-icon-navbar {
    height: 30px;
    filter: invert(66%) sepia(7%) saturate(6601%) hue-rotate(339deg) brightness(102%) contrast(102%);
}

a:hover > img.social-media-icon,
img.close-icon,
img.social-icon-navbar {
    filter: invert(100%) sepia(20%) saturate(0%) hue-rotate(136deg) brightness(102%) contrast(101%);
}

img.social-media-icon-2 {
    height: 30px;
    filter: invert(100%) sepia(20%) saturate(0%) hue-rotate(136deg) brightness(102%) contrast(101%);
}

a:hover > img.social-media-icon-2 {
    filter: invert(66%) sepia(7%) saturate(6601%) hue-rotate(339deg) brightness(102%) contrast(102%);
}

.bg-biography {
    box-shadow: inset 0px 0px 50px 0px #ff902a;
    border-radius: 20px;
    overflow: hidden;
}

.bg-biography-2 {
    box-shadow: inset 0px 0px 50px 0px #fff500;
    border-radius: 20px;
    overflow: hidden;
}

.gradient-text {
    background: linear-gradient(90deg, #ffb21e 12%, #fffee4 48%, #ffb21e 92%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-yellow {
    color: #fff500;
}

.text-blue {
    color: #0000d5;
}

.fw-black {
    font-weight: 900;
}

#tickets {
    background-image: url("taller2/tickets-bg.png");
    background-size: 100% 80%;
    background-repeat: no-repeat;
    background-position: center center;
}

.btnenterar {
    background-color: #80ff00 !important;
    font-family: Saira;
    border-radius: 40px;
    padding: 10px 20px;
    font-size: 20px;
}

.form-control1 {
    display: flex;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #4c9900;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
}

.ff-Montserrat, .ff-montserrat {
    font-family: "Montserrat", sans-serif;
}

.inscerrada {
    position: absolute;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.ff-pop {
    font-family: "Poppins", sans-serif;
}

.headsem {
    background: rgb(3,3,3);
    background: -moz-linear-gradient(273deg, rgba(3,3,3,1) 0%, rgba(13,18,0,1) 81%);
    background: -webkit-linear-gradient(273deg, rgba(3,3,3,1) 0%, rgba(13,18,0,1) 81%);
    background: linear-gradient(273deg, rgba(3,3,3,1) 0%, rgba(13,18,0,1) 81%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#030303",endColorstr="#0d1200",GradientType=1);
}
.headsem1 {
    background: rgb(17,3,55);
    background: -moz-linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(131,0,0,1) 0%, rgba(147,0,71,1) 51%, rgba(127,0,97,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(131,0,0,1) 0%, rgba(147,0,71,1) 51%, rgba(127,0,97,1) 100%);
    background: linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(131,0,0,1) 0%, rgba(147,0,71,1) 51%, rgba(127,0,97,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#110337",endColorstr="#7f0061",GradientType=1);
}


.head4 {
    background: rgb(255, 114, 54);
    background: -moz-linear-gradient(
            90deg,
            rgba(255, 114, 54, 1) 34%,
            rgba(255, 83, 31, 1) 84%
    );
    background: -webkit-linear-gradient(
            90deg,
            rgba(255, 114, 54, 1) 34%,
            rgba(255, 83, 31, 1) 84%
    );
    background: linear-gradient(
            90deg,
            rgba(255, 114, 54, 1) 34%,
            rgba(255, 83, 31, 1) 84%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7236", endColorstr="#ff531f", GradientType=1);
}

.titulosemana {
    text-align: end;
    line-height: 0.8;
    max-width: 450px;
}

.form-semana {
    display: flex;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    width: 100%;
}

.btnsem {
    background: rgb(255, 71, 63);
    background: -moz-linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    background: linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff473f", endColorstr="#ffe927", GradientType=1);
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: #110337;
}

.btnsem2 {
    background-color: #b4fe2f;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: #000000;
}

.btnsem3 {
    background-color: #b4fe2f;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: #000000;
    width: 600px;
}


@media (max-width: 750px) {
    .btnsem3 {
        width: 100%; /* Ancho para pantallas menores a 800px */
    }
}

.btnsem4 {
    background: #b4fe2e;
    padding: 10px;
    border-radius: 20px;
    font-size: 18px;
    color: black;
}

.btnsem5 {
    background: #b4fe2e;
    padding: 5px;
    border-radius: 10px;
    font-size: 18px;
    color: black;
    border-color: transparent;
}

.franjaverde{
    background: rgb(78,194,2);
    background: -moz-linear-gradient(273deg, rgba(78,194,2,1) 0%, rgba(170,236,31,1) 100%);
    background: -webkit-linear-gradient(273deg, rgba(78,194,2,1) 0%, rgba(170,236,31,1) 100%);
    background: linear-gradient(273deg, rgba(78,194,2,1) 0%, rgba(170,236,31,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4ec202",endColorstr="#aaec1f",GradientType=1);
}

.text-green {
    color: #b4fe2e !important;
}

.btny {
    background: #ffff00;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: #110337;
}

.sectiona {
    background: rgb(17, 6, 62); /* Fallback background */
    background: -moz-linear-gradient(
            238deg,
            rgba(17, 6, 62, 1) 10%,
            rgba(14, 35, 135, 1) 28%,
            rgba(17, 3, 55, 1) 51%,
            rgba(13, 45, 161, 1) 83%,
            rgba(255, 233, 39, 1) 94%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(17, 6, 62, 1) 10%,
            rgba(14, 35, 135, 1) 28%,
            rgba(17, 3, 55, 1) 51%,
            rgba(13, 45, 161, 1) 83%,
            rgba(255, 233, 39, 1) 94%
    );
    background: linear-gradient(
            238deg,
            rgba(17, 6, 62, 1) 10%,
            rgba(14, 35, 135, 1) 28%,
            rgba(17, 3, 55, 1) 51%,
            rgba(13, 45, 161, 1) 83%,
            rgba(255, 233, 39, 1) 94%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#11063e", endColorstr="#ffe927", GradientType=1);
    border-color: transparent;
}

.btny2 {
    background: #ffe328;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: black;
    border-color: transparent;
}

.btncel {
    background: #f4ff1c;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: #110337;
    border-color: transparent;
}

.btnnrj {
    background: #ff5d17;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 900;
    color: #ffffff;
    border-color: transparent;
}

.btnblc {
    background-color: white;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
    color: #ff4d00;
    border: none; /* Cambié esto a 'none' para evitar conflictos con el color de borde */
    box-shadow: 10px 8px 15px rgba(255, 123, 0, 0.5); /* Usando el color #ff7b00 con un poco de opacidad */
    transition: box-shadow 0.3s; /* Para un efecto suave al pasar el ratón */
}

.sectiona {
    background: -moz-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%,
            rgba(14, 35, 135, 1) 83%,
            rgba(17, 6, 62, 1) 94%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%,
            rgba(14, 35, 135, 1) 83%,
            rgba(17, 6, 62, 1) 94%
    );
    background: linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%,
            rgba(14, 35, 135, 1) 83%,
            rgba(17, 6, 62, 1) 94%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffe927", endColorstr="#11063e", GradientType=1);
    background-blend-mode: overlay; /* Ajusta el modo de mezcla si es necesario */
    background-size: cover; /* Ajusta el tamaño de la imagen para cubrir el área */
    background-position: center top; /* Centra la imagen en la sección */
    background-repeat: no-repeat; /* Evita que la imagen se repita */
    padding-left: 50px;
    padding-top: 20px;
}

.sectiona2 {
    background-image: url("https://arenscristian.com/images/fondo-lanzamiento.jpg");
    background-size: cover; /* Ajusta el tamaño de la imagen para cubrir el área */
    background-position: center top; /* Centra la imagen en la sección */
    background-repeat: no-repeat; /* Evita que la imagen se repita */
    padding-left: 50px;
    padding-top: 20px;
}

.sectiona4 {
    background-image: url("https://arenscristian.com/images/fondo4.png");
    background-size: cover;
    background-position: center;
    width: 100%;
    min-height: 400px; /* Cambia a min-height para permitir que crezca */
    background-repeat: no-repeat;
    padding: 20px 50px; /* Ajusta el padding para mayor espacio */
    display: flex; /* Para asegurar que el contenido se mantenga en su lugar */
    flex-direction: column; /* Permite que el contenido fluya verticalmente */
    align-items: center; /* Centra el contenido */
}
.sectiona3 {
    background-image: url("https://arenscristian.com/images/fondoregistro.webp");
    background-size: cover;
    background-position: center;
    width: 100%;
    min-height: 400px; /* Cambia a min-height para permitir que crezca */
    background-repeat: no-repeat;
    display: flex; /* Para asegurar que el contenido se mantenga en su lugar */
    flex-direction: column; /* Permite que el contenido fluya verticalmente */
    align-items: center; /* Centra el contenido */
}

.sectiona5 {
    background: rgb(154,97,26);
    background: -moz-linear-gradient(273deg, rgba(154,97,26,1) 25%, rgba(0,0,0,1) 49%, rgba(3,2,0,1) 62%, rgba(124,78,20,1) 100%);
    background: -webkit-linear-gradient(273deg, rgba(154,97,26,1) 25%, rgba(0,0,0,1) 49%, rgba(3,2,0,1) 62%, rgba(124,78,20,1) 100%);
    background: linear-gradient(273deg, rgba(154,97,26,1) 25%, rgba(0,0,0,1) 49%, rgba(3,2,0,1) 62%, rgba(124,78,20,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#9a611a",endColorstr="#7c4e14",GradientType=1);}


@media (max-width: 600px) {
    .parati {
        display: flex;
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .sectiona {
        background: rgb(17, 6, 62);
        background: -moz-linear-gradient(
                238deg,
                rgba(17, 6, 62, 1) 10%,
                rgba(14, 35, 135, 1) 28%,
                rgba(17, 3, 55, 1) 51%,
                rgba(13, 45, 161, 1) 83%,
                rgba(255, 233, 39, 1) 94%
        );
        background: -webkit-linear-gradient(
                238deg,
                rgba(17, 6, 62, 1) 10%,
                rgba(14, 35, 135, 1) 28%,
                rgba(17, 3, 55, 1) 51%,
                rgba(13, 45, 161, 1) 83%,
                rgba(255, 233, 39, 1) 94%
        );
        background: linear-gradient(
                238deg,
                rgba(17, 6, 62, 1) 10%,
                rgba(14, 35, 135, 1) 28%,
                rgba(17, 3, 55, 1) 51%,
                rgba(13, 45, 161, 1) 83%,
                rgba(255, 233, 39, 1) 94%
        );
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#11063e", endColorstr="#ffe927", GradientType=1);
    }

    .sectiona4 {
        padding: 20px; /* Reduce el padding en pantallas pequeñas */
        align-items: center;
    }



    .contentaprende4 {
        max-width: 90%; /* Permite que el contenido ocupe más espacio en pantallas pequeñas */
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
    }

    .btncel {
        width: 100%; /* Botón ocupa el ancho completo en pantallas pequeñas */
    }

    .adjusted-criscel {
        max-width: 100%;
        max-height: 90%;
        min-height: 350px;
    }
}

.adjusted-image {
    width: 25% !important; /* Ajusta el ancho a 100 píxeles */
    height: 25%;
    min-width: 150px;
    max-width: 250px; /* Asegura que la imagen no exceda el contenedor */
    display: block; /* Elimina el espacio debajo de la imagen */
}

.adjusted-imagedes {
    width: 25% !important; /* Ajusta el ancho a 100 píxeles */
    height: 25%;
    min-width: 150px;
    max-width: 200px; /* Asegura que la imagen no exceda el contenedor */
    display: block; /* Elimina el espacio debajo de la imagen */
    padding: 10px;
}

.adjusted-image3 {
    width: 20% !important; /* Ajusta el ancho a 100 píxeles */
    height: 20%;
    min-width: 150px;
    max-width: 230px; /* Asegura que la imagen no exceda el contenedor */
    display: block; /* Elimina el espacio debajo de la imagen */
}

.content-aprende {
    display: flex;
    flex-direction: column;
}

.cardia {
    /*border-radius: 15px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier contenido que sobresalga de los bordes redondeados */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Sombra opcional para la tarjeta */
    width: 100%; /* Ancho de la tarjeta, ajusta según sea necesario */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    margin-top: 20px;
}

.cardia2 {
   
    overflow: hidden; /* Oculta cualquier contenido que sobresalga de los bordes redondeados */
    /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);  Sombra opcional para la tarjeta */
    width: 100%; /* Ancho de la tarjeta, ajusta según sea necesario */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    margin-top: 20px;
}

.cardia3 {
    border-radius: 15px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier contenido que sobresalga de los bordes redondeados */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Sombra opcional para la tarjeta */
    width: 100%; /* Ancho de la tarjeta, ajusta según sea necesario */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    margin-top: 20px;
    position: relative; /* Permite manipular el posicionamiento del card */
    z-index: 10; /* Asegura que este card esté por encima de la siguiente sección */
    margin-bottom: -80px; /* Ajusta este valor según lo que necesites para subir más la sección siguiente */
}

.cardia-header {
background: rgb(79,193,2);
background: -moz-linear-gradient(90deg, rgba(79,193,2,1) 0%, rgba(147,182,21,1) 48%, rgba(165,212,23,1) 100%, rgba(203,114,4,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(79,193,2,1) 0%, rgba(147,182,21,1) 48%, rgba(165,212,23,1) 100%, rgba(203,114,4,1) 100%);
background: linear-gradient(90deg, rgba(79,193,2,1) 0%, rgba(147,182,21,1) 48%, rgba(165,212,23,1) 100%, rgba(203,114,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4fc102",endColorstr="#cb7204",GradientType=1); /* Color del texto en la parte superior */
    font-size: 18px; /* Tamaño de la fuente para el título */
    padding: 15px; /* Espaciado interior en la parte superior */
    text-align: start; /* Centra el texto en la parte superior */
}

.card-header2{
    background: rgb(79,193,2);
    background: -moz-linear-gradient(90deg, rgba(79,193,2,1) 0%, rgba(147,182,21,1) 48%, rgba(165,212,23,1) 100%, rgba(203,114,4,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(79,193,2,1) 0%, rgba(147,182,21,1) 48%, rgba(165,212,23,1) 100%, rgba(203,114,4,1) 100%);
    background: linear-gradient(90deg, rgba(79,193,2,1) 0%, rgba(147,182,21,1) 48%, rgba(165,212,23,1) 100%, rgba(203,114,4,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4fc102",endColorstr="#cb7204",GradientType=1);}

.card-header3{
    background: rgb(0,0,0);
background: -moz-linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(87,49,2,1) 100%, rgba(203,114,4,1) 100%);
background: -webkit-linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(87,49,2,1) 100%, rgba(203,114,4,1) 100%);
background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(87,49,2,1) 100%, rgba(203,114,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#cb7204",GradientType=1);}

.card-header7{
    background: #8db300;
    border-radius: 0 !important;
}

.ffmed{
    font-size: medium;
}
.cardia-body {
    background-color: white; /* Color de fondo para la parte inferior */
    color: #110337; /* Color del texto en la parte inferior */
    padding: 15px; /* Espaciado interior en la parte inferior */
    display: flex;
    flex-direction: row;
    font-size: large;
}

.cardia-body6 {
    background-color: white; /* Color de fondo para la parte inferior */
    border-bottom: 8px solid #4b8a00;
    border-left: 8px solid #4b8a00;
    border-right: 8px solid #4b8a00;
    color: #000; /* Color del texto en la parte inferior */
    padding: 15px; /* Espaciado interior en la parte inferior */
    display: flex;
    flex-direction: row;
    font-size: medium;    
}


.cardia-body1 {
    background-color: white; /* Color de fondo para la parte inferior */
    color: black; /* Color del texto en la parte inferior */
    padding: 15px; /* Espaciado interior en la parte inferior */
    display: flex;
    flex-direction: row;
    font-size: large;
}

.cardia-body5 {
    background: rgb(56,31,1);
background: -moz-linear-gradient(180deg, rgba(56,31,1,1) 22%, rgba(203,114,4,1) 100%);
background: -webkit-linear-gradient(180deg, rgba(56,31,1,1) 22%, rgba(203,114,4,1) 100%);
background: linear-gradient(180deg, rgba(56,31,1,1) 22%, rgba(203,114,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#381f01",endColorstr="#cb7204",GradientType=1);
    color: white; /* Color del texto en la parte inferior */
    padding: 15px; /* Espaciado interior en la parte inferior */
    display: flex;
    flex-direction: row;
    font-size: large;
    margin-top: 5px;

}

.cardia-body7 {
    background: rgb(56,31,1);
background: -moz-linear-gradient(180deg, rgba(56,31,1,1) 22%, rgba(203,114,4,1) 100%);
background: -webkit-linear-gradient(180deg, rgba(56,31,1,1) 22%, rgba(203,114,4,1) 100%);
background: linear-gradient(180deg, rgba(56,31,1,1) 22%, rgba(203,114,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#381f01",endColorstr="#cb7204",GradientType=1);
    color: white; /* Color del texto en la parte inferior */
    padding: 15px; /* Espaciado interior en la parte inferior */
    display: flex;
    flex-direction: row;
    font-size: large;
    margin-top: 5px;

}

.cardia-body5 ul {
    list-style: none;
    padding-left: 0;
}

.cardia-body5 ul li {
    position: relative;
    padding-left: 24px; /* Ajusta según el tamaño de la estrella */
    text-indent: 0px; /* Sangrado para alinear el texto */
}

.cardia-body7 ul {
    list-style: none;
    padding-left: 0;
}

.cardia-body7 ul li {
    position: relative;
    padding-left: 24px; /* Ajusta según el tamaño de la estrella */
    text-indent: 0px; /* Sangrado para alinear el texto */
}

.cardia-body5 ul li::before {
    content: "\2605"; /* Código Unicode para la estrella */
    color: white; /* Color dorado */
    position: absolute;
    left: 0; /* Alinear la estrella a la izquierda */
}

.cardia-body7 ul li::before {
    content: "\2605"; /* Código Unicode para la estrella */
    color: white; /* Color dorado */
    position: absolute;
    left: 0; /* Alinear la estrella a la izquierda */
}

.cardia-body6 ul {

    padding-left: 0;
}



.cardia-body6 ul li {
    position: relative;
    padding-left: 14px; /* Ajusta según el tamaño de la estrella */
    text-indent: 0px; /* Sangrado para alinear el texto */
}






.tag1{
    background: rgb(203,114,4);
background: -moz-linear-gradient(90deg, rgba(203,114,4,1) 8%, rgba(255,188,57,1) 100%, rgba(203,114,4,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(203,114,4,1) 8%, rgba(255,188,57,1) 100%, rgba(203,114,4,1) 100%);
background: linear-gradient(90deg, rgba(203,114,4,1) 8%, rgba(255,188,57,1) 100%, rgba(203,114,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cb7204",endColorstr="#cb7204",GradientType=1);
}
.cardfont {
    font-weight: 900;
}

.cardia4 {
    border-radius: 15px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier contenido que sobresalga de los bordes redondeados */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Sombra opcional para la tarjeta */
    width: 100%; /* Ancho de la tarjeta, ajusta según sea necesario */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    margin-top: -40px;
}

.cardia-header4 {
    background: rgb(136, 136, 136);
    background: -moz-radial-gradient(
            circle,
            rgba(136, 136, 136, 1) 0%,
            rgba(0, 0, 0, 1) 79%
    );
    background: -webkit-radial-gradient(
            circle,
            rgba(136, 136, 136, 1) 0%,
            rgba(0, 0, 0, 1) 79%
    );
    background: radial-gradient(
            circle,
            rgba(136, 136, 136, 1) 0%,
            rgba(0, 0, 0, 1) 79%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#888888", endColorstr="#000000", GradientType=1);
    color: #ffffff; /* Color del texto en la parte superior */
    padding: 15px; /* Espaciado interior en la parte superior */
    font-size: 18px; /* Tamaño de la fuente para el título */
    text-align: start; /* Centra el texto en la parte superior */
}

.cardia5 {
    border-radius: 30px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier contenido que sobresalga de los bordes redondeados */
    width: 100%; /* Ancho de la tarjeta, ajusta según sea necesario */
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.cardia-header5 {
    background: #000379;
    color: #54ff51; /* Color del texto en la parte superior */
    padding: 15px; /* Espaciado interior en la parte superior */
    font-size: 18px; /* Tamaño de la fuente para el título */
    text-align: center; /* Centra el texto en la parte superior */
}

.cardia-headercris {
    background: rgb(255, 114, 54);
    background: -moz-radial-gradient(
            circle,
            rgba(255, 114, 54, 1) 37%,
            rgba(255, 77, 0, 1) 79%
    );
    background: -webkit-radial-gradient(
            circle,
            rgba(255, 114, 54, 1) 37%,
            rgba(255, 77, 0, 1) 79%
    );
    background: radial-gradient(
            circle,
            rgba(255, 114, 54, 1) 37%,
            rgba(255, 77, 0, 1) 79%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7236", endColorstr="#ff4d00", GradientType=1);
    color: white; /* Color del texto en la parte superior */
    padding: 15px; /* Espaciado interior en la parte superior */
    font-size: 18px; /* Tamaño de la fuente para el título */
    text-align: start; /* Centra el texto en la parte superior */
}

.adjusted-image1 {
    width: 40% !important; /* Ajusta el ancho a 100 píxeles */
    height: 40%;
    max-width: 100%; /* Asegura que la imagen no exceda el contenedor */
    padding: 10px;
}


    .adjusted-image2 {
        max-width: 380px; /* Asegura que la imagen no exceda el contenedor */
        height: auto; /* Mantiene las proporciones originales de la imagen */
        padding: 10px; /* Espaciado interior */
    }


.adjustedlogo {
    max-width: 150px; /* Asegura que la imagen no exceda el contenedor */
    min-width: 80px;
}

.criscont {
    justify-content: center;
    align-items: center;
    text-align: center;
}

.adjusted-cris {
    max-width: 100%;
    object-fit: cover;
    min-height: 400px;
}

.adjusted-cris2 {
    max-width: 280px;
    object-fit: cover;
    min-height: 400px;
}

.crisimagen {
    padding-left: 50px;
    padding-top: 20px;
    display: flex;
    align-items: flex-end;
}

.adjusted-criscel {
    max-width: 100%;
    max-height: 90%;
    min-height: 350px;
    min-width: 300px;
}

.adjusted-criscel2 {
    max-width: 75%;
    height: auto;
}

@media (max-width: 768px) {
    .adjusted-image1 {
        display: none; /* Oculta la imagen en pantallas móviles */
    }
}

.espacio {
    background-color: #110337;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px;
    border-radius: 15px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier ntnido que sobresalga de los bordes redondeados */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Sombra opcional para la tarjeta */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
    margin-top: 20px;
}

.espacio1 {
    background-color: #010137;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 40px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier ntnido que sobresalga de los bordes redondeados */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Sombra opcional para la tarjeta */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
    border-color: #54ff51;
    margin-top: 50px;
    border: 15px solid #ffe500;
}

.espacio2 {
    background-color: #010137;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 40px; /* Bordes redondeados para toda la tarjeta */
    overflow: hidden; /* Oculta cualquier ntnido que sobresalga de los bordes redondeados */
    font-family: Arial, sans-serif; /* Fuente opcional para el texto */
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
    border-color: #54ff51;
    margin-top: 50px;
    border: 15px solid #ffe500;
}

.gracias2 {
    position: relative; /* Necesario para usar z-index */
    background-color: black;
    overflow: hidden; /* Asegura que no se salgan los elementos */
}

.titespacio {
    font-size: 28px;
    background: rgb(255, 71, 63);
    background: -moz-linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    background: linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff473f", endColorstr="#ffe927", GradientType=1);
    -webkit-background-clip: text; /* Clip del fondo al texto en navegadores WebKit (Chrome, Safari) */
    -webkit-text-fill-color: transparent; /* Hace que el texto sea transparente para que el gradiente sea visible */
    background-clip: text; /* Clip del fondo al texto en otros navegadores */
    color: transparent; /* Asegura que el color del texto sea transparente */
    text-align: center;
}

.titespacio1{
    font-size: 28px;
    color: #b4fe2f;
}

.titespacio2{
    background: rgb(255, 71, 63);
background: -moz-linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(255,233,39,1) 0%, rgba(255,0,0,1) 0%, rgba(255,172,63,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(255,233,39,1) 0%, rgba(255,0,0,1) 0%, rgba(255,172,63,1) 100%);
background: linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(255,233,39,1) 0%, rgba(255,0,0,1) 0%, rgba(255,172,63,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#110337",endColorstr="#ffac3f",GradientType=1);
    -webkit-background-clip: text; /* Clip del fondo al texto en navegadores WebKit (Chrome, Safari) */
    -webkit-text-fill-color: transparent; /* Hace que el texto sea transparente para que el gradiente sea visible */
    background-clip: text; /* Clip del fondo al texto en otros navegadores */
    color: transparent; /* Asegura que el color del texto sea transparente */
    text-align: center;
}


.caja{
    background: rgb(17,3,55);
background: -moz-linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(255,198,45,1) 0%, rgba(255,67,64,1) 96%);
background: -webkit-linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(255,198,45,1) 0%, rgba(255,67,64,1) 96%);
background: linear-gradient(90deg, rgba(17,3,55,0.7931547619047619) 0%, rgba(255,198,45,1) 0%, rgba(255,67,64,1) 96%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#110337",endColorstr="#ff4340",GradientType=1);
}

.quien {
    background: rgb(203,114,4);
background: -moz-linear-gradient(0deg, rgba(203,114,4,1) 0%, rgba(26,15,1,1) 53%, rgba(0,0,0,1) 100%, rgba(203,114,4,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(203,114,4,1) 0%, rgba(26,15,1,1) 53%, rgba(0,0,0,1) 100%, rgba(203,114,4,1) 100%);
background: linear-gradient(0deg, rgba(203,114,4,1) 0%, rgba(26,15,1,1) 53%, rgba(0,0,0,1) 100%, rgba(203,114,4,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cb7204",endColorstr="#cb7204",GradientType=1);
    padding-top: 20px;
    padding-bottom: 20px;
}

.quien1 {
    background: rgb(136, 136, 136);
    background: -moz-radial-gradient(
            circle,
            rgba(136, 136, 136, 1) 0%,
            rgba(0, 0, 0, 1) 79%
    );
    background: -webkit-radial-gradient(
            circle,
            rgba(136, 136, 136, 1) 0%,
            rgba(0, 0, 0, 1) 79%
    );
    background: radial-gradient(
            circle,
            rgba(136, 136, 136, 1) 0%,
            rgba(0, 0, 0, 1) 79%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#888888", endColorstr="#000000", GradientType=1);
    padding-top: 20px;
    padding-bottom: 20px;
}

.cris {
    font-size: small;
    padding-top: 24px;
}

.cris1 {
    color: black;
    padding-top: 20px;
    font-size: large;
}

@media (max-width: 768px) {
    .adjusted-image2 {
        min-width: 260px; /* Ancho del cuadrado */
        height: 280px; /* Alto del cuadrado */
        object-fit: cover; /* Recorta la imagen para que cubra todo el cuadrado */
        display: block; /* Asegura que la imagen sea un bloque */
        margin: 0 auto; /* Centra la imagen */
        object-position: top;
    }

    .cris {
        text-align: center; /* Centra el texto */
        padding-top: 10px; /* Espacio adicional arriba del texto */
    }

    .cardia-body {
        display: flex;
        flex-direction: column;
        
    }

    .cardia-body1 {
        display: flex;
        flex-direction: column;
        
    }

    .cardia-body5 {
        display: flex;
        flex-direction: column;
       
    }

    .cardia-body7 {
        display: flex;
        flex-direction: column;
       
    }
}

.w9 {
    font-weight: 900;
}

.last {
    background: rgb(13, 45, 161);
    background: -moz-linear-gradient(
            0deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%
    );
    background: -webkit-linear-gradient(
            0deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%
    );
    background: linear-gradient(
            0deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d2da1", endColorstr="#110337", GradientType=1);
}

.w5 {
    font-weight: 500;
}
.w6 {
    font-weight: 600;
}

.w7 {
    font-weight: 700;
}

.w8 {
    font-weight: 800;
}

.yellowfont {
    color: #f4ff1c;
}

.verdefont {
    color: #b4fe2e;
}

.orangefont {
    color: #ff5d17;
}

.yefont {
    color: #ffe500;
}

.last {
    background: rgb(13, 45, 161);
    background: -moz-linear-gradient(
            0deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%
    );
    background: -webkit-linear-gradient(
            0deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%
    );
    background: linear-gradient(
            0deg,
            rgba(13, 45, 161, 1) 28%,
            rgba(17, 3, 55, 1) 51%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d2da1", endColorstr="#110337", GradientType=1);
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.headvid {
    background: rgb(13, 45, 161);
    background: -moz-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 18%,
            rgba(17, 3, 55, 1) 30%,
            rgba(17, 3, 55, 1) 68%,
            rgba(13, 45, 161, 1) 92%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 18%,
            rgba(17, 3, 55, 1) 30%,
            rgba(17, 3, 55, 1) 68%,
            rgba(13, 45, 161, 1) 92%
    );
    background: linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 18%,
            rgba(17, 3, 55, 1) 30%,
            rgba(17, 3, 55, 1) 68%,
            rgba(13, 45, 161, 1) 92%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d2da1", endColorstr="#0d2da1", GradientType=1);
}

.headvid2 {
    background-image: url("https://arenscristian.com/images/corto-fondo-1.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.headvid3 {
    background-image: url("https://arenscristian.com/images/fondogra.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.highlight {
    color: #ff473f;
}

.greenfont {
    color: #0fb;
}

.secvideo2 {
    background-image: url("https://arenscristian.com/images/corto-fondo-2.png");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.secvideo {
    background: rgb(13, 45, 161);
    background: -moz-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 5%,
            rgba(17, 6, 62, 1) 18%,
            rgba(17, 3, 55, 1) 61%,
            rgba(14, 35, 135, 1) 78%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 5%,
            rgba(17, 6, 62, 1) 18%,
            rgba(17, 3, 55, 1) 61%,
            rgba(14, 35, 135, 1) 78%
    );
    background: linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 5%,
            rgba(17, 6, 62, 1) 18%,
            rgba(17, 3, 55, 1) 61%,
            rgba(14, 35, 135, 1) 78%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d2da1", endColorstr="#ffe927", GradientType=1);
}

.secvideo1 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.impor {
    background: rgb(13, 45, 161);
    background: -moz-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 18%,
            rgba(17, 3, 55, 1) 42%,
            rgba(17, 3, 55, 1) 89%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 18%,
            rgba(17, 3, 55, 1) 42%,
            rgba(17, 3, 55, 1) 89%
    );
    background: linear-gradient(
            238deg,
            rgba(13, 45, 161, 1) 18%,
            rgba(17, 3, 55, 1) 42%,
            rgba(17, 3, 55, 1) 89%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d2da1", endColorstr="#110337", GradientType=1);
}

.impor2 {
    background-image: url("https://arenscristian.com/images/gracias-fondo-2.png");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.impor3 {
    background: rgb(154,97,26);
    background: -moz-linear-gradient(273deg, rgba(154,97,26,1) 25%, rgba(0,0,0,1) 49%, rgba(3,2,0,1) 62%, rgba(124,78,20,1) 100%);
    background: -webkit-linear-gradient(273deg, rgba(154,97,26,1) 25%, rgba(0,0,0,1) 49%, rgba(3,2,0,1) 62%, rgba(124,78,20,1) 100%);
    background: linear-gradient(273deg, rgba(154,97,26,1) 25%, rgba(0,0,0,1) 49%, rgba(3,2,0,1) 62%, rgba(124,78,20,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#9a611a",endColorstr="#7c4e14",GradientType=1);}
.btnsoporte {
    background: #ffffff;
    color: black;
    padding: 10px;
    border-radius: 10px;
    font-size: 18px;
}

.btnsoporte2 {
    background: #80ff00;
    color: black;
    padding: 5px;
    border-radius: 10px;
}
.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
}

.banner-container {
    position: relative;
    width: 100%;
    max-width: 600px; /* Ancho máximo opcional */
}

.banner-container img {
    width: 100%;
    height: auto; /* Mantiene las proporciones de la imagen */
}

.centered-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 24px;
    font-weight: bold;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); /* Sombra opcional para mejorar legibilidad */
}

.highfont {
    font-size: calc(3rem + 2vw);
    font-family: "Bebas Neue", sans-serif !important;
    line-height: calc(1.5rem);
}

.btnsem1 {
    background: rgb(255, 71, 63);
    background: -moz-linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    background: -webkit-linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    background: linear-gradient(
            238deg,
            rgba(255, 71, 63, 1) 20%,
            rgba(255, 233, 39, 1) 86%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff473f", endColorstr="#ffe927", GradientType=1);
    padding: 10px;
    border-radius: 15px;
    font-size: 18px;
    color: #110337;
}

/* Sell landing page */
.sell-container {
    margin: auto;
    position: relative;
    background: conic-gradient(
            from 180.07deg at 50.06% 50.13%,
            #252525 0deg,
            #183a2a 32.97deg,
            #055831 57.96deg,
            #055831 61.38deg,
            #12432c 90.83deg,
            #202d27 102.83deg,
            #252525 162.01deg,
            #1d3128 196.48deg,
            #14402b 219.88deg,
            #055831 233.08deg,
            #1a3629 270.4deg,
            #212b26 305.33deg,
            #252525 360deg
    );
}

.hero-bg-landing-1 {
    background-image: url("https://arenscristian.com/images/hero-bg-landing-1.svg");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
}

.hero-bg-landing-2 {
    background-image: url("https://arenscristian.com/images/hero-bg-landing-2.svg");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
}

.sell-video-container {
    width: 100%;
    box-shadow: 0px 0px 20px 15px #ffe500;
}

.sell-video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.body-content {
    margin: 0 auto;
    padding: 0;
    height: 100vh;
    box-sizing: border-box;
}

.navbar-landing {
    background-color: #1f1f1f;
}

.time-clock {
    display: none;
    gap: 6px;
    color: #ffe500;
    align-items: flex-end;

    h2 {
        font-size: 32px;
        line-height: 1.5rem;
        margin-bottom: 0;
    }

    span {
        font-size: 14px;
        margin-right: 8px;
    }

    h2,
    span {
        font-family: Bebas Neue;
        font-weight: 700;
    }
}

.sell-title {
    margin: auto;
    padding-top: 20px;
    color: #ffffff;
    text-align: center;

    span {
        color: #80ff00;
        font-size: 26px;
        font-weight: 800;
        line-height: 39px;
        text-align: center;
    }
}

.start-selling {
    display: flex;
    align-items: center;
    padding-bottom: 30px;
    flex-direction: column;
    justify-content: center;
}
    .main-title {
        font-size: 16px;
        font-weight: 700;
    }

    .start-btn {
        background-color: #ffe500;

        span {
            font-weight: 900;
            font-family: "Montserrat";
        }
    }

    .start-btn,
    .end-btn {
        border: none;
        padding: 20px 40px;
        font-size: 26px;
        line-height: 30px;
        border-radius: 20px;
    }

    .end-btn {
        background-color: #80ff00 !important;

        span {
            font-weight: 900;
            font-family: "Montserrat";
        }
    }

    .opportunity-title {
        font-size: 18px;
        text-align: center;
        border-bottom: 6px solid #00943b;
    }

    .opportunity-second-title {
        font-size: 18px;
        text-align: center;
        border-bottom: 6px solid #e20a0a;
    }

    .opportunity-content {
        max-width: 100%;
        text-align: center;
    }

    .promotion-title {
        font-weight: 800;
        text-align: center;

        span {
            color: #00b809;
        }
    }

    .promotion-subtitle {
        font-size: 29px;
        font-weight: 700;
        line-height: 36px;
        text-align: center;
    }

    .promos {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 50px;
        gap: 20px;
        flex-wrap: wrap;
    }

    .first-promotion {
        background-color: #1c1c1c;
        color: #ffffff;
    }

    .promo-content {
        display: flex;
        flex-direction: column;
        gap: 10px;

        h4 {
            font-size: 68px;
            font-weight: 700;
            line-height: 70px;
            color: #80ff00;
        }

        h5 {
            font-size: 45px;
            font-weight: 700;
            line-height: 46px;
        }

        p {
            font-weight: 500;
            font-size: 20px;
            line-height: 24px;
        }
    }

    .second-promotion {
        border: 8px solid #faca2c !important;


        li {
            font-weight: 500;
            font-size: 20px;
            line-height: 24px;
            margin-bottom: 10px;
        }
    }

    .five-promotion {
        background: rgb(216,111,41);
background: -moz-linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
background: -webkit-linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
background: linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d86f29",endColorstr="#faca2c",GradientType=1);


        li {
            font-weight: 500;
            font-size: 20px;
            line-height: 24px;
            margin-bottom: 10px;
        }
    }

.fondobox{
    background: rgb(216,111,41);
background: -moz-linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
background: -webkit-linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
background: linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d86f29",endColorstr="#faca2c",GradientType=1);
}

.sombratexto{
    background-color: rgb(0,50,180); /* Fondo azul */
  color: white; /* Color del texto blanco */
  padding: 5px; 
} 
.fondopalabras{
    background-color: rgb(0,50,180); /* Fondo azul */
  color: #ffe500; /* Color del texto blanco */
  padding: 5px; 
} 

.promotion-subtitle {
    font-size: 29px;
    font-weight: 700;
    line-height: 36px;
    text-align: center;
}

.fiv-promotion {
    background: rgb(216,111,41);
background: -moz-linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
background: -webkit-linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
background: linear-gradient(97deg, rgba(216,111,41,1) 0%, rgba(217,114,41,1) 39%, rgba(250,202,44,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d86f29",endColorstr="#faca2c",GradientType=1);
}


.promos {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
    gap: 20px;
    flex-wrap: wrap;
}



.first-promotion {
    background-color: #1c1c1c;
    color: #ffffff;

    .promo-content__title {
        color: #ffe500;
        font-size: 22px;
        font-weight: 700;
        line-height: 23px;
    }
}

.promo-content {
    display: flex;
    flex-direction: column;
    gap: 10px;

    h4 {
        color: #80ff00;
        font-family: "Bebas Neue";
        font-size: 60px;
        font-weight: 700;
        line-height: 61px;
    }

    h5 {
        font-family: "Bebas Neue";
        font-size: 44px;
        font-weight: 700;
        line-height: 45px;
    }

    p {
        font-weight: 500;
        font-size: 20px;
        line-height: 24px;
    }
}

.second-promotion {
    border: 8px solid #6dda00;

    li {
        font-weight: 500;
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 10px;
    }
}

.promotion {
    margin-bottom: 60px;

    .promotion-title {
        font-weight: 800;
        text-align: center;

        span {
            color: #00b809;
        }
    }

    .promotion-subtitle {
        font-size: 29px;
        font-weight: 700;
        line-height: 36px;
        text-align: center;
    }

    .promos {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 50px;
        gap: 20px;
        flex-wrap: wrap;
    }

    .first-promotion,
    .second-promotion {
        img {
            width: 100%;
        }
    }

    .first-promotion {
        background-color: #1c1c1c;
        color: #ffffff;
    }

    .promo-content {
        display: flex;
        flex-direction: column;
        gap: 10px;

        h4 {
            font-size: 34px;
            font-weight: 700;
            line-height: 35px;
            color: #80ff00;
        }

        h5 {
            font-size: 22px;
            line-height: 23px;
        }

        p {
            font-size: 16px;
            line-height: 18px;
        }
    }

    .second-promotion {
        border: 8px solid #6dda00;
        position: relative;

        li {
            font-weight: 500;
            font-size: 16px;
            line-height: 20px;
            margin-bottom: 10px;
        }
    }
}

.limited-edition {
    
    position: absolute;
    bottom: 50px;
    right: -100px;
    max-width: 200px !important;

    img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

.entradacircum{
    max-width: 107%; 
    max-height: max-content
}

.bonus-card-bg-1 {
    background-image: url("https://arenscristian.com/images/card-bg-1.jpg") !important;
}

.bonus-card-bg-2 {
    background-image: url("https://arenscristian.com/images/card-bg-2.png") !important;
}

.bonus {
    margin: auto;

    .bonus-card {
        position: relative;
        display: flex;
        align-items: center;
        flex-direction: column;
        border-radius: 32px;
        padding: 30px;
        color: #ffffff;
        background-image: url("images/cardcircus.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
        text-align: center;
        overflow: hidden;

        .bonus-img {
            margin-top: 23px;
        }

        h4 {
            font-size: 22px;
            font-weight: 600;
            line-height: 28px;
        }

        p {
            font-size: 14px;
            font-weight: 500;
            line-height: 18px;
        }

        .first-title {
            color: #ffe500;
        }

        .second-title {
            color: #80ff00;
        }

        .third-title {
            color: #2dffe7;
        }

        .fourth-title {
            color: #ff8400;
        }
    }

    .circus-experience {
        position: absolute;
        bottom: 40px;
        right: 80px;
    }
}

.bonus-title {
    font-family: Bebas Neue;
    font-size: 2.500rem;
    font-weight: 600;
    line-height: 70px;
    text-align: center;
}

.secret-bonus {
    margin: auto;
    padding-bottom: 60px;

    .secret-bonus-card {
        min-width: 327px;
        position: relative;
        height: 434px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 32px;
        background: rgb(15,220,124);
        background: -moz-radial-gradient(circle, rgba(15,220,124,1) 0%, rgba(5,92,51,1) 62%, rgba(5,88,49,1) 100%);
        background: -webkit-radial-gradient(circle, rgba(15,220,124,1) 0%, rgba(5,92,51,1) 62%, rgba(5,88,49,1) 100%);
        background: radial-gradient(circle, rgba(15,220,124,1) 0%, rgba(5,92,51,1) 62%, rgba(5,88,49,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0fdc7c",endColorstr="#055831",GradientType=1);
    }

    .secret-bonus-card-2025 {
        background: radial-gradient(50% 50% at 50% 50%, #FF7236 0%, #912C00 100%) !important;
    }

    .secret-bonus-card-2 {
        min-width: 327px;
        position: relative;
        height: 434px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
        border-radius: 32px;
        background: rgb(15,135,220);
        background: -moz-radial-gradient(circle, rgba(15,135,220,1) 0%, rgba(51,11,146,1) 100%);
        background: -webkit-radial-gradient(circle, rgba(15,135,220,1) 0%, rgba(51,11,146,1) 100%);
        background: radial-gradient(circle, rgba(15,135,220,1) 0%, rgba(51,11,146,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0f87dc",endColorstr="#330b92",GradientType=1);
    }

    .secret-number {
        width: 80%;
        height: 57px;
        display: flex;
        padding: 0 12px;
        position: absolute;
        align-items: center;
        font-family: Poppins;
        background: #ffe500;
        justify-content: center;
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);

        span {
            font-size: 24px;
            font-weight: 700;
            line-height: 36px;
        }
    }

    .list-bonus-secret {
        list-style: none;
    }

    .list-bonus-secret,
    .list-bonus-prices {
        font-family: Poppins;

        li {
            font-size: 20px;
            font-weight: 600;
            line-height: 38px;
            margin-top: 10px;

            .side-price {
                color: #e80000;
                text-align: center;
                font-weight: 600;
            }
        }
    }

    .list-bonus-prices {
        list-style: none;
        color: #e80000;

        li {
            text-align: center;
        }
    }
}

.exclusive-benefits {
    display: flex;
    align-items: center;
    padding-bottom: 60px;
    flex-direction: column;
    justify-content: center;

    .exclusive-title {
        margin-bottom: 60px;
        font-family: "Bebas Neue";
        text-align: center;
        font-size: 53px;
        font-style: normal;
        font-weight: 700;
        line-height: 54px;
        text-transform: capitalize;

        span {
            font-family: "Bebas Neue";
            color: #53a700;
            text-decoration-line: underline;
        }
    }

    .btn-exclusive {
        border-radius: 36px;
        background: #1d1d1d;
        box-shadow: 0px 0px 22.97px 11.485px #2fff00;
        color: #0fff3a;
        font-family: Montserrat;
        font-weight: 800;
    }
}

.group-price {
    color: #1f1f1f;
    text-align: center;
    font-family: "Poppins";
    font-size: 70px;
    font-weight: 600;
    line-height: 89px;
    
}

.strikethrough {
    text-decoration: line-through; /* Crea la línea que atraviesa el texto */
}

.linea-separadora {
    border: 0; /* Elimina el borde por defecto */
    height: 2px; /* Grosor de la línea */
    background-color: #000; /* Color de la línea */
    margin: 20px 0; /* Espaciado alrededor de la línea */
}

.group-subtitle {
    text-align: center;
    font-family: "Montserrat";
    font-size: 17px;
    font-weight: 800;
    line-height: 21px;
    margin-bottom: 10px;
}

.exclusive-list {
    font-size: 20px;
    font-weight: 600;
    color: #1f1f1f;
    font-family: Poppins;
}

.students-2 {
    background: rgb(0, 255, 255);
    background: -moz-radial-gradient(circle, rgb(0, 255, 255) 0%, rgba(0,0,0,1) 100%);
    background: -webkit-radial-gradient(circle, rgb(0, 255, 255) 0%, rgba(0,0,0,1) 100%);
    background: radial-gradient(circle, rgb(0, 255, 255) 0%, rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffe500",endColorstr="#000000",GradientType=1);
}

.students {
    padding: 80px 40px;
    background: rgb(255,229,0);
background: -moz-radial-gradient(circle, rgba(255,229,0,1) 0%, rgba(0,0,0,1) 100%);
background: -webkit-radial-gradient(circle, rgba(255,229,0,1) 0%, rgba(0,0,0,1) 100%);
background: radial-gradient(circle, rgba(255,229,0,1) 0%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffe500",endColorstr="#000000",GradientType=1);
    );

    .students-title {
        font-size: 40px;
        font-weight: 700;
        color: #ffffff;
        line-height: 45px;
        text-align: center;
        margin-bottom: 48px;
        font-family: "Bebas Neue";
    }

    .student-card {
        width: 100%;
        height: 245px;

        iframe {
            width: 100%;
            height: 100%;
        }
    }
}

.garantee {
    padding: 40px;

    .garantee-title {
        font-family: "Bebas Neue";
        font-size: 56px;
        font-weight: 700;
        line-height: 54px;
        border-bottom: 5px solid #14ac00;
        padding: 10px 0;
        margin-bottom: 10px;

        span {
            font-family: "Bebas Neue";
            color: #14ac00;
        }
    }
    .best-moments {
        font-size: 70px;
        font-weight: 700;
        color: #292929;
        line-height: 64px;
        text-align: center;
        font-family: "Bebas Neue";
    }
}

.faq {
    color: #ffffff;
    background: #00380a;

    .faq-title {
        margin-bottom: 50px;
        font-size: 46px;
        font-weight: 700;
        line-height: 60px;
        text-align: center;
        font-family: Montserrat;
    }

    .faq-paragraph {
        margin-bottom: 30px;
        font-family: Montserrat;
        font-size: medium;
        font-weight: 500;
        line-height: 32px;

        span {
            color: #1cff77;
            font-family: Montserrat;
            font-weight: 700;
        }
    }

    .faq-doubt {
        text-align: center;
        font-family: Montserrat;
        font-size: 38px;
        font-weight: 700;
        line-height: 49px;

        span {
            color: #ebff00;
            font-family: Montserrat;
        }
    }

    .btn-contact, .btn-contact:hover, .btn-contact:active {
        border-radius: 36px;
        background: #80ff00;
        font-family: Montserrat;
        font-size: 24px;
        font-weight: 800;
        line-height: 24px;
        padding: 20px 10px;
    }
}

.footer-sell {
    color: #ffffff;
    padding: 40px 0;
}

@media only screen and (max-width: 459px) {
    .btver {
        max-width: 400px;
        margin: auto;
    }
}

@media only screen and (min-width: 600px) {
    .time-clock {
        display: flex;

        h2 {
            font-size: 64px;
            line-height: 3rem;
        }

        span {
            font-size: 20px;
            margin-right: 10px;
        }

        h2,
        span {
            font-family: Bebas Neue;
            font-weight: 700;
        }
    }

    .sell-title {
        padding-top: 30px;

        span {
            font-size: 34px;
            color: #80ff00;
            line-height: 39px;
        }
    }

    .start-selling {
        margin-top: 20px;
        gap: 28px;

        .main-title {
            font-size: 42px;
            margin: 40px 0;
        }

        .opportunity-title,
        .opportunity-second-title {
            font-size: 28px;
            text-align: left;
        }

        .opportunity-content {
            font-size: 20px;
        }

        .promotion-title {
            span {
                color: #00b809;
            }
        }

        .promotion-subtitle {
            font-size: 29px;
            line-height: 36px;
        }

        .promos {
            gap: 20px;
            display: flex;
            flex-wrap: wrap;
            margin-top: 50px;
            align-items: center;
            justify-content: center;
        }

        .first-promotion {
            background-color: #1c1c1c;
            color: #ffffff;
        }

        .promo-content {
            h4 {
                font-size: 65px;
                font-weight: 700;
                line-height: 70px;
                color: #80ff00;
            }

            h5 {
                font-size: 45px;
                font-weight: 700;
                line-height: 46px;
            }

            p {
                font-weight: 500;
                font-size: 20px;
                line-height: 24px;
            }
        }
    }

    .promotion {
        .first-promotion,
        .second-promotion {
        }

        .promo-content__title {
            font-size: 26px;
            line-height: 26px;
        }

        .promo-content {
            h4 {
                font-size: 65px;
                line-height: 70px;
            }

            h5 {
                font-size: 45px;
                line-height: 46px;
            }

            p {
                font-size: 20px;
                line-height: 24px;
            }
        }

        .second-promotion {
            h4,
            h5 {
                font-weight: 700;
                text-align: center;
            }

            h5 {
                font-size: 37px;
                line-height: 38px;
            }

            h4 {
                font-size: 48px;
                line-height: 49px;
            }

            li {
                font-size: 20px;
                line-height: 24px;
            }

        }
    }

    .students, .students-2 {
        .student-card {
            width: 28%;
        }
    }
}

.start-btn {
    background-color: #ffe500 !important;

    span {
        font-weight: 900;
        font-family: "Montserrat";
    }
}

.end-btn {
    border: none !important;
    padding: 20px 40px !important;
    font-size: 26px !important;
    line-height: 30px !important;
    border-radius: 20px !important;
}

.end-btn {
    background-color: #80ff00;

    span {
        font-weight: 900;
        font-family: "Montserrat";
    }
}

.ff-poppins {
    font-family: "Poppins";
}

.cardyellow {
    display: flex;
    flex-direction: row; /* Valor predeterminado en pantallas grandes */
    align-items: center;
    text-align: start;
    justify-content: center;
}

.card50{
    padding: 50px;
}

/* Cambiar a columna en pantallas pequeñas */
@media (max-width: 1000px) {
    .cardyellow {
        flex-direction: column;
        text-align: center;
    }
    .limited-edition {
    
        position: absolute;
        max-width: 150px !important;
        bottom: -60px;
        right: 0px;
    
        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }

    .card50{
        padding: 0px;
    }
}

.cardyellow1 {
    display: flex;
    flex-direction: row; /* Valor predeterminado en pantallas grandes (fila) */
    align-items: center;
    text-align: start;
    justify-content: center;
}

/* Cambiar a columna invertida en pantallas pequeñas */
@media (max-width: 1000px) {
    .cardyellow1 {
        flex-direction: column-reverse; /* Coloca la imagen arriba y el texto abajo */
        text-align: center; /* Centra el texto */
    }
    .fiv-promotion {
    max-width: 100%;
    }
    

}

.giftbox{
    padding:10px ;
}

/* Contenedor principal que usa Flexbox para disposición */
#countdown {
    display: flex;
    justify-content: center;
    gap: 1rem; /* Espacio entre cada item */
    flex-wrap: wrap; /* Permite que los elementos se ajusten en una nueva línea si no caben */
    text-align: center; /* Centra el texto */
}

/* Cada item dentro del contador */
.countdown-item {
    display: flex;
    flex-direction: column; /* Coloca el número (h1) arriba y la etiqueta (span) abajo */
    align-items: center;
}

/* Asegura que los números (h1) tengan un tamaño grande */
#countdown h1 {
    font-size: 4rem; /* Ajusta el tamaño de los números */
    margin: 0;
}

/* Tamaño de las etiquetas (span) más pequeño */
#countdown .fs-5 {
    font-size: 1rem; /* Etiquetas más pequeñas */
}

/* Media query para pantallas más pequeñas (móviles) */
@media (max-width: 767px) {
    #countdown {
        align-items: center; /* Centra todo */
    }

    #countdown .countdown-item {
        flex-direction: column; /* En móviles, coloca el número (h1) arriba y la etiqueta (span) abajo */
        margin-bottom: 1rem; /* Espacio entre cada item */
    }

    #countdown h1 {
        font-size: 5rem; /* Reduce el tamaño de los números en móviles */
    }

    #countdown .fs-5 {
        line-height: 3rem;
        font-size: 2.25rem; /* Reduce el tamaño de las etiquetas en móviles */
    }
}

/* Media query para pantallas grandes (de escritorio) */
@media (min-width: 768px) {
    #countdown {
        flex-direction: row; /* En pantallas grandes, coloca los items en una fila */
    }

    #countdown .countdown-item {
        flex-direction: row; /* En pantallas grandes, coloca el número (h1) y la etiqueta (span) en fila */
        align-items: baseline; /* Alinea el número y la etiqueta */
    }

    #countdown h1 {
        font-size: 6rem; /* Tamaño grande para los números */
    }

    #countdown .fs-5 {
        font-size: 4rem; /* Etiquetas más grandes en pantallas grandes */
    }
}

.chimg{
    width: 50% !important;
   }

@media (max-width: 400px) {
   .chimg{
    width: 75% !important;
   }
}

.fw-extrabold {
    font-weight: 800;
}

.fs-17px {
    font-size: 17px;
}

.cyan-gradient {
    background: rgb(0,0,0);
    background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,255,255,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,255,255,1) 100%);
    background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#00ffff",GradientType=1);
}

.lista-de-espera-container {
    width: 100%;
}

@media (min-width: 768px) {
    .lista-de-espera-container {
        width: 60%;
    }
}

@media (min-width: 768px) {
.lista-de-espera-wrapper {
    background-image: url('images/fondo-lista-de-espera.png');
    background-size: auto 100%;
    background-repeat: no-repeat
}
}

section.bg-black {
    background-color: #000000 !important;
}

.text-FFF500 {
    color: #FFF500;
}

.text-FFFB01 {
    color: #FFFB01;
}


.gradient-orange {
    background: #BA4512;
    background: -webkit-linear-gradient(0deg, rgba(186, 69, 18, 1) 0%, rgba(41, 14, 0, 1) 100%);
    background: -moz-linear-gradient(0deg, rgba(186, 69, 18, 1) 0%, rgba(41, 14, 0, 1) 100%);
    background: linear-gradient(0deg, rgba(186, 69, 18, 1) 0%, rgba(41, 14, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#BA4512", endColorstr="#290E00", GradientType=0);
}


/* INICIO DEL CODIGO CSS DEL POPUP DE TODO EL SITIO - Fondo oscuro que cubre toda la pantalla */
/* --- CONTENEDOR PRINCIPAL Y POSICIÓN --- */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Un poco menos oscuro para que resalte el popup */
    z-index: 9999;
    display: none; /* Controlado por JS */
}

.popup-contenido {
    position: absolute;
    bottom: 0;
    right: 0;
    /* Dimensiones fijas para el estilo "Banner" */
    width: 90%; /* Ancho en móviles */
    max-width: 850px; /* Ancho máximo en PC (más ancho que antes) */
    height: 450px; /* ALTURA FIJA: Esto controla que llegue a media página */
    
    background-color: #080808; /* Negro casi puro */
    border-top: 3px solid #ffd700; /* Solo borde dorado arriba */
    border-left: 3px solid #ffd700; /* Y a la izquierda */
    border-top-left-radius: 15px;
    box-shadow: -10px -10px 30px rgba(0, 0, 0, 0.5);
    overflow: hidden; /* Importante para que la imagen no se salga */
    
    /* Animación de entrada */
    transform: translateY(100%);
    transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Clase para activar la animación */
.popup-contenido.is-visible {
    transform: translateY(0);
}


/* --- GRID LAYOUT (DISTRIBUCIÓN 60% / 40%) --- */
.popup-grid {
    display: flex;
    height: 100%; /* Ocupa toda la altura del contenedor */
   
}

/* --- COLUMNA IZQUIERDA: TEXTO --- */
.popup-texto-container {
    flex: 1; /* Ocupa el 60% del espacio aprox */
    padding: 60px ; /* Espacio interno generoso 30px 40px 30px*/
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Centra el texto verticalmente */
    text-align: center;
    color: #fff;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* --- ESTILO PARA EL LOGO (IMAGEN IZQUIERDA) --- */
.popup-logo-img {
    display: block;
    
    /* MODIFICA ESTE NÚMERO PARA CAMBIAR EL TAMAÑO */
    max-width: 100px;  /* Prueba bajando a 180px o 200px */
    
    width: 100%;
    height: auto;
    margin: 0 auto 10px auto; /* Esto la centra y da espacio abajo */
}

/* Botón cerrar */
.cerrar-btn {
    position: absolute;
    top: 10px; /* Un poco más cerca del borde superior */
    right: 15px; /* Lo ponemos a la derecha */
    left: auto; /* IMPORTANTE: Quitamos la posición izquierda */
    font-size: 28px;
    color: #fff; /* Lo ponemos blanco para que se vea */
    cursor: pointer;
    transition: color 0.3s;
    z-index: 99999; /* Aseguramos que esté por encima de todo */
}

.cerrar-btn:hover { 
    color: #ffd700; 
}


/* Tipografía */
.popup-sello {
    color: #ffd700;
    margin: 0;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 700;
}

.popup-titulo {
    color: #fff;
    font-size: 2.8rem; /* Título mucho más grande */
    line-height: 1;
    margin: 10px 0 25px 0;
    text-transform: uppercase;
    font-weight: 900;
    background: -webkit-linear-gradient(#fff, #e0e0e0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.popup-titulo span.dorado-txt { color: #ffd700; -webkit-text-fill-color: #ffd700; }

.popup-mensaje {
    font-size: 1.19rem;
    line-height: 1.15;
    margin-bottom: 15px;
    color: #ddd;
}
.popup-mensaje strong, .popup-submensaje strong { color: #ffd700; font-weight: 700; }

.popup-submensaje { font-size: 0.9rem; line-height: 1; margin-bottom: 20px; color: #ccc; font-style: italic; }

.popup-info {
    font-size: 0.8rem;
    font-weight: 800;
    margin-bottom: 10px;
    text-transform: uppercase;
    color: #fff;
    letter-spacing: 1px;
}

/* Botón de acción */
.popup-boton {
    background-color: #ffd700;
    color: #000;
    padding: 15px 40px;
    text-decoration: none;
    font-weight: 900;
    font-size: 1.1rem;
    border-radius: 10px; /* Bordes menos redondeados para un look más serio */
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s;
    box-shadow: 0 5px 15px rgba(255, 215, 0, 0.3);
    text-align: center;
    margin-bottom: 20px;
}
.popup-boton:hover {
    transform: translateY(-3px);
    background-color: #ffea70;
    box-shadow: 0 8px 20px rgba(255, 215, 0, 0.4);
}

/* Además, ajusta el footer para que se vea bien en la derecha */
.popup-footer {
    margin-top: 0px; /* Reduce el margen superior */
    line-height: 1rem;
    font-weight: 700; 
    font-size: 0.9rem; 
    color: #fff; 
    text-align: center; /* Centra el texto del footer en la columna */
}
.popup-footer-small { font-size: 0.8rem; color: #999; margin-top: 5px; }


/* --- COLUMNA DERECHA: IMAGEN FULL --- */
.popup-imagen-container {
    flex: 1; /* Para que ocupe el 50% del ancho */
    margin-top: 0px;
    height: 100%;
    padding: 10px; 
    position: relative;
    background-color: #000;
    display: flex;
    flex-direction: column; /* Apila elementos verticalmente */
    
    /* Centra HORIZONTALMENTE */
    align-items: center; 
    
    /* Centra VERTICALMENTE TODO EL GRUPO (Imagen + Texto) */
    justify-content: center; /* Antes tenías flex-start o flex-end */
}

.popup-img {
    width: 100%;
    height: 100%;
    
    /* CAMBIO CLAVE: Usa 'contain' para mostrar la imagen completa */
    object-fit: contain;  /* Antes decía 'cover' */
    
    object-position: center center; 
    display: block;
}


/* --- RESPONSIVE (CELULARES) --- */
@media (max-width: 768px) {
    .popup-contenido {
        height: auto; /* En celular la altura es automática */
        max-height: 90vh; /* Pero que no pase del 90% de la pantalla */
        width: 95%;
        bottom: 0;
        right: 2.5%; /* Centrado horizontalmente */
        border-radius: 15px 15px 0 0;
    }
    .popup-grid { flex-direction: column; } /* Imagen arriba */
    /* --- COLUMNA DERECHA: IMAGEN FULL --- */
    .popup-imagen-container {
        flex: 2; /* Ocupa el 40% del espacio aprox */
        
        /* 1. CORRECCIÓN CLAVE: Altura debe ser 100% */
        height: 100%; 
        padding: 0px; 
        position: relative;
        background-color: #000;
        display: flex;
        
        /* 2. SOLUCIÓN: Centrado Vertical (Eje Transversal) */
        align-items: center;  
        
        /* 3. SOLUCIÓN: Centrado Horizontal (Eje Principal) */
        justify-content: center; /* Se cambia de flex-end a center */
    }
    .popup-texto-container { 
        flex: none; 
        padding: 30px 20px; 
        text-align: center; 
    }
    .popup-titulo { font-size: 2rem; }
    .cerrar-btn { top: 10px; right: 10px; /*background: rgba(0,0,0,0.5)*/; padding: 5px 10px; border-radius: 50%; }
}