[v-cloak] {
    display: none;
}

:root {
    /*GRID*/
    --grid-width: 1200px !important;
    --grid-width-wide: 1500px !important;
    --grid-gutter: 20px;

    /*TEXT*/
    --text-family: 'National', sans-serif;
    --text-fsize: 20px;
    --text-lheight: 28px;

    /*BASE BUTTON*/
    --btn-padding: 15px 30px;
    --btn-fsize: 16px;
    --btn-lheight: 24px;

    /*COLORS*/
    --color-primary: #681ffc;
    --color-secondary: #06f;
    --color-alt: #285943;
    --color-white: #fff;
    --color-black: #0F0F0F;
    --color-black-alt-light: rgba(30, 30, 30, 0.9);
}

/* Cores debug */
.finish-button {
    background-color: #43A047 !important;
    border-color: #43A047 !important;
}

.red {
    background-color: red;
}

.blue {
    background-color: blue;
}

.yellow {
    background-color: yellow;
}

.purple {
    background-color: purple;
}

.orange {
    background-color: orange;
}


.c-white {
    color: var(--color-white);
}


@keyframes scaleChange {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.1;
    }
}

.g1>* {
    animation: scaleChange 2s ease 0.5s infinite;
    transform-origin: left top;
}

.g2>* {
    animation: scaleChange 2s ease 1s infinite;
    transform-origin: left bottom;
}

.g3>* {
    animation: scaleChange 2s ease infinite;
    transform-origin: left right;
}

.g4>* {
    animation: scaleChange 2s ease 1.5s infinite;
    transform-origin: left left;
}

.bg-primary {
    background: var(--color-primary) !important
}

.bg-secondary {
    background: var(--color-secondary) !important
}

.bg-color-gradient {
    background: linear-gradient(25deg, var(--color-primary) 0%, var(--color-secondary) 80%);
}

.bg-alt {
    background: var(--color-alt) !important
}

.bg-black {
    background: var(--color-black) !important
}

.bg-black-alt {
    background: var(--color-black-alt-light) !important
}

.bg-white {
    background: var(--color-white) !important
}

.bg-f2 {
    background: #eee !important
}

.text-primary {
    color: var(--color-primary) !important;
}

.text-secondary {
    color: var(--color-secondary) !important;
}

.text-alt {
    color: var(--color-alt) !important;
}

.text-black {
    color: var(--color-black) !important;
}

.text-300 {
    font-weight: 300 !important;
}

.text-normal {
    font-weight: 400 !important;
}

.pill {
    border-radius: 500px;
}

hr {
    border-color: rgba(0, 0, 0, 0.2);
}

.row {
    max-width: var(--grid-width);
    margin: auto;
}

.row.wide {
    max-width: var(--grid-width-wide)
}

.row.fullwidth {
    max-width: 100%
}

[class^="col-xs-"],
[class^="col-sm-"],
[class^="col-md-"],
[class^="col-lg-"] {
    padding-left: var(--grid-gutter);
    padding-right: var(--grid-gutter);
}

/* equivalente ao truncate */
.line2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.alert-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.card-group {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    /* max-height:475px; <-- remove */
    background-color: white;
}

/* Tds imagens que estejam dentro de caed group */
div.card-group img {
    height: 100px;
    width: 100%;
    object-fit: contain;
    border: 1px solid #ccc;
    padding: 5px;
}

.card-file-name {
    word-wrap: anywhere;
    width: 100%;
    height: 114px;
    overflow: hidden;
    display: flex;
}

/* Homepage - tese */

div.threeText > p {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;  
    overflow: hidden;
    text-overflow: ellipsis;
  }

/* Homepage Video */
#homevideo {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    filter: brightness(70%);
    /* Adjust the brightness value as needed */
}

.video-side-poster{
    height: 100vh;
    width:100%;
    object-fit:cover
}

