@charset "UTF-8";
@font-face {
    font-family: 'Digital Clock';
    src: url('../fonts/font/seven_segment.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

*{
    padding: 0;
    margin: 0;
    outline: none;
    border: none;
    border-style: none;
    box-sizing: border-box;
}
:root{
    --primary-yellow: #FFD700;
    --secundary-yellow: #F5EC49;
    --tertiary-yellow: #988100;
    --p-yellow-glow: inset 0px 0px 5px var(--primary-yellow), 0px 0px 5px var(--primary-yellow);
    --primary-blue: #0F1923;
    --secundary-blue: #323B45;
    --primary-shadow: #070c11ce;
    --transparent: #00000000;
    --bg-gradient: linear-gradient(to top, #36597D, #62A2E3, #6DB5FC, #62A2E3, #36597D, #1A2C3D, #0F1923, #070b0f 50%);
    --error: #EB0101;
    --success: #0FF500;
    --primary-font: 'Montserrat', sans-serif;
    --secundary-font: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
body{
    font-size: 1rem;
    max-width: 1400px;
    color: #FFF;
    background-color: var(--primary-blue);
    background-attachment: fixed;
    font-family: var(--primary-font);
}
a, a:visited{
    font-family: var(--primary-font);
    cursor: pointer;
    text-decoration: none;
}
button{
    font-family: var(--primary-font);
    cursor: pointer;
    border-radius: 5px;
}
ul{
    list-style: none;
    display: flex;
}
.m0a{
    margin: 0 auto;
}
.ml-10{
    margin-left: 10px;
}
.mx-60{
    margin: 60px 0;
}
.txt-center{
    text-align: center;
}
.flex-row-center{
    display: flex;
    flex-direction: row;
    max-width: 95vw;
    justify-content: center;
}
.flex-column-center{
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    max-width: 80vw;
}
.cPointer{
    cursor: pointer;
}
.nSelect{
    user-select: none;
}
.bgimage{
    background-color: var(--secundary-blue);
    border-radius: 3px;
    width: fit-content;
    padding: 0 60px;
}
.show-size{
    border: 1px dashed #FFF;
}
.lipter-name{
    width: 130px;
}
.logo a{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.logo a div{
    margin-right: 5px;
    width: 60px;
    height: 52px;
}
.img-logo{
    position: absolute;
    top: 5px;
    width: 58px;
    height: 70px;
}
.rem8{
    font-size: .8rem !important;
}
.h-modal{
    height: 600px !important;
}

/*  */

.mod-jogos-container li {
    height: fit-content !important;
}

/* PADRÃO NOTIFICAÇÕES */
#alertNotify{
    visibility: hidden;
}
.notify-list{
    width: 350px !important;
    flex-wrap: nowrap !important;
}
.notify-list details{
    margin-top: 15px;
}
.notify-list details summary{
    width: 285px;
    background-color: var(--primary-yellow);
    color: var(--primary-blue);
    margin-bottom: 10px;
    font-weight: bold;
    list-style: none;
    user-select: none;
    cursor: pointer;
    padding: 5px;
    border-radius: 3px 3px 0 0;
}
.notify-list details p{
    font-family: Arial, Helvetica, sans-serif;
    margin-top: -9px;
    margin-bottom: 10px;
    width: 285px;
    text-align: start;
    padding: 10px;
    background-color: #FFF;
    color: #000;
    border-radius: 0 0 3px 3px;
}
.notify-list button{
    margin-left: 5px;
    background-color: var(--transparent);
}
.notify-list i{
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: var(--error);
    font-size: 1.5em;
    cursor: pointer;
    border-radius: 50%;
}

/* PADRÃO SEARCH BOX */
.filter-container{
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    justify-content: space-between;
}
.search-container span i{
    position: absolute;
    margin: 3px 5px 4px 7px;
}
#search-box{
    color: #FFF;
    background: var(--transparent);
    border: 1px solid #FFF;
    border-radius: 50px;
    padding: 0px 0px 0px 25px;
    width: 150px;
    height: 28px;
    margin-top: -5px;
    transition-duration:.5s;
    transform-origin: 0% 0%
}
#search-box:hover{
    border: 1px solid var(--primary-yellow);
}
#search-box:focus{
    border: 1px solid var(--primary-yellow);
}
.filter-position{
    display: grid;
    grid-template-rows: 1fr 1fr 1fr;
    margin-top: 10px;
}
.filter-position div{
    display: flex;
    justify-content: space-between;
    margin-top: 5px;
}
.checkboxes-container{
    position: absolute;
    background-color: var(--primary-blue);
    border: 1px solid var(--secundary-blue);
    border-radius: 3px;
    width: 125px;
    padding: 5px;
}
.title-filter{
    cursor: pointer;
    list-style: none;
    user-select: none;
}

/* PADRAO DOS INPUTS */
input{
    color: #FFF;
    background: var(--transparent);
    border-bottom: 2px solid #FFF;
    padding: 10px;
}
input:focus{
    border-bottom: 2px solid var(--primary-yellow);
}
input:hover{
    transition: .5s;
}

/* PADRAO DAS TABELAS */
td{
    background-color: var(--secundary-yellow);
    color: var(--primary-blue);
    text-align: center;
    font-weight: bold;
    font-size: .8rem;
    padding: 5px;
}

/* PADRAO DOS BOTOES */
.mod-button{
    text-decoration: none;
}
.standart-1{
    padding: 7px 10px;
    border-radius: 5px;
}

/* TABELAS */
td, th{
    font-family: var(--secundary-font);
    padding: 5px;
    font-size: .7rem;
    max-width: 163px;
    min-width: 135px;
    justify-content: space-between;
}
td{
    border-right: 1px solid var(--primary-blue);
    border-left: 1px solid var(--primary-blue);
    border-bottom: 1px solid var(--primary-blue);
}
tbody{
    margin: 0 auto;
}
.titulos-tabela{
    margin: 0 auto;
}
.titulos-tabela th{
    background-color: var(--primary-shadow);
}
.btt-tabela{
    background-color: var(--transparent);
    color: var(--primary-blue);
    cursor: pointer;
}
td a button, td button{
    border: 1px dashed var(--primary-blue);
    border-radius: 50%;
    padding: 5px;
}
.container-tabela{
    border-collapse: collapse;
    margin: 0;
    width: 100%;
}

/* SCROLL VERTICAL */
.scroll-y{
    height: 60%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    overflow: hidden;
    overflow-y: auto;
    border-radius: 5px;
}

/* SCROLL HORIZONTAL */
.scroll{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    overflow-x: auto;
    border-radius: 5px;
}

/* scroll personalizado */
.personalized-scroll {
    width: 100%;
    height: 500px;

    display: flex;
    flex-wrap: wrap;

    overflow: hidden;
    overflow-y: auto;
    overflow-x: auto;
    border-radius: 5px;
}

/* EFEITO LOADING */
.spinner{
	animation: spinner 0.7s linear infinite;
}
@keyframes spinner{
	to{
		transform: rotate(360deg);
	}
}

/* MODAL LOGIN e REGISTRO */
.modal-container{
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 2000;
    display: none;
    justify-content: center;
    align-items: center;
}
.modal-container.mostrar{
    display: flex;
}
.mostrar .modal{
    animation: modal 0.2s;
}
@keyframes modal{
    from {
        opacity: 0;
        transform: translate3d(0, -20px, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
.modal{
    font-family: 'Montserrat', sans-serif;
    background: var(--primary-blue);
    color: #FFF;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5vh;
    padding: 20px 30px;
    border: 2px solid var(--secundary-blue);
    box-shadow: 0px 2px 2px #070c11ce;
    border-radius: 3px;
    text-align: center;
}
form{
    margin-top: 30px;
    margin-bottom: 40px;
}
form textarea:focus, input:focus, button:focus, .half-box:focus, .full-box:focus{
    outline: none;
}
form a, label{
    font-size: .8rem;
}

.half-box input, .full-box input{
    display: block;
    /* width: 100%; */
}
.registro-info{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.registro-info input{
    margin-bottom: 40px;
}
.registro-info p {
    font-weight: bold;
    color: var(--error);
    font-size: .8rem;
}
.half-box{
    flex: 1 1 45%;
}
.full-box{
    flex: 1 1 100%;
}
.login-info .full-box{
    margin-bottom: 15px;
}
#cpf{
    margin-top: 5px;
}
#data{
    width: 164px;
}
.submit-reg, .submit-log{
    width: 50%;
    margin-left: 25%;
    margin-top: 15px;
}
#agreement{
    margin-right: 5px
}
#agreement, #agreement-label{
    display: inline-flex;
    width: auto;
}
.space{
    margin-right: 2.5%;
}
form a{
    text-align: right;
    display: block;
}
.button-cont-logreg{
    font-size: 1rem;
    padding: 1px 50px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    height: 40px;
    border-radius: 20px;
    color: var(--primary-blue);
}
.button-cont-logreg:hover{
    background: var(--primary-yellow);
    transition: .5s;
}

/* MODAL RECARGA */
.recarga{
    width: 400px !important;
    height: 35vh;
}
.recarga-info div{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}
.recarga-info div span{
    margin-top: 10px;
}
.btt-recarga{
    margin-top: 20px;
}

/* CAROUSSEL CONTAINER */
.slideshow-container{
    max-width: 80vw;
    position: relative;
    margin: auto;
}

/* AREA DAS IMAGENS */
.mySlides {
display: none;
}

.mySlides img{
    max-height: 400px;
    border-radius: 3px;
}

/* NEXT E PREV BUTTONS */
.prev, .next{
cursor: pointer;
position: absolute;
top: 50%;
width: auto;
margin-top: -22px;
padding: 16px;
color: #FFF;
font-weight: bold;
font-size: 18px;
transition: 0.6s ease;
border-radius: 0 3px 3px 0;
user-select: none;
}
.next{
right: 0;
border-radius: 3px 0 0 3px;
}
.prev:hover, .next:hover{
background-color: rgba(0,0,0,0.8);
}

/* ANIMACAO DO SLIDE */
.fade{
animation-name: fade;
animation-duration: 1.5s;
}
@keyframes fade {
from {opacity: .4}
to {opacity: 1}
}

/* CHECKBOXES */
.dias-extracao{
    display: flex;
    margin: 20px 0;
    flex-wrap: wrap;
}

.dias-extracao .dia-semana{
    margin-bottom: 25px;
}

#aviso_extracao, #aviso_modalidade {
    margin-top: 20px;
}

