/* ==================== CUSTOMIZAÇÃO GERAL ====================*/
:root {
	--bg-card-link: #f2f2f2;
	--milionaria: #2e3078;
	--megasena: #209869;
	--lotofacil: #930a89;
	--quina: #260885;
	--lotomania: #f78101;
	--timemania: #36b036;
	--duplasena: #a61324;
	--federal: #103099;
	--loteca: #fb1e02;
	--dia-sorte: #cb852b;
	--super-sete: #a8d045;
	--telesena: #0092df;

	--cor1: #2e3078;
	--cor2: #209869;
	--cor3: #930a89;
	--cor4: #260885;
	--cor5: #f78101;
	--cor6: #36b036;
	--cor7: #a61324;
	--cor8: #103099;
	--cor9: #fb1e02;
	--cor10: #cb852b;
	--cor11: #a8d045;
	--cor12: #0092df;
}

*{
    font-family: 'Roboto Condensed' !important;
}
.col-610{
	max-width: 610px;
	margin: auto;
}
article p {
    color: #fff;
}
.titulo-interna{
    text-align: center;
    font-size: 72px;
    font-weight: bolder;
    color: #1B406D;
}

.container-carrossel{
    margin: 50px 0;
    text-align: center;
}

.loteria-carousel .owl-item {
	background-color: var(
		--bg-card-link
	);
	width: 85px!important;
	border-radius: 10px;

}
.loteria-carousel .links-loteria {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 85px;
	border-radius: 10px;
	transition: .2s;
	font-size: 14px;
	font-weight: bold;

}
.loteria-carousel .links-loteria img{
	width: initial;
}

.types-loteria .item .icone-branco{
	display: none;
}
.loteria-carousel .links-loteria:hover img{
	display: none;
}
.loteria-carousel .links-loteria:hover .icone-branco{
	display: block;
}
.tele-sena:hover:hover img{
	display: block;
}

/*=========== CARROSSEL LOTERIA ================ */
.card-loteria {
	max-width: 610px;
	color: #fff;
	background-color: #f2f2f2;
	padding-bottom: 20px;
	border-radius: 12px 12px 10px 10px;
    margin: auto;
	height: 100%;
}
.name-date-loteria {
	height: 80px;
	border-radius: 10px;
	text-align: center;
	margin-bottom: 20px;
    padding: 10px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.name-loteria {
	font-size: 20px;
	font-weight: bold;
    margin: 0;
}
.date-loteria {
    font-size: 14px;
    height: 17px;
    margin: 0;
}
.numbers-loteria {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 15px 7px;
	margin: 0;
	padding: 0 19px;
}
.numbers-loteria span {
	padding: 0px 0.37rem;
    border-radius: 15px;
    font-weight: bold;
    font-size: 18px;
    line-height: 30px;
}
.card-loteria .result-loteria, .timemania-local {
	color: #1a1818;
	text-transform: uppercase;
	text-align: center;
	font-size: 14px;
	margin: 15px 0 0;
}

.btn-loteria-prev-next{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    width: 30px;
    border-radius: 15px;
    border: none;
    outline: none !important;
}
.btn-loteria-prev-next.prev{
    transform: rotate(180deg);
}
.btn-loteria-prev-next:hover svg path{
    fill: #fff;
}
.sorteio-details, .sorteio-details-mega{
    padding: 20px 20px 0;
    text-align: center;
	gap: 19px;
    display: flex;
    justify-content: center;
	flex-wrap: wrap;
}
.sorteio-details p, .detail-telesena{
    font-size: 14px;
    height: auto;
    margin: 0 0 10px;
	line-height: inherit;
}

.sorteio-details .details-acertos{
    width: 80px;
}
.sorteio-details .details-ganhadores{
    width: 70px;
}
.sorteio-details .details-premio{
    width: 95px;
}
.sorteio-details .detail{
    color: #666;
}
.sorteio-details .detail-resp{
    color: #1a1818;
}

/*======== FAQ DE INDEXAÇÃO ========*/
.faq-indexacao{
	max-width: 300px;
	margin-top: 50px;
}
.container-question{
	margin-bottom: 20px;
}
.faq-indexacao .title-faq{
	font-size: 18px;
	color: #999999;
	font-weight: bold;
	margin: 0 0 15px;
}
.faq-indexacao .subtitle-indexacao, .faq-indexacao .txt-indexacao{
	font-size: 14px;
	color: #999999;
	font-weight: bold;
	line-height: 18px;
	margin: 0;
}
.faq-indexacao .txt-indexacao{
	font-weight: normal;
	margin-bottom: 20px;
	color: #666;
}
.faq-indexacao .txt-indexacao span{
	display: block;
}
.milionaria.active img, .mega-sena.active img, .lotofacil.active img, .quina.active img,
.lotomania.active img, .timemania.active img, .dupla-sena.active img, .federal.active img,
.loteca.active img, .dia-sorte.active img, .super-sete.active img, .telesena.active img{
	display: none;
}
.milionaria.active .icone-branco, .mega-sena.active .icone-branco, .lotofacil.active .icone-branco,
.quina.active .icone-branco, .lotomania.active .icone-branco, .timemania.active .icone-branco,
.dupla-sena.active .icone-branco, .federal.active .icone-branco, .loteca.active .icone-branco,
.dia-sorte.active .icone-branco, .super-sete.active .icone-branco, .telesena .icone-branco{
	display: block;
}
.btn-loteria-prev-next:hover {
    cursor: pointer;
    border: 2px solid #fff;
}
.numbers-loteria {
	margin-bottom: 10px;
}
/* ==================== /CUSTOMIZAÇÃO GERAL ====================*/

/*============= LOTERIA +MILIONARIA =============*/
.milionaria {
	color: var(--milionaria);
}
.milionaria:hover {
	color: #fff;
	background-color: var(--milionaria);
}
.milionaria.active{
	background-color: var(--milionaria);
	color: #fff;
}
.card-milionaria {
	border: 1px solid var(--milionaria);
}
.card-milionaria .name-date-loteria {
	background-color: var(--milionaria);
}
.card-milionaria .numbers-loteria span {
	background-color: var(--milionaria);
}
.trevos-loteria {
	display: flex;
	justify-content: center;
	gap: 7px;
	margin: 0;
	font-size: 16px;
}
.trevos-loteria span {
	background: url(../../img/loterias/trevo.webp)
		no-repeat;
	background-size: cover;
	height: 30px;
	width: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--milionaria);
	font-weight: bold;
}
.card-milionaria .btn-loteria-prev-next:hover{
    background-color: var(--milionaria);
}
.faq-milionaria .title-faq, .faq-milionaria .subtitle-indexacao{
	color: var(--milionaria);
}
/*============= LOTERIA +MILIONARIA =============*/

