@import "https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&family=Oswald:wght@200..700&display=swap";
:root {
    --fuente-cabecera-tabla: "Oswald", sans-serif;
    --fuente-textos-tabla: "Lexend", sans-serif;
    --tamano-fuente-minimo: 0.6rem;
    --tamano-fuente-vh: 1.2vw;
    --tamano-fuente-maximo: 1.4rem;
    --color-bordes_tabla: rgba(255, 255, 255, 1);
    --color-hover_tabla: rgba(255, 255, 255, 0.3);
    --color-textos_tabla: #fff;
    --color-precio: #7eb0c7;
    --color-sponsor: rgba(186, 212, 55, 0.7);
    --color-texto_cabecera-tabla: #fff;
    --color-boton: #24222f;
    --texto-boton: #fff;
    --txt-btn-size: 1.2rem;
    --color-btn-border: #24222f;
    --color-btn-border__hover: #fff;
}
@font-face {
    font-family: "avanttextrabold";
    src:
        url("https://static.ptocdn.net/especiales/glo206_piknicelectronik-sept/font/avantt-extrabold-webfont.woff2")
            format("woff2"),
        url("https://static.ptocdn.net/especiales/glo206_piknicelectronik-sept/font/avantt-extrabold-webfont.woff")
            format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "avanttmedium";
    src:
        url("https://static.ptocdn.net/especiales/glo206_piknicelectronik-sept/font/avantt-medium-webfont.woff2")
            format("woff2"),
        url("https://static.ptocdn.net/especiales/glo206_piknicelectronik-sept/font/avantt-medium-webfont.woff")
            format("woff");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "avanttsemibold";
    src:
        url("https://static.ptocdn.net/especiales/glo206_piknicelectronik-sept/font/avantt-semibold-webfont.woff2")
            format("woff2"),
        url("https://static.ptocdn.net/especiales/glo206_piknicelectronik-sept/font/avantt-semibold-webfont.woff")
            format("woff");
    font-weight: normal;
    font-style: normal;
}
main#main {
    background: #FF9DEA;
    background: linear-gradient(191deg, rgba(255, 157, 234, 1) 0%, rgba(224, 227, 255, 1) 100%);
}
@media screen and (min-width: 1024px) {
    main#main {
        padding-bottom: 0px !important;
    }
}
.mano {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
@media screen and (min-width: 480px) {
    .mano {
        display: none !important;
    }
}
.tabla-precios-normal:not(.table-bordered) tbody tr td:first-child,
.tabla-precios-normal:not(.table-bordered) tbody tr td:last-child,
.tabla-precios-normal:not(.table-bordered) tbody tr:last-child td,
.tabla-precios-normal:not(.table-bordered) td,
.tabla-precios-normal:not(.table-bordered) th {
    border-color: var(--color-bordes_tabla) !important;
}
.tabla-precios-normal td:first-child {
    border-left: 1px solid var(--color-bordes_tabla) !important;
}
.tabla-precios-normal tr th {
    font-family: var(--fuente-cabecera-tabla);
    text-align: center;
    color: var(--color-texto_cabecera-tabla);
    border-top: 0px !important;
    background-color: rgba(0, 0, 0, 0);
    font-size: clamp(var(--tamano-fuente-minimo), var(--tamano-fuente-vh), var(--tamano-fuente-maximo));
    border-bottom: solid 1px var(--color-bordes_tabla) !important;
}
.tabla-precios-normal tr th:hover {
    background-color: rgba(0, 0, 0, 0) !important;
}
.tabla-precios-normal tr th:nth-child(1) {
    text-align: left;
}
.tabla-precios-normal tr td {
    font-size: clamp(var(--tamano-fuente-minimo), var(--tamano-fuente-vh), var(--tamano-fuente-maximo));
    color: var(--color-textos_tabla);
    font-family: var(--fuente-textos-tabla);
}
.tabla-precios-normal tr .sponsor {
    background-color: var(--color-sponsor);
}
.tabla-precios-normal tbody tr:hover {
    background-color: var(--color-hover_tabla);
}
.tabla-precios-normal tbody tr td {
    text-align: center;
}
@media screen and (min-width: 768px) {
    .tabla-precios-normal tbody tr td {
        padding: 0.7rem;
    }
}
.tabla-precios-normal tbody tr td:nth-child(1) {
    text-align: left;
    font-weight: 600;
}
.tabla-precios-normal tbody tr td:nth-child(2) {
    background-color: var(--color-precio);
    text-align: center;
    font-weight: 600;
    color: #000;
}
.tabla-precios-normal .sector .badge {
    width: 10px;
    height: 10px;
    border-radius: 0px;
    margin-right: 10px;
}
@media screen and (min-width: 1024px) {
    .tabla-precios-normal .sector .badge {
        width: 20px;
        height: 20px;
    }
}
@media screen and (min-width: 1300px) {
    .tabla-precios-normal .sector .badge {
        width: 25px;
        height: 25px;
    }
}
.tabla-precios-normal .sector p {
    margin-bottom: 0px;
    padding-bottom: 0px;
    margin-top: 2px;
    text-transform: uppercase;
    font-size: clamp(var(--tamano-fuente-minimo), var(--tamano-fuente-vh), var(--tamano-fuente-maximo));
}
.title-seo,
.tabla-seo {
    position: absolute;
    width: 0px;
    height: 0px;
    z-index: -999999999;
    top: -200vh;
    left: -200vh;
}

.section-botones {
    background-color: #7eb0c7 !important;
}
.section-botones h2 {
    text-align: center;
    color: #24222f;
}
.section-resena .cover-resena {
    background-color: rgba(0, 0, 0, 0.8);
}
.section-resena .cover-resena h3,
.section-resena .cover-resena p {
    color: #fff;
}
.section-medias .video {
    width: 100%;
    height: 315px;
}
@media screen and (min-width: 1024px) {
    .section-medias .video {
        height: 560px;
    }
}
.section-medias .produce {
    text-align: center;
    color: #fff;
}
.gomita-top {
    position: absolute;
    top: 0px;
    z-index: 2;
    right: 0px;
    margin-top: 15rem;
    margin-right: -15vh;
    max-width: 55%;
    animation: flotarYRotar 3s ease-in-out infinite;
}
@media screen and (min-width: 1024px) {
    .gomita-top {
        max-width: 40%;
        margin-top: 0rem;
    }
}

@media screen and (min-width: 1500px) {
    .gomita-top {
        max-width: 60%;
        margin-top: 0rem;
    }
}
@keyframes flotarYRotar {
    0% {
        transform: translateY(0px) rotate(0deg);
    }
    50% {
        transform: translateY(-15px) rotate(5deg);
    }
    100% {
        transform: translateY(0px) rotate(0deg);
    }
}
.titulo_web {
    font-family: "avanttextrabold";
    text-transform: uppercase;
    color:#a91d60;
    font-size: clamp(1rem, 4vw + 0.3rem, 3.5rem);
}
.parrafo {
    font-family: "avanttmedium";
    color: #a91d60;
    text-align: left;
    font-size: 1rem;
}
@media screen and (min-width: 768px) {
    .parrafo {
        font-size: 1.2rem;
    }
}
.gomita-bottom {
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 0;
    max-width: 70%;
    margin-bottom: 5rem;
    margin-left: -30vh;
    animation: flotarYRotar 3s ease-in-out infinite;
}
.gomita-bottom-right {
    position: absolute;
    bottom: 0px;
    right: 0px;
    z-index: 0;
    max-width: 70%;
    margin-bottom: 5rem;
    z-index: 0;
    margin-right: -30vh;
    animation: flotarYRotar 3s ease-in-out infinite;
}
.botones.inactive {
    pointer-events: none;
    filter: grayscale(1);
    opacity: 0.2;
}
.botones img {
    transition: all 0.4s;
}
.botones:hover img {
    transform: scale(1.05);
}
.verde-footer {
    background-color: #007531;
    text-align: center;
    padding: 2rem;
    border-radius: 15px;
}

.color-modal{
    background: #FF9DEA;
    background: linear-gradient(191deg, rgba(255, 157, 234, 1) 0%, rgba(224, 227, 255, 1) 100%);
    color: #a91d60;
}
.color-modal h4,
.color-modal a{
    font-family: "avanttextrabold";
    text-transform: uppercase;
    color: #a91d60;
    font-size: clamp(1rem, 4vw + .3rem, 3.5rem);
}
.color_texto{
    color: #ffd000;
}

.btn-tyc{
    width: 100%;
    max-width: 500px;
}

@media (max-width: 768px){
.btn-tyc{
    width: 220px; /* o el tamaño que quieras */
    max-width: 100%;
    display: block;
    margin: 0 auto;
}

#btnComunicado{
    display: inline-block;
}
}
.produce {
color: #fff;
text-align: center;
}