.form-adm{
    margin-bottom: 50px;
}

.modalidade-info {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 50px 1fr 100px;
    align-items: center;
    justify-items: center;
    grid-gap: 10px;
    
}

.modalidade-info > div {
    margin-bottom: 20px;
}

.fst-gd{
    grid-column: 1;
    grid-row: 1;
}

.scd-gd{
    grid-column: 2;
    grid-row: 1;
}

.thd-gd{
    grid-column: 1;
    grid-row: 2;
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-content: center;
}

.thd-gd > div{
    flex: 1 1 80px;
}

.fth-gd{
    grid-column: 2;
    grid-row: 2;
}

.fvt-gd{
    visibility: hidden;
    grid-column: 1;
    grid-row: 3;
}

.sxt-gd{
    grid-column: 2;
    grid-row: 3;
}

.sth-gd{
    grid-column: 2;
    grid-row: 4;
}

/* Customisando checkboxes */

.dia {
display: block;
position: relative;
padding-left: 33px;
padding-right: 5px;
cursor: pointer;
font-size: .8rem;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

.dias-ext, .dias-ext-edit {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}

.checkmark {
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
background-color: #eee;
margin-left: 8px;
border-radius: 2px;
}

.dia:hover .dias-ext ~ .checkmark , .dia:hover .dias-ext-edit ~ .checkmark {
background-color: #ffe448;
}

.dias-ext:checked ~ .checkmark, .dias-ext-edit:checked ~ .checkmark {
background-color: #FFD700;
}

.checkmark:after {
content: "";
position: absolute;
display: none;
}

.dias-ext:checked ~ .checkmark:after, .dias-ext-edit:checked ~ .checkmark:after{
display: block;
}

.dia .checkmark:after {
left: 6px;
top: 2px;
width: 4px;
height: 9px;
border: solid black;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}

.dias-extracao label {
    min-width: 90px;
}

/* ABAS PAINEL ADMIN */
.container-tabs{
    display: block;
    height: 550px;
}
.nav_tabs{
    background-color: #fff;
    position: relative;
}
.nav_tabs ul li{
    float: left;
}
.tab_label{
    display: flex;
    flex-wrap: nowrap;
    width: fit-content;
    margin-right: 3px;
    padding: 5px;
    font-size: .89rem;
    color:#000;
    cursor: pointer;
    text-align: center;
    user-select: none;
    font-weight: bolder;
}
.nav_tabs .rd_tab{ 
    display:none;
    position: absolute;
}
.nav_tabs .rd_tab:checked ~ label{ 
    background-color: var(--primary-yellow);
    color:var(--primary-blue);
}
.tab-content{
    border-top: solid 5px var(--primary-yellow);
    background-color: #fff;
    display: none;
    position: absolute;
    padding: 5px;
    left: 0;
    width: 100%;
    min-height: 470px;
    border-radius: 0 0 3px 3px;
}
.rd_tab:checked ~ .tab-content{
    display: block;
}
.tab-content h2{
    padding: 10px;
    color: var(--primary-blue);
}
.tab-content article{
    padding: 10px;
    color: var(--primary-blue);
}