/*============= LOTERIA MEGASENA =============*/
.mega-sena {
	color: var(--megasena);
}
.mega-sena:hover {
	color: #fff;
	background-color: var(--megasena);
}
.mega-sena.active{
	background-color: var(--megasena);
	color: #fff;
}
.card-mega-sena {
	border: 1px solid var(--megasena);
}
.card-mega-sena .name-date-loteria {
	background-color: var(--megasena);
}
.card-mega-sena .numbers-loteria span {
	background-color: var(--megasena);
}
.card-mega-sena .btn-loteria-prev-next:hover{
    background-color: var(--megasena);
}
.faq-mega-sena .title-faq, .faq-mega-sena .subtitle-indexacao{
	color: var(--megasena);
}
/*============= /LOTERIA MEGASENA =============*/

/*============= LOTERIA LOTOFACIL =============*/
.lotofacil {
	color: var(--lotofacil);
}
.lotofacil:hover {
	color: #fff;
	background-color: var(--lotofacil);
}
.lotofacil.active{
	background-color: var(--lotofacil);
	color: #fff;
}
.card-lotofacil {
	border: 1px solid var(--lotofacil);
}
.card-lotofacil .name-date-loteria {
	background-color: var(--lotofacil);
}
.card-lotofacil .numbers-loteria span {
	background-color: var(--lotofacil);
}
.card-lotofacil .btn-loteria-prev-next:hover{
    background-color: var(--lotofacil);
}
.faq-lotofacil .title-faq, .faq-lotofacil .subtitle-indexacao{
	color: var(--lotofacil);
}
/*============= /LOTERIA LOTOFACIL =============*/

/*============= LOTERIA QUINA =============*/
.quina {
	color: var(--quina);
}
.quina:hover {
	color: #fff;
	background-color: var(--quina);
}
.quina.active{
	background-color: var(--quina);
	color: #fff;
}
.card-quina {
	border: 1px solid var(--quina);
}
.card-quina .name-date-loteria {
	background-color: var(--quina);
}
.card-quina .numbers-loteria span {
	background-color: var(--quina);
}
.card-quina .btn-loteria-prev-next:hover{
    background-color: var(--quina);
}
.faq-quina .title-faq, .faq-quina .subtitle-indexacao{
	color: var(--quina);
}
/*============= /LOTERIA QUINA =============*/

/*============= LOTERIA LOTOMANIA =============*/
.lotomania {
	color: var(--lotomania);
}
.lotomania:hover {
	color: #fff;
	background-color: var(--lotomania);
}
.lotomania.active{
	background-color: var(--lotomania);
	color: #fff;
}
.card-lotomania {
	border: 1px solid var(--lotomania);
}
.card-lotomania .name-date-loteria {
	background-color: var(--lotomania);
}
.card-lotomania .numbers-loteria span {
	background-color: var(--lotomania);
}
.card-lotomania .btn-loteria-prev-next:hover{
    background-color: var(--lotomania);
}
.faq-lotomania .title-faq, .faq-lotomania .subtitle-indexacao{
	color: var(--lotomania);
}
/*============= /LOTERIA LOTOMANIA =============*/