.video-section {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

.home-video .filter {
    background: rgba(15, 15, 15, 0.6);
}

.home-video video {
    object-fit: cover;
    width: 100%;
}

/* Start - Galeria */
.stand-gal {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.stand-gal input {
    position: absolute;
    left: -9999px;
    visibility: hidden;
}

.stand-gal label,
.stand-gal div {
    width: 33.3333333333333%;
    padding: 5px;
    margin: 0;
}

.stand-gal input:checked+label {
    position: fixed;
    top: 0;
    width: 100%;
    text-align: center;
    padding: 40px;
    height: 100%;
    z-index: 99;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
}

.stand-gal input:checked+label img {
    margin: auto;
}

.stand-gal input:not(:checked)+label:hover {
    cursor: zoom-in;
}

.stand-gal input:checked+label:hover {
    cursor: zoom-out;
}

.stand-gal div iframe {
    height: 100%;
    width: 100%;
}

/* End - Galeria */


body,
a,
p,
.sub-nav dt,
.sub-nav dd,
.sub-nav li,
span,
div,
strong,
li,
ul {
    font-family: var(--text-family);
    font-size: var(--text-fsize);
    line-height: var(--text-lheight);
    color: var(--color-black);
    font-feature-settings: 'lnum' 1;
}

a {
    color: var(--color-primary);
    outline: 0;
    transition: 0.25s;
    display: inline-block;
    max-width: 100%;
    text-decoration: none !important;
    cursor: pointer;
}

a:hover,
a:focus {
    color: var(--color-secondary);
    transition: 0.25s;
}

img {
    max-width: 100%;
}

.btn.pill {
    padding: 10px 20px;
}

.btn.btn-primary {
    border: 0;
    background: var(--color-primary);
    padding: 10px 20px;
}

.btn-outline-primary {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn.btn-primary:hover,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:not(.disabled):active {
    background: #3F3F3F !important;
    border-color: var(--color-black) !important;
    box-shadow: none !important;
    color: var(--color-white) !important;
}

.btn.btn-white.pill {
    background: var(--color-white);
    color: var(--color-black);
    border-radius: 20px;
    padding: 8px 16px;
    line-height: 25px;
}

.btn.btn-white.pill:hover,
.btn.btn-white.pill:focus,
header .submenu-btn:hover>.btn.btn-white.pill {
    background: transparent;
    color: var(--color-white);
    border: 0;
    box-shadow: none;
}

.btn.btn-white.pill i {
    margin-right: 3px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-feature-settings: 'lnum' 1;
}

h2 {
    font-size: 40px;
    text-transform: uppercase;
}

h3>span.title {
    font-family: inherit;
    font-style: inherit;
    font-weight: inherit;
    font-size: 22px;
    color: inherit;
    line-height: inherit;
    display: block;
    min-height: 53px;
}


.gradient,
.bg-gradient {
    background: url('/img/2024/bg2.png');
    width: 100%;
    height: 100%;
}

.filter {
    background: rgba(15, 15, 15, 0.65);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    display: flex;
}

.cta-register {
    height: 500px;
    align-content: center;
    justify-content: center;
    background-image: linear-gradient(77deg, rgba(219, 13, 21, 0.5) 0%, rgba(102, 103, 171, 0.8) 70%), url("/img/1.png");
}

.cta-register .btn:hover {
    background-color: var(--color-black) !important;
}

.cta-register .btn:focus {
    background-color: var(--color-white) !important;
    color: var(--color-black);
}




.cta-title {
    height: 400px;
}

.cta-title h2 {
    font-size: 5rem;
}

.il-list {
    display: flex;
    flex-wrap: wrap;

}

.il-list:not(.avoid) {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.il-list>.card-round:not(:last-of-type) {
    margin-right: 15px;
}

.badge,
.badge i {
    vertical-align: middle !important;
}

.nav-tabs {
    border-bottom: 0;
}

.bg-white .nav-tabs.il-list {
    border: 0;
}

.nav-tabs.il-list>li {
    margin: auto;
    flex-grow: 1;
}

.nav-tabs.il-list+.tab-content .tab-pane {
    padding: 20px 0;
}

.nav-tabs .nav-link {
    border: 0 !important;
    border-radius: 500px;
    font-size: 22px;
    line-height: 36px;
}

.social-links a {
    font-size: 20px;
    color: var(--color-black)
}

.social-links a:not(:last-child) {
    margin-right: 5px;
}

.social-links a:hover {
    color: var(--color-secondary)
}

.modal-backdrop.show {
    opacity: .75;
}

.modal.show {
    overflow-x: hidden;
    overflow-y: auto;
}

/* ----------- HEADER -------------- */

header {
    padding: 15px 10px 10px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9;
    transition: 0.35s;
}

header.fixed {
    padding: 10px 10px;
    background: rgba(15, 15, 15, 0.8) !important;
}

#app-header {
    background: transparent;
}

#app-eventos .text-white * {
    color: var(--color-white)
}

#menuFlag:checked+header label[for="menuFlag"] i::before {
    content: "\f00d";
    padding-left: 2.8px;
    padding-right: 3px;
}

header .logo {
    display: block;
    height: 85px;
    width: 100%;
    background: url("/img/logo2023.png") no-repeat left center / contain;
    transition: 0.3s;
}

nav {
    display: flex;
    flex-wrap: wrap;
    height: 100%;
    justify-content: center;
    align-items: center;
}


nav span {
    margin-left: auto;
    margin-right: auto;
}

nav span a {
    padding-right: 0px;
}

nav a:not(.button) {
    margin-right: 30px;
    color: var(--color-white);
    position: relative;
}

nav a:not(.button)::after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    z-index: -1;
    left: 0;
    bottom: -5px;
    overflow: hidden;
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform .45s cubic-bezier(0.645, .045, .355, 1);
    background: var(--color-white);
    height: 3px;
}

