html, body {
    min-height: 100vh;
    width: 100vw;
}

body {
    margin: 0 !important;
    padding: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Bahnschrift", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    background-color: #ffffff !important;
}

.logoNoSideBar {
    font-size: 20px;
    font-family: "Poppins", sans-serif;
    font-weight: bold;
}

.box {
    background: none !important;
    color: #0d0d0d !important;
    text-align: center !important;
    position: fixed !important;
    padding: 20px !important;
    left: 50% !important;
    top: 50% !important;
    -webkit-transform: translateX(-50%) translateY(-50%) !important;
    transform: translateX(-50%) translateY(-50%) !important;
}

.spinner > div {
    width: 25px;
    height: 25px;
    background-color: #FFE771;
    margin: 5px !important;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    40% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
    }
}

/*
loader
*/

.boxLoader {
    width: 100%;
    height: 100%;
    position: relative;
    background-color: #7aa2ef;
}

.lds-ellipsis {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px;
    width: 80px;
    height: 80px;
}

.lds-ellipsis div {
    position: absolute;
    top: 33px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #0d3c61 !important;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}

/*
Fim loader
*/

.alertButton {
    background-color: transparent !important;
    border: none !important;
    color: #777778 !important;
    font-size: 16px !important;
    max-width: 15px !important;
}


.alertButton .pi {
    font-size: 1.3rem !important;
}

.tituloContent {
    display: block;
    margin-bottom: 30px;
    font-size: 20px !important;
}

#app-sidebar-1 {
}

.max-height {
    max-height: 90vh !important;
    overflow: auto !important;
    margin-top: 10px;
}

.loginInput {
    width: 100% !important;
}

.box {
    width: 100%;
    height: 100%;
    position: relative !important;
}

.loginBox {
    width: 400px;
    height: 300px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -200px 0 0 -150px;
}

.center-area {
}

.main-content-area {
}

/*BlockUI*/
.ui-blockui-content.ui-widget.ui-widget-content.ui-corner-all.ui-helper-hidden.ui-shadow {
    box-shadow: none;
}

ui-blockui ui-widget-overlay ui-helper-hidden {
    /*opacity: 0.3 !important;*/
    /*background: none;*/
}

.chips-w-full, .chips-w-full > .ui-chips-container {
    width: 100%;
}

.chips-read-only .ui-chips-token-label {
    padding: 0 0.5rem 0 0.5rem !important;
}

.chips-read-only .ui-icon-close {
    display: none !important;
}

.no-column-headers > div > table > thead,
.no-column-headers > div > .ui-datatable-scrollable-header-box > table > thead {
    display: none;
}

.selOneButton-w-full {
    width: 100%;
}

.selOneButton-w-full > div {
    width: 50%;
}

.actionsZone {
}

.actionsZone button {
    margin-right: 3px;
    margin-bottom: 3px
}

.custom-menuBar {
    background-color: #f2f2f2 !important;
}

.custom-menuBar .ui-menuitem.ui-widget.ui-corner-all {
    border-radius: 5px
}

.custom-menuBar .ui-menuitem.ui-widget.ui-corner-all > a:hover {
    background-color: #e1e1e1 !important;
}

.bg-inherit {
    background: inherit;
}

body .ui-button, body .ui-selectonebutton > .ui-button.ui-state-active {
    background: #296db2;
    border-color: #296db2;
    color: #fff;
}

body .ui-button.ui-state-hover {
    background: #296db2;
    border-color: #296db2;
    color: #fff;
}

body .ui-menu.ui-menubar {
    padding: 0.5rem !important;
    background: transparent !important;
    border-radius: 4px !important;
}

body .ui-menu .ui-menu-list .ui-menu-child {
    background: #383F51 !important;
    padding: 0.25rem 0 !important;
}

body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-menuitem-text {
    float: none !important;
    vertical-align: middle !important;
    font-size: 12px !important;
}

body .ui-panelgrid .ui-panelgrid-cell {
    background: none !important;
    /*text-align: center;*/
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active a {
    color: #296DB2;
}

body .ui-tabs.ui-tabs-top > .ui-tabs-nav li.ui-tabs-header.ui-state-active {
    border-color: #296DB2 !important;
}

/********** COISAS COMUNS *********/

.custom-pageLayout {
    width: 80%;
    margin: 0 auto;
}

#mainform\:loginButton, #mainform\:logoutButton {
    font-size: 0.813rem;
    color: #fff;
    font-weight: bold;
    margin-top: 0.5rem;
    background: transparent;
    border: 0 none;
}