/*============= LOTERIA TIMEMANIA =============*/
.timemania {
	color: var(--timemania);
}
.timemania:hover {
	color: #fff;
	background-color: var(--timemania);
}
.timemania.active{
	background-color: var(--timemania);
	color: #fff;
}
.card-timemania {
	border: 1px solid var(--timemania);
}
.card-timemania .name-date-loteria {
	background-color: var(--timemania);
}
.card-timemania .numbers-loteria span {
	background-color: var(--timemania);
}
.card-timemania .btn-loteria-prev-next:hover{
    background-color: var(--timemania);
}
.faq-timemania .title-faq, .faq-timemania .subtitle-indexacao{
	color: var(--timemania);
}
.timemania-local span:first-of-type{
	color: var(--timemania);
	text-transform: none;
}
/*============= /LOTERIA TIMEMANIA =============*/

/*============= LOTERIA DUPLA SENA =============*/
.dupla-sena {
	color: var(--duplasena);
}
.dupla-sena:hover {
	color: #fff;
	background-color: var(--duplasena);
}
.dupla-sena.active{
	background-color: var(--duplasena);
	color: #fff;
}
.card-dupla-sena {
	border: 1px solid var(--duplasena);
}
.card-dupla-sena .name-date-loteria {
	background-color: var(--duplasena);
}
.card-dupla-sena .numbers-loteria span {
	background-color: var(--duplasena);
}
.card-dupla-sena .btn-loteria-prev-next:hover{
    background-color: var(--duplasena);
}
.faq-dupla-sena .title-faq, .faq-dupla-sena .subtitle-indexacao{
	color: var(--duplasena);
}
.award-one, .award-two {
    display: flex;
    gap: 10px;
}
.text-category-sena {
	text-align: center;
	color: #666;
	font-size: 14px;
	margin-bottom: 10px;
}
.card-dupla-sena .sorteio-details {
    justify-content: center;
}
/*============= /LOTERIA DUPLA SENA =============*/

/*============= LOTERIA FEDERAL =============*/
.federal {
	color: var(--federal);
}
.federal:hover {
	color: #fff;
	background-color: var(--federal);
}
.federal.active{
	background-color: var(--federal);
	color: #fff;
}
.card-federal {
	border: 1px solid var(--federal);
}
.card-federal .name-date-loteria {
	background-color: var(--federal);
}
.card-federal .numbers-loteria span {
	background-color: var(--federal);
}
.card-federal .btn-loteria-prev-next:hover{
    background-color: var(--federal);
}
.faq-federal .title-faq, .faq-federal .subtitle-indexacao{
	color: var(--federal);
}
.card-federal .sorteio-details {
    gap: 15px;
}