nav a:not(.button):hover::after,
nav .has-submenu:hover a:not(.button)::after {
    transform: none;
    transform-origin: left center;
}

nav .submenu a:hover {
    color: var(--color-primary);
}

.has-submenu {
    position: relative;
}

.has-submenu:before {
    content: " ";
    display: block;
    height: 50px;
    position: absolute;
    top: 25px;
    width: 100%;
    left: 0;
}

.has-submenu .submenu {
    position: absolute;
    background: var(--color-black-alt-light);
    top: 66px;
    left: -20px;
    padding: 20px 20px 10px;
    min-width: 240px;
    text-align: left;
    display: none;
}

.has-submenu:hover .submenu,
.submenu:hover {
    display: block;
}

.submenu a:not(.button) {
    margin-bottom: 10px;
    margin-right: 0;
    padding: 2px;
    display: block;
}

.submenu a:not(.button)::after {
    display: none;
}



/* ----------- REGISTO -------------- */
.form-check .input-desc {
    display: none;
    margin-left: -1.25rem;
    padding-top: 10px;
}

.form-check .input-desc .alert {
    margin-bottom: 10px;
}

.form-check input:checked+label+.input-desc {
    display: block;
}

input[type="file"] {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-bottom: 10px;
}

/* ----------- FOOTER -------------- */

footer {
    background: var(--color-black);
    padding: 40px 20px 20px;
}

footer a,
footer div {
    color: var(--color-white);
    line-height: 28px;
}

.il-list.sponsor-list a {
    margin: auto;
}

.il-list.sponsor-list img {
    width: 160px;
    height: 75px;
    object-fit: contain;
    transition: 0.25s;
}

.il-list.sponsor-list a>img:hover {
    filter: grayscale(100%);
}

.desafios-list>li {
    width: 20%;
    padding: 10px;
    margin: 0 auto 20px
}

.desafios-list a {
    font-size: 22px;
    line-height: 30px;
    text-transform: uppercase;
    color: var(--color-black);
}

.desafios-list a:hover {
    color: var(--color-primary);
}

.desafios-list a img {
    filter: brightness(0) saturate(100%) invert(17%) sepia(57%) saturate(4445%) hue-rotate(202deg) brightness(86%) contrast(97%);
    margin-bottom: 10px;
    width: 60px;
}


/* ----------- HOMEPAGE -------------- */

.cta-btns {
    width: 50%;
}

.video-box {
    position: relative;
    top: 0;
    width: 100%;
    height: 100%;
}

.video-box video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: luminosity;
}

.video-box .filter .cta {
    margin: auto;
}

.video-box .cta h2,
h2.cta {
    color: var(--color-white);
    font-size: 40px;
    padding: 20px 10px;
    border-top: 3px solid var(--color-white);
    border-bottom: 3px solid var(--color-white);
    text-transform: uppercase;
    margin-bottom: 20px;
}

.video-box .cta h2>span.titulo {
    font-size: inherit;
    color: inherit;
    line-height: inherit;
}

.video-box .cta h2+.btn,
.btn.cta {
    color: var(--color-white);
    border: 3px solid var(--color-white);
    border-top-color: transparent;
    border-bottom-color: transparent;
    float: right;
    font-size: 25px;
    padding: 10px 20px;
    text-transform: uppercase;
}

.video-box .cta h2+.btn:hover,
.btn.cta:hover {
    color: var(--color-white);
    border: 3px solid transparent;
    border-top-color: var(--color-white);
    border-bottom-color: var(--color-white);
}

h2.cta.text-black {
    color: var(--color-black);
    border-color: var(--color-black);
}