.loginLogo {
    height: 3rem;
    margin: 1rem;
}

.formWeb {
    display: block;
    z-index: 200 !important;
}

.formMobile {
    display: none;
}

.panelBlock {
    background: white;
    min-height: 10rem;
    margin-top: -10rem;
    position: relative;
    padding: 1rem;
    box-shadow: 2px 2px 5px darkgray;
    margin-bottom: 1rem;
}

.tituloBlock {
    font-family: 'Bahnschrift', sans-serif !important;
    font-weight: bold;
    font-size: 25px !important;
}

.textJustify {
    text-align: justify;
}

.textBlock {
    font-family: 'Bahnschrift', sans-serif !important;
}

.tituloPagina {
    font-weight: bold;
    font-size: 5rem !important;
    color: white;
}

.tituloPaginaPlacement {
    margin-top: -13%;
    margin-bottom: 6%;
}

.tituloBrevemente {
    background-color: rgba(100, 100, 100, 0.3);
    font-size: 4.4rem !important;
    font-weight: bold;
    color: white;
    padding: 0 1rem;
}

.subtituloBrevemente {
    background-color: rgba(100, 100, 100, 0.3);
    font-size: 1.4rem !important;
    color: white;
}

.opTituloBrevemente {
    margin-top: -36%;
}

/********** TOP BAR *********/

.custom-topBar {
    width: 100%;
    height: 6rem;
    z-index: 1000;
    border: 0 none;
    background-color: #296db2;
    position: fixed !important;
}

.topBarMobile {
    display: none;
}

.topBar {
    display: block;
    width: 100%;
}

.topBar ul {
    width: 100%;
    list-style: none;
    margin-top: -0.2rem;
}

.topBar li {
    padding: 0.4rem;
}

.topBarLinks {
    font-size: 0.813rem;
    color: #fff !important;
    font-family: Bahnschrift, sans-serif !important;
}

.topBarLinksMenu {

}