.card-federal .sorteio-details::-webkit-scrollbar{height:5px;}
.card-federal .sorteio-details::-webkit-scrollbar-track{background-color:#fff;border-radius:20px;position:relative}
.card-federal .sorteio-details::-webkit-scrollbar-thumb{background-color:#CCCCCC;border-radius:20px}
/*============= /LOTERIA FEDERAL =============*/

/*============= LOTERIA LOTECA =============*/
.loteca {
	color: var(--loteca);
}
.loteca:hover {
	color: #fff;
	background-color: var(--loteca);
}
.loteca.active{
	background-color: var(--loteca);
	color: #fff;
}
.card-loteca {
	border: 1px solid var(--loteca);
}
.card-loteca .name-date-loteria {
	background-color: var(--loteca);
}
.card-loteca .numbers-loteria span {
	background-color: var(--loteca);
}
.card-loteca .btn-loteria-prev-next:hover{
    background-color: var(--loteca);
}
.faq-loteca .title-faq, .faq-loteca .subtitle-indexacao{
	color: var(--loteca);
}
.jogos-loteca p, .jogos-loteca span {
    color: #666666;
    font-size: 14px;
    margin-bottom: 0px;
}
.jogo {
    display: flex;
    justify-content: center;
    align-content: center;
    gap: 10px;
}
.jogos-loteca span {
	margin-top: 3px;
}
.jogos-loteca .vence, .jogos-loteca .vence span {
    color: red;
}
/*============= /LOTERIA LOTECA =============*/

/*============= LOTERIA DIA DE SORTE =============*/
.dia-sorte {
	color: var(--dia-sorte);
}
.dia-sorte:hover {
	color: #fff;
	background-color: var(--dia-sorte);
}
.dia-sorte.active{
	background-color: var(--dia-sorte);
	color: #fff;
}
.ativo{
	background-color: var(--dia-sorte);
	color: #fff;
}
.card-dia-sorte {
	border: 1px solid var(--dia-sorte);
}
.card-dia-sorte .name-date-loteria {
	background-color: var(--dia-sorte);
}
.card-dia-sorte .numbers-loteria span {
	background-color: var(--dia-sorte);
}
.card-dia-sorte .btn-loteria-prev-next:hover{
    background-color: var(--dia-sorte);
}
.faq-dia-sorte .title-faq, .faq-dia-sorte .subtitle-indexacao{
	color: var(--dia-sorte);
}
.table-result, .prizedraw-result {
    display: flex;
	justify-content: center;
}
.lottery-luck {
	justify-content: center;
}
.prizedraw-result {
    display: flex;
    gap: 10px;
}
.prizedraw-result p {
    font-size: 14px;
    height: 17px;
    margin: 0 0 10px;
    color: #666;
}

/*============= /LOTERIA DIA DE SORTE =============*/

/*============= LOTERIA SUPER SETE =============*/
.super-sete {
	color: var(--super-sete);
}
.super-sete:hover {
	color: #fff;
	background-color: var(--super-sete);
}
.super-sete.active{
	background-color: var(--super-sete);
	color: #fff;
}
.card-super-sete {
	border: 1px solid var(--super-sete);
}
.card-super-sete .name-date-loteria {
	background-color: var(--super-sete);
}
.card-super-sete .numbers-loteria span {
	background-color: var(--super-sete);
}
.card-super-sete .btn-loteria-prev-next:hover{
    background-color: var(--super-sete);
}
.faq-super-sete .title-faq, .faq-super-sete .subtitle-indexacao{
	color: var(--super-sete);
}
/*============= /LOTERIA SUPER SETE =============*/

/*============= LOTERIA TELESENA =============*/
.tele-sena:hover {
	color: #fff;
	background-color: var(--telesena);
}
.tele-sena:hover img {
	display: block;
}
.tele-sena.active{
	background-color: var(--telesena);
	color: #fff;
}
.card-tele-sena {
	border: 1px solid var(--telesena);
}
.card-tele-sena .name-date-loteria {
	background-color: var(--telesena);
}
.card-tele-sena .numbers-loteria span {
	background-color: var(--telesena);
}
.card-tele-sena .btn-loteria-prev-next:hover{
    background-color: var(--telesena);
}
.faq-tele-sena .title-faq, .faq-tele-sena .subtitle-indexacao{
	color: var(--telesena);
}
.numbers-loteria-telesena, .todos-numbers {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 15px 7px;
	margin: 0;
}

.numbers-loteria-telesena {
	padding: 0 30px;
}

.todos-numbers {
	padding: 0 100px;
}

.numbers-loteria-telesena span, .todos-numbers span {
	padding: 0px 0.37rem;
    border-radius: 15px;
    font-weight: bold;
    font-size: 18px;
    line-height: 30px;
}

.card-tele-sena .numbers-loteria-telesena span {
    background-color: transparent;
    border: 1px solid var(--textcolor);
    color: var(--textcolor);
}

.todos-numbers span {
	background-color: transparent;
    border: 1px solid var(--telesena);
    color: var(--telesena);
}

.telesena-pontos {
    display: flex;
}

.telesena-pontos .detail-resp:first-of-type {
    display: flex;
    padding: 0 5px;
    margin-bottom: 0px;
    color: var(--textcolor);
}
.detail-telesena {
    color: var(--telesena);
    margin-bottom: 0!important;
}

.telesena-sorteios .detail {
    margin-bottom: 0;
}

.details-mais-pontos .detail-resp:nth-child(2n) {
    font-weight: 400;
}

/*============= /LOTERIA TELESENA =============*/

/*============= MEDIA QUERY =============*/
@media screen and (max-width:768px) {
	/*======== DIA DE SORTE =========*/
	.table-result, .lottery-luck {
    	display: block;
	}
	.prizedraw-result {
    	justify-content: center;
	}

	/*======== TELESENA =========*/
	.card-tele-sena .sorteio-details {
    	justify-content: center;
	}
}
@media screen and (max-width: 991px){
	.faq-indexacao{
		max-width: 100%;
	}
}
@media screen and (max-width: 480px){
	.faq-indexacao{
		max-width: 345px;
	}
}
@media screen and (max-width:600px){
	/*======== FEDERAL =========*/
	.card-federal .sorteio-details {
	    overflow-x: scroll;
	    overflow-y: hidden;
	    flex-wrap: nowrap;
	    white-space: nowrap;
	    padding-bottom: 40px;
		justify-content: flex-start;
	}

}
@media screen and (max-width: 640px){
	.sorteio-details .details-local{
		width: 100%;
	}
}
/*============= /MEDIA QUERY =============*/