h2.cta.text-ib>small {
    font-size: 0.5em;
}

.btn.cta {
    float: none
}


.bg-dark-block {
    padding: 60px 20px;
}

.bg-dark-block .nav-tabs.il-list .nav-link:not(.active):hover,
.bg-dark-block .nav-tabs.il-list .nav-link:not(.active) {
    color: var(--color-white)
}

.bg-dark-block .nav-tabs.il-list+.tab-content i {
    font-size: 12px;
    vertical-align: top;
    line-height: 22px;
}

.bg-dark-block .nav-tabs.il-list+.tab-content hr {
    border-color: var(--color-white);
}

.bg-white .nav-tabs.il-list .nav-link:not(.active) {
    color: var(--color-black);
}

.bg-white .nav-tabs.il-list .nav-link:not(.active):hover {
    color: var(--color-secondary);
}

.bg-white .nav-tabs.il-list .nav-link.active {
    color: var(--color-primary);
}

.tab-content h5>a {
    font-size: inherit;
    color: inherit;
}

.tab-content h5>a:hover {
    color: var(--color-primary)
}

/* ----------- SOBRE -------------- */
.card-white p {
    color: var(--color-white);
    margin-bottom: 0px;
}

.bg-gradient.card {
    border: 0;
    padding: 20px 15px;
}

.bg-gradient.card p {
    color: var(--color-white)
}

.bg-gradient.card .title {
    font-size: 30.5px;
    line-height: 36px;
}

.bg-gradient.card .number {
    font-size: 52px;
    line-height: 64px;
    display: block;
    font-weight: 700;
    color: #fff;
}

.bg-gradient.card .icon {
    filter: brightness(0) saturate(100%) invert(100%) sepia(3%) saturate(0%) hue-rotate(218deg) brightness(105%) contrast(103%);
    height: 75px;
    position: absolute;
    right: 12px;
    bottom: 12px;
}

/* ---------------- BOLSA ------------------------ */

/* Vue Stepper Wizard */
.wizard-tab-content {
    background-color: white;
    margin: 21px 0px 10px;
}

.wizard-card-footer.clearfix {
    padding: 0px;
}

.wizard-prev-button {
    color: var(--color-secondary) !important;
    background-color: transparent !important;
}

.spinner-border {
    color: var(--color-white);
}

.swot ::placeholder {
    color: white !important;
}

@keyframes moveToTop {
    from {
        bottom: -160px;
    }

    to {
        bottom: -22px;
    }
}

@keyframes moveToBottom {
    from {
        bottom: -22px;
    }

    to {
        bottom: -160px;
    }
}

.bot {
    display: none;
    position: fixed;
    bottom: -22px;
    right: -32px;
    z-index: 14;
    height: 181px;
}

.message-bot {
    display: none;
    position: fixed;
    white-space: break-spaces;
    bottom: 35px;
    right: 150px;
    z-index: 14;
    background-color: #353849;
    max-width: 50%;
    font-size: large;
}

@media only screen and (max-width: 40.063em) {
    .bot {
        display: none !important;
    }

    .message-bot {
        display: none !important;
    }

    .video-side-poster{
        height: auto;
        width:100%;
        object-fit:initial
    }
}

/* END vue stepper wizard */

.row-full {
    width: 100vw;
    position: relative;
    margin-left: -50vw;
    left: 50%;
}

.img-cut img {
    width: 100%;
    height: 475px;
    object-fit: cover;
    mix-blend-mode: luminosity;
    transition: 0.25s;
}

.row:hover .img-cut img {
    mix-blend-mode: initial;
}

.order-lg-2>.img-cut:before {
    width: 0;
    height: 0;
    content: " ";
    border-top: 475px solid #fff;
    border-right: 125px solid transparent;
    position: absolute;
    left: 0;
    z-index: 1;
}

div:not(.order-lg-2)>.img-cut:after {
    width: 0;
    height: 0;
    content: " ";
    border-bottom: 475px solid #fff;
    border-left: 125px solid transparent;
    position: absolute;
    right: 0;
    z-index: 1;
}

/* ------- STANDS --------- */
.il-list-5 li {
    width: calc(20% - 20px);
    margin: 10px;
}

/* ----------- QUERO PARTICIPAR -------------- */

table.comparativo td {
    vertical-align: top;
    padding: 10px;
}

/* ----------- ORADORES -------------- */

.il-list.compact li {
    margin: auto 40px;
}

