.cartao {
    perspective: 1000px;
}

.deck_viewer_menu {
    background: none;
    border: none;
}

.text-9xl {
    font-size: 14rem;
}

div[class^='star-ratings-rating-']:not(div[class='star-ratings-rating-stars-container']) {
    display: none;
}

.comfortaa-text {
  font-family: "Comfortaa", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-size: 1.2em;
  font-style: normal;
}

.deck_viewer_menu::after {
    display: none !important;
}

.container_user_collections_list {
    display: none;
    box-shadow: #c5c7c8 2px 1px 8px;
    background: linear-gradient(141deg,rgba(250, 250, 250, 1) 0%, rgba(240, 240, 240, 1) 80%, rgba(220, 220, 220, 1) 100%);
}

.alternativas_cards {
  counter-reset: list;
  padding-left: 0;
}

.sn-notify-autoclose:before {
    display: none !important;
}

.alternativas_cards > li {
  list-style: none !important;
}

.alternativas_cards > li:before {
  content: counter(list, lower-alpha) ") ";
  counter-increment: list;
}

.opcao {
    padding: 0.2em 0.2em 0.2em 0.4em;
    margin-top: 0.2em;
    cursor: pointer;
}

.opcao.resposta_incorreta {
    position: relative;
    border: 2px solid red !important;
    border-radius: 1rem;
    background-color: rgba(255, 0, 0, 0.2);
}

.opcao.resposta_selecionada {
    border: 2px solid #02cc02;
    border-radius: 1rem;
}

.opcao_colecoes:hover .container_user_collections_list {
    display: block;
}

.star-ratings {
    margin-top: 0.8em;
}

.body {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flipped .body {
    transform: rotateY(180deg);
}


.swiper-slide-active .cartao {
    position: relative;
    width: 100%;
    height: 100%;
}

.cartao .verso {
    transform: rotateY(-180deg);
}

.cartao .frente,
.cartao .verso {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: white;
}

.resposta_correta {
    position: relative;
    border-bottom: 1px solid green;
    background-color: rgba(0, 255, 0, 0.2);
}


.resposta_correta_nao_selecionada {
    border: 2px solid #9ac1e3;
    border-radius: 1rem;
}

.checkbox-wrapper-33 {
    --s-xsmall: 0.625em;
    --s-small: 1.2em;
    --border-width: 1px;
    --c-primary: #5F11E8;
    --c-primary-20-percent-opacity: rgb(95 17 232 / 20%);
    --c-primary-10-percent-opacity: rgb(95 17 232 / 10%);
    --t-base: 0.4s;
    --t-fast: 0.2s;
    --e-in: ease-in;
    --e-out: cubic-bezier(.11, .29, .18, .98);
}

.checkbox-wrapper-33 .visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.checkbox-wrapper-33 .checkbox {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
}

.checkbox-wrapper-33 .checkbox+.checkbox {
    margin-top: var(--s-small);
}

.botao_salvar_user_collections_list {
    background: linear-gradient(145deg,rgba(42, 155, 65, 1) 0%, rgba(72, 175, 95, 1) 50%, rgba(42, 155, 65, 1) 100%);
}

.checkbox-wrapper-33 .checkbox__symbol {
    display: inline-block;
    display: flex;
    border: var(--border-width) solid var(--c-primary);
    right: 0;
    border-radius: 50%;
    border-color: var(--c-primary);
    width: 1.3em;
    height: 0.9em;
    transition: box-shadow var(--t-base) var(--e-out), background-color var(--t-base);
    box-shadow: 0 0 0 0 var(--c-primary-10-percent-opacity);
}

.checkbox-wrapper-33 .checkbox__symbol:after {
    content: "";
    position: absolute;
    top: 0.5em;
    left: 0.5em;
    width: 0.25em;
    height: 0.25em;
    background-color: var(--c-primary-20-percent-opacity);
    opacity: 0;
    border-radius: 3em;
    transform: scale(1);
    transform-origin: 50% 50%;
}

.checkbox-wrapper-33 .checkbox .icon-checkbox {
    width: 0.6em;
    height: 0.6em;
    margin: auto;
    fill: none;
    stroke-width: 3;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-miterlimit: 10;
    /* color: var(--c-primary); */
    color: white;
    display: inline-block;
}

.checkbox-wrapper-33 .checkbox .icon-checkbox path {
    transition: stroke-dashoffset var(--t-fast) var(--e-in);
    stroke-dasharray: 30px, 31px;
    stroke-dashoffset: 31px;
}

.checkbox-wrapper-33 .checkbox__trigger:checked+.checkbox__symbol {
    background-color: var(--c-primary);
}

.checkbox-wrapper-33 .checkbox__trigger:checked+.checkbox__symbol:after {
    -webkit-animation: ripple-33 1.5s var(--e-out);
    animation: ripple-33 1.5s var(--e-out);
}

.checkbox-wrapper-33 .checkbox__trigger:checked+.checkbox__symbol .icon-checkbox path {
    transition: stroke-dashoffset var(--t-base) var(--e-out);
    stroke-dashoffset: 0px;
}

.checkbox-wrapper-33 .checkbox__trigger:focus+.checkbox__symbol {
    box-shadow: 0 0 0 0.25em var(--c-primary-20-percent-opacity);
}


.deck_viewer .label_star [type="checkbox"] {
	appearance: none;
}

.deck_viewer .label_star i {
	font-size: 1.2em;
	transition: 0.3s;
    color: gray;
}

.deck_viewer .label_star:hover i {
	transform: scale(1.35);
	color: #fffdba;
	animation: jump 0.5s calc(0.3s + (var(--i) - 1) * 0.15s) alternate infinite;
}
.deck_viewer .label_star input[type="checkbox"]:checked ~ i {
	color: #faec1b;
}

@media(min-width: 900px) {
    .deck_overlay {
        padding-bottom: 10%;
    }
}

@media(max-width: 645px) {
    .text-9xl {
        font-size: 5.75rem;
    }

    .text-6xl {
        font-size: 1.75rem;
    }

    .text-2xl {
        font-size: 1rem;
        line-height: 1.2rem;
    }

    .py-8 {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .px-6 {
        padding-left: 1.2rem;
        padding-right: 1.2rem;
    }

    .mr-6 {
        margin-right: 0.5rem;
    }

    .px-12 {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@keyframes jump {
	0%,
	50% {
		transform: translatey(0) scale(1.35);
	}
	100% {
		transform: translatey(-15%) scale(1.35);
	}
}

@-webkit-keyframes ripple-33 {
    from {
        transform: scale(0);
        opacity: 1;
    }

    to {
        opacity: 0;
        transform: scale(20);
    }
}

@keyframes ripple-33 {
    from {
        transform: scale(0);
        opacity: 1;
    }

    to {
        opacity: 0;
        transform: scale(20);
    }
}