.topBarLinksMenu ul {
    width: 100%;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.topBarLinksMenu li {
    float: left;
    margin-top: -0.55rem;
}

.topBarLinksMenu li a {
    display: block;
    color: white;
    text-align: center;
    padding: 16px;
    text-decoration: none !important;
}

.topBarLinksMenu li a:hover {
    background-color: #2665a4;
}

.topBarLinksMenu li a:active {
    font-weight: bold;
}

.custom-logo {
    margin: auto;
    height: 2.813rem
}

.custom-logoCMA {
    margin: auto;
    margin-top: 0.6rem;
    height: 1.813rem;
    float: right;
}

.dropdown {
    position: relative;
    /*display: inline-block;*/
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    padding: 12px 16px;
    z-index: 1;
}

.dropdown-contentD {
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    padding: 12px 16px;
    z-index: 1;
}

.dropdown-content ul {
    list-style: none;
}

.dropdown:active .dropdown-content {
    display: block;
    margin-top: 4rem;
    background-color: #2d75be;
    color: white;
}

.linkText {
    font-weight: bold;
    text-decoration: underline !important;
    color: black !important;
}

/********** PÁG. ADMINISTRAÇÃO *********/

.imagePanel {
    border: 1px solid lightgray;
    margin: 0 15%;
    border-radius: 5px;
    box-shadow: 2px 2px 5px lightgray;
}


/********** PÁG. DASHBOARD *********/

.custom-card {
    z-index: 1000 !important;
    display: flex;
    min-height: 15rem;
    padding: 4.5rem 2rem;
    color: #fff;
    justify-content: center;
    text-align: center;
}

.cardContagens {
    text-align: center;
    height: 10rem;
    color: #444;
    margin-left: -2.5rem;
}

.centerCardTitle {
    width: 70%;
    padding: 0.5rem;
    border: 0.1rem solid #F2F2F2;
    border-radius: 0.5rem;
    background: #F2F2F2;
    margin: 0.5rem auto;
    color: #444;
}

.centerCardText {
    font-size: 1.5rem !important;
}

.centerCardTitleBlue {
    font-size: 3rem !important;
    color: #296DB2;
    font-weight: bold;
}

.dashboardBg {
    /*z-index: 0 !important;*/
    /*height: 100%;*/
}

.imgPanel {
    z-index: 500;
}

.imgCenterPanel {
    margin: -10% 0 0 5%;
    display: flex;
    list-style-type: none;
    padding: 0;
    align-items: center;
}

.imgCenterPanel ul {
    list-style: none;
}

.imgCenterPanel li {
    margin-right: 2rem;
}

.imgCenterCard {
    max-width: 20rem;
    width: 100%;
    height: auto;
    border-radius: 75rem;
    box-shadow: 0.125rem 0.375rem 0.375rem darkgray;
}

.contagens ul {
    list-style: none;
}

.contagens li {
    display: inline-block;
    margin: 2rem;
}

/********** PÁG. RECENSEAMENTO *********/

.recenseamentoButtonBlock {
    margin-bottom: 3rem;
}

.recenseamentoButtonBlockRight {
    float: right;
}

.recenseamentoButtonBlockLeft {
    float: left;
}

.recenseamentoButtonBlock ul {
    list-style: none;
    margin-left: -2rem;
}

.recenseamentoButtonBlock li {
    display: inline-block;
}

.logoA360 {
    margin-top: -2%;
}

.btnA360 {
    background-color: #c92323 !important;
    border-color: #c92323 !important;
    margin-left: .5rem !important;
}

/********** PÁG. CANDIDATURAS *********/

.tituloCamposCandidaturas {
    color: #146BB0;
    font-weight: bold;
}

.paddingTituloBrevementeC {
    padding: 0 10.95rem 0.2rem 10.95rem;
}

.ui-fileupload-filename {
    color: red;
}

/********** PÁG. LISTAS *********/

.tituloLista {
    width: 11rem !important;
    display: block;
    margin-top: -1rem;
    position: relative;
}

.imageListaPanel {
    max-width: 80%;
    margin: 0 auto !important;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.imageListaPanel ul {
    padding: 0;
    margin: 0;
    display: flex;
    list-style: none;
    flex-wrap: wrap; /* This allows items to wrap to the next "row" */
}

.imageListaPanel li {
    margin: 0;
    width: 35%;
    display: inline-block;
    box-sizing: border-box; /* Include padding and border in the width */
    padding: 10px; /* Adjust the padding as needed */
}

.imageLista {
    width: 12.5rem;
    border-radius: 5px;
    box-shadow: 0px 0px 6px -2px rgba(0, 0, 0, 0.75);
}

.opcoesCampanha {
    font-weight: bold;
    margin: 0 1%;
}

.imagemMembrosLista {
    margin-left: -7rem;
    border-radius: 100%;
}

.blockInfoMembro {
    width: 40%;
    background: aliceblue;
    margin: 2rem 30%;
    border-radius: 20px;
}

body .ui-avatar {
    background-color: transparent;
}

.tituloListas {
    width: 12.5rem !important;
    padding: 0.5rem;
    border: 0.1rem solid #F2F2F2;
    border-radius: 0.5rem;
    background: #F2F2F2;
    margin: 0.5rem auto;
    color: #444;
}

.labelElementCard {
    font-weight: bold;
    margin-left: -15%;
}

.textElementCard {
    margin-left: -15%;
}

.opcoesCampanhaCard {
    width: 50% !important;
    margin: 2rem 0;
}

.campanhaInfoCard {
    width: 80%;
    margin: 0 auto;
    text-align: justify;
}

/********** PÁG. VOTAÇÃO *********/

.paddingTituloBrevementeV {
    padding: 0 9.6rem 0.2rem 9.6rem;
}

.contagensVotacao ul {
    list-style: none;
}

.contagensVotacao li {
    display: inline-block;
    margin: 1rem 2rem;
}


/* TELEMOVEL */

@media only screen and (max-width: 450px) {

    body .ui-datatable .ui-paginator.ui-paginator-top {
        font-size: 10px !important;
    }

    .ui-paginator.ui-paginator-bottom {
        font-size: 10px !important;
    }

    body .ui-dialog .ui-dialog-titlebar {
        padding: 1rem !important;
    }

    .topBarButton {
        font-size: 0.813rem;
        color: #fff;
        font-weight: bold;
        float: right;
        margin-top: 0.5rem;
        background: transparent !important;
        border: 0 none !important;
    }

    .custom-topBar {
        position: relative !important;
    }

    .topBar {
        display: none !important;
    }

    .topBarMobile {
        margin-top: 0.8rem !important;
        width: 100%;
        display: block !important;
    }

    .custom-logo {
        margin: auto;
        height: 1.813rem
    }

    .custom-card {
        min-height: 25rem;
        padding: 0 !important;
    }

    .formMobile {
        display: block !important;
    }

    .formWeb {
        display: none !important;
    }

    .tituloPaginaPlacement {
        margin-top: -6rem;
        margin-bottom: 20%;
    }

    .tituloPagina {
        font-size: 2rem !important;
    }

    .tituloBrevDisp {
        font-family: 'Bahnschrift', serif !important;
        font-size: 2rem !important;
        font-weight: bold;
        margin-top: -25rem;
        position: absolute;
        color: white;
    }

    .textoBrevDisp {
        font-family: 'Bahnschrift', serif !important;
        font-size: 1rem !important;
        font-weight: bold;
        margin-top: -25rem;
        position: absolute;
        color: white;
    }

    .inverseButton {
        background-color: transparent !important;
        color: #296db2 !important;
        border: 0 none !important;
    }

    .subtituloBrevemente {
        font-size: 0.8rem !important;
    }

    .tituloBrevemente {
        font-size: 1.8rem !important;
    }

    .opTituloBrevemente {
        margin-top: -24rem !important;
    }

    .paddingTituloBrevementeV {
        padding: 0 !important;
    }

    /***** PÁG. DASHBOARD *****/
    .imgCenterPanel {
        max-width: 80%;
        margin-top: 1rem;
        margin-left: -4rem;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .imgCenterPanel ul {
        padding: 0;
        margin: 0;
        display: flex;
        flex-wrap: wrap; /* This allows items to wrap to the next "row" */
    }

    .imgCenterPanel li {
        margin: 0;
        width: 35%;
        box-sizing: border-box; /* Include padding and border in the width */
        padding: 10px; /* Adjust the padding as needed */
    }

    .imgCenterCard {
        width: 8rem;
        box-shadow: 2px 2px 5px lightgray;
    }

    .cardContagens {
        height: 7rem;
    }

    .centerCardTitle {
        width: 9rem;
        margin-top: -1rem;
        position: relative;
    }

    .centerCardText {
        font-size: 1rem !important;
    }

    .centerCardTitleBlue {
        font-size: 2rem !important;
    }

    .panelBlock {
        margin-bottom: 5% !important;
    }

    /***** PÁG. RECENSEAMENTO *****/
    .recenseamentoButtonBlock {
        margin-bottom: 0 !important;
    }

    .recenseamentoButtonBlockRight {
        float: none;
        margin-top: 2rem;
    }

    .recenseamentoButtonBlockLeft {
        float: none;
    }

    .recenseamentoButtonBlock ul {
        margin-left: -2rem !important;
    }

    .recenseamentoButtonBlock li {
        display: block;
    }

    .btnA360 {
        margin-top: 0.5rem !important;
    }

    .textJustify {
        text-align: justify;
        font-size: 0.75rem !important;
    }

    /***** PÁG. CANDIDATURAS *****/
    .textBlock {
        font-size: 0.75rem !important;
    }

    .tituloCamposCandidaturas {
        font-size: 0.8rem !important;
    }

    #mainform\:pgCandidatura_content {
        width: 100%;
    }

    #mainform\:pgDesistencia_content {
        width: 100%;
    }

    .dataScrollerNome {
        font-size: 0.8rem !important;
        font-weight: bold;
    }

    .dataScrollerDescricao {
        font-size: 0.8rem !important;
    }

    .novoEleitor {
        float: right;
        margin-top: -27% !important;
        margin-right: -5% !important;
    }

    .removeEleitor {
        font-size: 0.8rem !important;
        float: right;
        margin-top: -15% !important;
    }

    /***** PÁG. LISTAS ******/
    .imageListaPanel {
        margin: 0 0 0 -3rem !important;
        grid-template-columns: repeat(1, 1fr);
    }

    .imageLista {
        width: 8rem;
    }

    .tituloListas {
        width: 8rem !important;
        margin: 0 auto !important;
    }

    .blockInfoMembro {
        width: 85%;
        margin: 2rem auto !important;
    }

    .imagemMembrosLista {
        margin-left: -4rem;
    }

    .labelElementCard {
        margin-left: 1rem !important;
        font-size: 11px !important;
    }

    .textElementCard {
        margin-left: 1rem !important;
        font-size: 11px !important;
    }

    .opcoesCampanha {
        margin: 0 !important;
        font-size: 12px !important;
    }

    .opcoesCampanhaCard {
        width: 95% !important;
        margin-top: 2rem;
    }

    /****** PÁG. VOTAÇÃO ******/

    .contagensVotacao {
        height: 7rem;
    }

    .contagensVotacao ul {
        margin-left: -5rem !important;
    }

    .contagensVotacao li {
        margin: 1rem 1rem !important;
    }

}