.round-image-container {
    width: 300px;
    height: 300px;
    border-radius: 50%;
    overflow: hidden;
}

.round-image-container img {
    width: 305px;
    height: 300px;
    object-fit: cover;
    object-position: top center;
}

.orador-container:hover {
    cursor: pointer;
    background-color: var(--color-white);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

.stand-container:hover {
    color: var(--color-black);
    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

.profile-card {
    padding: 20px 30px;
    margin-bottom: 40px;
    background: var(--color-white);
    position: relative;
    z-index: 1;
    border-radius: 8px;
}

.profile-card:before {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    content: " ";
    background: linear-gradient(77deg, var(--color-secondary) 0%, var(--color-primary) 70%);
    z-index: -1;
    transition: ease-in-out 0.6s;
    opacity: 0;
    border-radius: 8px;
}

.profile-card:not(.noBio):hover:before {
    opacity: 1;
}

.profile-card-name-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 63px;
    max-width: 270px;
}

.profile-card img {
    mix-blend-mode: overlay;
}

.profile-card .gradient,
.profile-card .title-hover a {
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
}

.profile-card h4,
.profile-card p,
.profile-card a {
    transition: 0.25s;
}

.profile-card:not(.noBio):hover h4,
.profile-card:not(.noBio):hover p,
.profile-card:not(.noBio):hover a {
    color: var(--color-white)
}

.profile-card:not(.noBio):hover img {
    opacity: 0;
}

.profile-card:not(.noBio):hover .gradient {
    background: transparent;
    border-color: var(--color-white);
    position: relative;
}

.profile-card .gradient:before {
    content: attr(title);
    font-size: 28px;
    text-transform: uppercase;
    font-weight: 700;
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    top: 0;
    left: 0;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: 0.35s;
}

.profile-card:not(.noBio):hover .gradient:before {
    opacity: 1;
    color: var(--color-white);
}

.profile-card:not(.noBio):hover .title-hover a {
    border-top: 3px solid var(--color-white);
    border-bottom: 3px solid var(--color-white);
}

.profile-card:not(.noBio):hover .title-hover:before {
    content: attr(title);
    font-size: 28px;
    text-transform: uppercase;
    font-weight: 700;
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    top: 0;
    left: 0;
    align-items: center;
    justify-content: center;
    opacity: 1;
    color: var(--color-white);
}

.card-opacity {
    transition: 0.35s;
}

.card-opacity:hover {
    opacity: 0.7;
}


.card-round {
    background: var(--color-white);
    border-radius: 8px;
    border: 1px solid #d5d5d5;
    padding: 25px;
    transition: box-shadow 400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    margin-bottom: 20px;
    font-size: 16px;
}

.card-round:hover {
    border: 1px solid #eee;
    box-shadow: 0 2px 10px 0 #d5d5d5;
}

.card-round h3 {
    margin-bottom: 30px;
    font-weight: 700;
    font-size: 1.6em;
}

.card-round .badge-nav {
    margin-bottom: 15px;
    font-size: 14px;
}

.card-round .badge-nav span:not(:last-of-type) {
    margin-right: 10px;
}

.card-round .badge-nav span:not(.badge) {
    opacity: 0.65;
    vertical-align: middle;
    font-size: 0.9em;
}

.card-round .badge-nav i {
    vertical-align: middle !important;
    font-size: 1em !important;
    margin-right: 2.5px;
}


.badge-speaker {
    display: flex;
    align-items: baseline;
}

.badge-speaker div {
    display: flex;
    flex-direction: row;
}

.badge-speaker div {
    margin-bottom: 10px;
    width: 100%;
}

.badge-speaker div:not(:last-of-type) {
    margin-right: 25px;
}

.badge-speaker img {
    aspect-ratio: 1/1;
    width: 65px;
    object-fit: cover;
    border-radius: 50%;
    margin: auto 10px auto auto;
}

.badge-speaker span {
    margin: auto;
}

.badge-speaker span,
.badge-speaker strong {
    font-size: 0.7rem;
    line-height: 1.2;
}



/* ---------- RESPONSIVE MENU ----------- */
#menuFlag {
    position: absolute;
    top: -9999px;
    left: -9999px;
}

#menuFlag:not(:checked)+header div.mobile-menu {
    display: none;
}

#menuFlag:checked+header div.mobile-menu {
    margin-top: 20px;
    z-index: 9;
    min-height: calc(100vh - 100px);
}

#menuFlag:checked+header div.mobile-menu nav {
    height: calc(100vh - 200px);
    overflow-y: auto;
}

label[for="menuFlag"] {
    vertical-align: top;
    font-size: 32px;
    margin-top: 30px;
    cursor: pointer;
}

.hover-block {
    background: var(--color-white);
    display: inline-block;
    transition: 0.25s;
    cursor: pointer;
}

.hover-block:hover {
    background: var(--color-primary)
}

.hover-block:hover,
.hover-block:hover>* {
    color: var(--color-white) !important
}

#app-marcacoes-ver {
    min-height: 52.5vh;
}

[data-animation] {
    transition-property: opacity;
    transition-duration: 0.8s;
    opacity: 0;
}

[data-animation].animated {
    opacity: 1;
}


.video-background {
    height: 100vh;
    overflow: hidden;
    padding: 0;
    position: relative;
}

.video-background iframe {
    box-sizing: border-box;
    height: 56.25vw;
    left: 50%;
    min-height: 100%;
    min-width: 100%;
    transform: translate(-50%, -50%);
    position: absolute;
    top: 50%;
    width: 177.77777778vh;
}

.mosaico {
    column-count: 2;
    column-gap: 10px;
    width: 100%;
}

.text-mosaico {
    position: absolute;
    bottom: 11px;
    padding: 10px 10px;
    color: var(--color-white);
    background-color: var(--color-primary);
    font-size: 30px;
    z-index: 9999;
    left: 12px;
}

.tm-alt {
    background: var(--color-secondary);
}


.cta-bilhete h2,
.cta-bilhete p {
    color: var(--color-white);
}

.cta-bilhete h2 {
    font-size: 60px;
}

.cta-bilhete p {
    font-size: 26px;
    line-height: 32px;
}

.cta-bilhete .button {
    border: 2px solid var(--color-white);
    font-size: 26px;
    color: var(--color-white);
    padding: 15px 30px;
    margin-top: 20px;
}

.cta-bilhete .button:hover {
    background: var(--color-white);
    color: var(--color-black);
}

/* COUNTDOWN */
.countdown-container {
    display: flex;
    justify-content: space-evenly;
    border-radius: 8px;
    background: linear-gradient(-45deg, #FAFAFAD6 2%, #0096FF8A 15%, #7CB0F673 20%, #4D33FDC9 45%, #8078F280 70%, #9B5DFFD6 82.5%, #D3B6F8D6 95% );
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
    box-shadow: 0px 4px 3px rgba(0, 0, 0, 0.4), 0px 8px 13px rgba(0, 0, 0, 0.233),
        0px 18px 23px rgba(0, 0, 0, 0.295);
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.cd-number {
    font-size: 5rem;
    font-weight: bolder;
    text-align: center;
    color: #def7e0;
    text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.4), 0px 8px 13px rgba(0, 0, 0, 0.233),
        0px 18px 23px rgba(0, 0, 0, 0.295);
}

.cd-text {
    font-size: 1.3rem;
    font-weight: lighter;
    padding: 50px;
    text-align: center;
    color: #ffffff;
    text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.4), 0px 8px 13px rgba(0, 0, 0, 0.233),
        0px 18px 23px rgba(0, 0, 0, 0.295);
}

/* NOVO BOTAO */
.btn-off-frame {
    position: relative;
    padding: 1rem 2rem 0.5rem 2.5rem;
    color: #fff;
    border: 3px solid #9326a8;
    -webkit-transition: padding 0.3s ease-in-out;
    transition: padding 0.3s ease-in-out;
}

.btn-off-frame:before {
    content: "";
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
    z-index: -1;
    height: 100%;
    width: 100%;
    background-color: #3463cd;
    border-right: 3px solid #3463cd;
    border-bottom: 3px solid #3463cd;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.btn-off-frame:hover {
    padding: 0.75rem 2.25rem;
    color: #fff;
}

.btn-off-frame:focus {
    color: #fff;
}

.btn-off-frame:hover:before {
    top: 0;
    left: 0;
}

/* Contadores Data */
.data {
    width: 100%;
    height: 100%;
}

.data-header {
    text-align: center;
}

.data-list {
    width: 80%;
    height: 280vmin;
    margin: auto;
    position: relative;
}

.data-item {
    position: absolute;
    display: flex;
    flex-direction: column;
}

.data-item:nth-child(1) {
    top: 0;
    left: 0;
}

.data-item:nth-child(2) {
    top: 33%;
    left: 33%;
    transform: translate(-33%, -33%);
}

.data-item:nth-child(3) {
    top: 66%;
    left: 66%;
    transform: translate(-66%, -66%);
}

.data-item:nth-child(4) {
    bottom: 0;
    right: 0;
}

.data-item:nth-child(5) {
    bottom: 0;
    right: 0;
}

.data-item span:nth-child(1) {
    font-size: 2rem;
    text-transform: uppercase;
    letter-spacing: 0.2rem;
    color: #000;
}

.data-item span:nth-child(2) {
    font-size: 20rem;
    color: #3463cd;
    line-height: 1;
}

/* End of Data */
.clip-img {
    clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%);
}

.tagcloudcustom {
    position: relative !important;
    height: 700px !important;
    width: 100% !important;
    z-index: 0 !important;
}

/* splide js */
.my-slider-progress {
    background: #ccc;
}

.my-slider-progress-bar {
    background: greenyellow;
    height: 2px;
    transition: width 400ms ease;
    width: 0;
}

/* ja existem no style.css, preciso substituir */
.cta-register {
    height: 500px;
    width: 100%;
    align-content: center;
    justify-content: center;
    background: linear-gradient(77deg, #FAFAFAD6 2%, #0096FF8A 15%, #7CB0F673 20%, #4D33FDC9 45%, #8078F280 70%, #9B5DFFD6 82.5%, #D3B6F8D6 95% ),url(/img/2024/bg2.png) no-repeat center center / cover;
    clip-path: polygon(0 0, 0 100%, 30% 90%, 70% 90%, 100% 100%, 100% 0);
}

.clock-item .inner {
    height: 0px;
    padding-bottom: 100%;
    position: relative;
    width: 100%;
}

.clock-canvas {
    background-color: cornsilk;
    border-radius: 50%;
    height: 0px;
    padding-bottom: 45%
}

.text {
    color: #fff;
    font-size: 30px;
    font-weight: bold;
    margin-top: -50px;
    position: absolute;
    top: 92px;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
    margin-left: 38px;
}

.text .val {
    font-size: 30px;
}

.text .type-time {
    font-size: 20px;
}

.cta-dias {
    font-size: 50px;
    line-height: 60px;
}

.cta-mes {
    font-size: 50px;
    line-height: 60px;
    letter-spacing: 2px;
}

.cta-dias, .cta-mes {
    position: relative;
    outline: 1.5px solid #fff;
    transform: skew(-10deg);
}

.cta-mes:after, 
.cta-dias:after {
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    position: absolute;
    background: inherit;
    filter: blur(20px);
    z-index: -1;
    left: 0;
}

.cta-ts {
    min-height: 400px;
    display: flex;
    align-items: center;
    padding: 3rem 1rem;
}

.cta-ts p {
    color: var(--color-white);
}

.cta-oradores h2.cta {
    color: var(--color-black);
    border-top: 3px solid var(--color-black);
    border-bottom: 3px solid var(--color-black);
}

.ctaBtnsMobile {
    margin-top: 100px !important;
}

.countdown-banner{
    border-top-right-radius:40px;border-bottom-right-radius:40px;margin-right:-30px
}

@media (min-width: 768px) and (max-width: 991px) {
    .clock-item {
        margin-bottom: 30px;
        display: flex;
        justify-content: center;
    }
}

@media (max-width: 767px) {
    .clock-item {
        margin: 0px 20px 30px;
        display: flex;
        justify-content: center;
    }
}

@media only screen and (max-width: 40em) {

    #homevideo{
        height:250px !important;width:100%;object-fit:cover
    }

    .countdown-container{flex-wrap: wrap;}

    .countdown-banner{
        margin-bottom: 20px;
        border-radius: 20px;
        margin-right:0
    }

    :root {
        --text-fsize: 16px;
    }

    label[for="menuFlag"] {
        margin: auto auto auto 0;
    }

    .logobox {
        display: flex;
    }

    .logobox .logo {
        width: 100%;
        height: 70px;
    }

    #menuFlag:checked+header {
        height: 100vh;
    }

    .mobile-menu {
        overflow: auto;
        max-height: 80vh;
    }

    .badge-speaker {
        flex-direction: column;
    }

    .expandSubmenu>span {
        position: relative;
        cursor: pointer;
    }

    .expandSubmenu>span::after {
        content: "\f107";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        color: var(--color-white);
        position: absolute;
        right: 0;
    }

    .expandSubmenu>span.active::after {
        content: "\f106";
    }

    .expandSubmenu>span:not(.active)+div {
        display: none;
    }

    .cta-title {
        height: 300px;
    }

    .cta-title h2 {
        font-size: 2.5rem;
        padding: 0 10px;
    }

    .clock {
        flex-wrap: nowrap;
    }

    .clock-item .wrap {
        transform: scale(0.58);
    }

    .cta-dias {
        font-size: 30px;
        line-height: 46px
    }

    .cta-mes {
        font-size: 30px;
        line-height: 46px;
        letter-spacing: 2px
    }

    .cta-btns {
        width: 100%;
    }

    .cta-btns .btn.pill {
        font-size: 1.2rem;
    }

    .card-round {
        font-size: 14px;
    }

    .desafios-list>li {
        width: 100%
    }

    .video-box .cta {
        padding: 0 20px;
    }

    .col-xs-w100 {
        min-width: 100%
    }

    .text-xs-center {
        text-align: center !important
    }

    .tiny {
        line-height: 10px;
    }

    .video-box,
    .video-box .gradient {
        height: 100vh;
    }

    .video-box .cta h2>span.titulo {
        display: none;
    }

    .video-box .cta h2>span#proxevent {
        display: block;
        margin: 20px 0 10px;
    }

    .video-box .cta h2>span#proxevent+br {
        display: none;
    }

    #oradorModal img {
        height: auto !important;
        object-fit: initial !important;
    }

    .sponsor-list li {
        width: 100%
    }

    .mosaico {
        column-count: 1;
        column-gap: 10px;
        width: 100%;
    }

    .mosaico .mosaico-img {
        max-height: 400px;
    }

    .text-mosaico {
        font-size: 18px;
        left: 10px;
        right: auto;
    }

    .mosaic.slick-slider img {
        max-width: 100vh;
        width: 100vh;
        height: 350px;
        object-fit: contain;
    }

    footer {
        padding: 20px 0 20px;
    }

}


@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .sponsor-list li {
        width: 33.3333%
    }
}

@media only screen and (max-width: 64em) {
    header .logo {
        width: 85%;
        display: inline-block;
    }

    header {
        background: rgba(15, 15, 15, 0.8) !important;
    }

    header .logo {
        display: block;
        height: 85px;
        width: 100%;
        background: url("/img/logo2023.png") no-repeat center center / contain;
        transition: 0.3s;
    }

    nav span {
        display: block;
        width: 100%;
    }

    nav {
        padding: 10px 20px;
        display: block;
    }

    nav a {
        font-size: 20px;
        line-height: 28px;
    }

    nav span {
        margin: 20px auto;
        position: relative;
    }

}

/* Smartphones  */
@media (min-width: 320px) and (max-width: 1024px) {

    /* Disable horizontal scroll */
    html, body {
        overflow-x: hidden;
    }

    body {
        position: relative
    }

    /* Tags Mobile */
    .tagcloudcustom {
        position: relative !important;
        height: 700px !important;
        width: 30% !important;
        z-index: 0 !important;
    }

    div.whots {
        padding-bottom: 140px;
    }

    

    .challange-mobile{
        margin-bottom: 30px;
    }

    .progMobile {
        margin-top: -29px !important;
    }

    .ctaBtnsMobile {
        margin-top: 50px !important;
    }

    .nomgmobile {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    .cta-padd {
        padding-top: 25px;
        padding-bottom: 100px;
    }

    /* Impacto Mobile */
    .data-item {
        position: absolute;
        display: flex;
        flex-direction: column;
    }
    
    .data-item:nth-child(1) {
        top: 0;
        left: 0;
    }
    
    .data-item:nth-child(2) {
        top: 25%;
        left: 25%;
        transform: translate(-25%, -25%);
    }
    
    .data-item:nth-child(3) {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    
    .data-item:nth-child(4) {
        top: 75%;
        left: 75%;
        transform: translate(-75%, -75%);
    }
    
    .data-item:nth-child(5) {
        bottom: 0;
        right: 0;
    }
    
    .data-item span:nth-child(1) {
        font-size: 1rem;
        text-transform: uppercase;
        letter-spacing: 0.2rem;
        color: #000;
    }
    
    .data-item span:nth-child(2) {
        font-size: 10rem;
        color: #3463cd;
        line-height: 1;
    }
}

@media only screen and (min-width: 64.063em) {}