label {
    font-family: 'ocUniviaMedium';
}

html {
    font-family: 'ocUniviaMedium';
}

a:focus {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

input:focus {
    outline: 0;
}

button:focus {
    outline: 0;
}

.suporteMenu {
    color: green;
    font-size: 35px;
}

.panelContent {
    background: white;
    margin: 30px 8vw;
    box-sizing: border-box;
    border-radius: 5px;
}

.compartilhar {
    font-size: 33px;
    color: #408EFF;
    position: absolute;
    left: 30%;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    display: flex;
    align-items: center;
    top: 12px;
}

.compartilhar label {
    font-size: 18px;
}

.whatsapp-share-button {
    display: inline-block;
    width: 55px;
    height: 70px;
    position: absolute;
    margin: 0px;
    background-size: 100% 100%;
    background-image: url(/fonts/img/iconfinder_whatsapp_3204057.svg);
    background-repeat: no-repeat;
    background-position: center;
    left: 30%;
    top: -1px;
}

.cardEmpty {
    display: flex;
    border: 1px solid #7569de;
    height: 125px;
    border-radius: 10px;
    position: relative;
    transition: all .4s;
    align-items: center;
    position: relative;
    margin-right: 2em;
    margin-bottom: 2em;
}

.cardEmpty:hover>div>span:before {
    content: "";
    color: #63c947;
    font-size: 10px;
    transition: all .8s;
}

.cardEmpty>div>span:before {
    content: "ADICIONAR FAVORITO";
    color: #63c947;
    font-size: 10px;
    transition: all .8s;
}

.cardEmpty:hover {
    box-shadow: 0px 32px 88px -60px #7569de inset;
    cursor: pointer;
    border-left: 1px solid #7569de;
    border-right: 1px solid #7569de;
    border-top: 1.5px solid #7569de;
    border-bottom: 1.5px solid #7569de;
    transition: box-shadow .4s;
}

.cardEmpty>div>img {
    border-left: 2px solid #7569de;
    border-right: 2px solid #7569de;
    border-top: 2px solid #7569de;
    border-bottom: 2px solid #7569de;
    border-radius: 40px !important;
    border-radius: 40px !important;
    transform: rotate(3600deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transition: transform .4s, border-bottom .5s, border-left 0.6s,
        border-top 0.7s, border-right .7s;
    padding: 12px;
}

.cardEmpty:hover>div>img {
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
    transform: rotate(0);
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    transition: transform .6s, border-bottom .7s, border-left 0.8s,
        border-top 0.9s, border-right 1s, content 1s;
    content: url("/fonts/img/plus-alternativo.svg") !important;
    padding: 0;
}

.cardEmpty:hover>div>img[src*=""] {
    display: none;
}

div[class*=ui-g-] {
    transition: all .4s;
}

div[class*=ui-grid] {
    transition: all .4s;
}

.cardEmpty:hover>span {
    box-shadow: 0px 0px 4px 0px #7569de;
    transition: all .4s;
}

.cadastro label {
    color: #63C947;
    font-size: 13px;
}

.color__verde {
    color: #63c947 !important;
    font-family: 'ocUniviaMedium';
}

.color__roxo {
    color: #7569de !important;
    font-family: 'ocUniviaMedium';
}

.color__cinza {
    color: #c4c7c7 !important;
    font-family: 'ocUniviaMedium';
}

.card__atletas {
    padding: 0px;
    flex-grow: 0;
    width: 45%;
    flex-wrap: nowrap;
}

.labelCamp {
    color: #63c947;
    font-size: 12px;
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 13px;
    word-break: break-all;
    max-height: 24px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.labelCategoria {
    color: #7569de;
    font-family: 'ocUniviaBlack';
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 13px;
    word-break: break-word;
    max-height: 13px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

}
.ui-button {
    overflow: hidden !important;
}

.width__45 {
    width: 45%;
}

/*  BOTOES NOVOS SOBRESCREVEM O PRIMEFACE TBM*/
.botaoFases {
    width: 99%;
    background: #7569de;
    padding: 3px;
}

.botaoAdicionar {
    padding: 3px 19px !important;
    font-size: 12px !important;
    border-radius: 3px !important;
    font-family: 'ocUniviaMedium' !important;
}

.botaoExcluirFase {
    position: absolute;
    z-index: 27;
    top: 10px;
    color: white;
    right: 16px;
}

.botaoExcluirFase:hover {
    color: white;
    font-weight: bold;
}

.botaoDialog {
    padding: 1vw !important;
    padding-left: 3.5vw !important;
    padding-right: 3.5vw !important;
    color: white !important;
    border: 0 !important;
    box-shadow: 2px 5px 5px -2px #c7c4c4;
}

.botaoDialog:hover {
    box-shadow: 2px 5px 7px 0px #c7c4c4;
}

.botaoFases:hover {
    background: #7569de;
}

.botaoNovo {
    background: #63C947 !important;
    border-radius: 5px !important;
    border: 1px solid #63C947 !important;
    width: 100%;
    font-family: arial !important;
    padding: 12px !important;
    font-size: 13px !important;
    color: white !important;
    font-weight: bold !important;
}

.btn-oc-df {
    background: #63C947 !important;
    border-radius: 5px !important;
    border: 1px solid #63C947 !important;
    width: 25.5%;
    font-family: arial !important;
    padding: 12px !important;
    font-size: 13px !important;
    color: white !important;
    font-weight: bold !important;
}

.btn-oc-df:hover {
    box-shadow: inset 0 0 1em #63C947, 0 0 1em #63C947;
}

.btn-clean {
    background: white !important;
    border-radius: 5px !important;
    border: 1px solid #63C947 !important;
    width: 20% !important;
    font-family: 'ocUniviaMedium' !important;
    padding: 8px !important;
    font-size: 15px !important;
    width: 100% !important;
    color: #63C947 !important;
    font-weight: 400 !important;
    color: #63C947 !important;
    position: relative !important;
    overflow: hidden !important;
}

.oc-time {
    word-break: break-word;
    color: #7569de;
    font-size: 13px;
    padding: 0 !important;
}

.corta__4linha--13px {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 15px;
    word-break: break-word;
    max-height: 60px;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.btn-clean:hover {
    box-shadow: inset 0 0 0 #dbdbdb, 0 0 10px #dbdbdb;
}

.botaoVoltar {
    width: 100%;
    background: white !important;
    padding: 10px !important;
    color: #7569DE !important;
    border: 1px solid #7569DE !important;
}

.excluirFase {
    position: absolute;
    background: #7569de;
    font-size: 14px;
    width: 100%;
}

.excluirFase:hover {
    background: #7569de;
}

.botaoVoltar.ui-state-hover {
    width: 100%;
    background: white !important;
    padding: 10px !important;
    color: #7569DE !important;
    box-shadow: inset 0 0 0 #dbdbdb, 0 0 10px #dbdbdb;
}

.wppClass {
    transition: all .4s;
    position: fixed;
    bottom: 20px;
    right: 50px;
    font-size: 63px;
    z-index: 9999;
}

.wppClass label {
    transition: all .4s;
    position: fixed;
    font-size: 11px;
    bottom: 31px;
    background: #45c645db;
    color: white;
    opacity: 0;
    right: 0;
    font-family: 'ocUniviaMedium';
    border-radius: 4px;
    padding: 9px;
    letter-spacing: 2.1px;
}

.wppClass:hover label {
    transition: all .4s;
    position: fixed;
    right: 115px;
    font-size: 11px;
    bottom: 31px;
    background: #45c645db;
    color: white;
    opacity: 1;
    font-family: 'ocUniviaMedium';
    border-radius: 4px;
    padding: 9px;
    letter-spacing: 2.1px;
}

.wppClass:hover label:after {
    content: '';
    display: block;
    position: absolute;
    left: 100%;
    width: 0;
    height: 0;
    border-style: solid;
}

.wppClass:hover label:after {
    top: 7px;
    border-color: transparent transparent transparent #5fce5f;
    border-width: 10px;
}

.botaoConcluir {
    width: 100%;
    background: #7569DE;
    padding: 10px !important;
    color: #ffffff !important;
    border: 1px solid #7569DE !important;
}

.botaoConcluir.ui-state-hover {
    width: 100%;
    background: #7569DE;
    padding: 10px !important;
    color: #ffffff !important;
    border: 1px solid #7569DE !important;
    box-shadow: inset 0 0 0 #7569DE, 0 0 10px #7569DE;
}

.selectOne {
    min-width: 80% !important;
    width: 100% !important;
    border: 1px solid #c7c4c4 !important;
    border-radius: 5px 0 0 5px !important;
    font-family: "ocUniviaMedium" !important;
    color: #c7c4c4 !important;
}

.selectOne>ul>li {
    color: red !important;
}

.buttonPlus {
    width: 4% !important;
    height: 49px;
    margin-left: -4px;
    background: #63c947;
    border: 0;
    position: absolute !important;
    color: white;
    border-radius: 0 5px 5px 0 !important;
    font-size: 20px;
    margin-left: -4px;
}

.checkPadding {
    padding-top: 14%;
}

.checkPadding2 {
    padding-top: 5vh;
}

.campoNumero .ui-inputfield {
    padding-left: 18px !important
}

.botaoPequenoPadding {
    padding-top: 24%;
}

.borderLeft {
    border-left: 1px solid #e8e8e8;
}

.shadow {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}

.card {
    border-radius: 14px;
    border: 0;
    height: auto;
    background: #FCFCFC;
    padding: 12px !important;
    margin-bottom: 10px;
}
/*  ==========================FIM===============================*/

/*  INPUTS NOVOS SOBRESCREVEM O PRIMEFACE TBM*/
.oc-df-input-text {
    border-radius: 7px;
    padding: 15px !important;
    width: 100%;
    font-family: arial;
    font-size: 12px;
    background: white !important;
    outline: none;
    font-family: arial;
}

/*  ==========================FIM===============================*/
.oc-link-box {
    color: #7569DE;
    cursor: pointer;
    font-weight: 400;
    font-size: 14px;
    font-family: 'ocUniviaMedium';
    text-decoration: none;
}

.oc-link-box:hover {
    color: #7569DE;
}

.oc-box-camp {
    justify-content: flex-end;
    border-radius: 14px;
    border: 0;
    height: 125px;
    box-shadow: 0 5px 3px rgba(0, 0, 0, 0.1);
    margin-right: 2em;
    display: flex;
    margin-bottom: 2em;
    background: #FCFCFC;
    padding: 1.5em !important;
    padding-top: 1.5em !important;
    padding-bottom: 1.5em !important;
    position: relative;
}

.oc-favorite {
    color: #63C947;
    position: absolute;
    display: inline-table;
    right: .5em;
    bottom: .5em;
}

.oc-favorite:hover {
    color: #63C947;
}

.display-label-menu {
    display: inline;
    cursor: pointer;
    font-weight: 400;
}

.display-label-menu-focus {
    display: inline;
    cursor: pointer;
    font-weight: 400;
    color: #7569DE;
}

.display-label-menu-focus:hover {
    color: #7569DE;
}
/* CLASSES SIDE MENU/LABEL E ICONES */
.labelCheck {
    color: #c7c4c4;
    font-size: 11px;
    display: contents;
}

.remove-label {
    cursor: pointer;
}

.placeHolder {
    position: absolute;
    color: #7569de;
    padding: 14px;
    margin-left: -4vw;
    margin-top: 2px;
}

.oc-side-menu {
    height: 100%;
    position: fixed;
    top: 50px;
    left: -222px;
    display: none;
    width: 212px;
    background: white;
    z-index: 99999999999;
    box-shadow: 1px 10px 8px 1px #000000bf;
}

.display-icon-home {
    display: none;
}

.border-color {
    border: none;
}

.sidemenu {
    color: #c7c4c4;
    padding: 0;
    width: 100%;
}

.responsive-padding {
    padding: 0px !important;
    padding-left: 2em !important;
}

.center-align {

}

.oc-label {
    font-size: 12px;
    color: #c7c4c4;
}

.oc-label-verde-pequeno {
    font-size: 9px;
    display: block;
    color: #63c947;
    font-family: 'ocUniviaMedium';
    font-weight: bolder;
}

.oc-label-verde {
    font-size: 12px;
    display: block;
    color: #63c947;
    font-family: 'ocUniviaMedium';
    font-weight: 400;
    margin-bottom: 5px;
}

.oc-label-cinza-pequeno {
    display: block;
    text-align: left;
    font-size: 9px;
    font-family: 'ocUniviaMedium';
    font-weight: 400 !important;
    margin-top: 5px;
    color: #c7c4c4;
}
/* 
  EDIT PLACEHOLDER */
::placeholder {
    color: #dbdbdb;
    font-family: 'ocUniviaMedium';
    margin-left: 3px;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #dbdbdb;
    font-family: 'ocUniviaMedium';
    margin-left: 3px;
}

::-ms-input-placeholder { /* Microsoft Edge */
    margin-left: 3px;
    font-family: 'ocUniviaMedium';
    color: #dbdbdb;
}

/*  ==========================FIM===============================*/

/* CLASSES DOS BOTOES E DA NAV PRINCIPAL*/
.icons-margin-top {
    margin-top: -4px;
}

.icons-drop {
    position: absolute;
    top: 20%;
    cursor: pointer;
    padding: 7px;
    margin-right: 5px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
}

.icons-drop-selected {
    position: absolute;
    cursor: pointer;
    top: 20%;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    background: #7569DE;
}

.arrow-up {
    width: 0;
    height: 0;
    float: right;
    margin-top: -10px;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #63C947;
    border-left: 10px solid transparent;
}

.div-colapse-menu {
    position: fixed;
    top: 42px;
    width: 400px;
    height: 90%;
    display: none;
    background: #63C947;
    z-index: 1001;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    overflow-y: auto;
}

.div-colapse-menu-profile {
    position: fixed;
    top: 42px;
    width: 300px;
    height: 55%;
    display: none;
    background: #63C947;
    z-index: 1001;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    overflow-y: auto;
}

.oc-sino {
    right: 100px;
}

.oc-profile {
    right: 50px;
}

.hanburguer-button {
    background: #63C947;
    border: 0 !important;
    display: none;
}

.responsive-nav {
    display: none;
}

.oc-nav-principal {
    padding-right: 0 !important;
    padding-left: 10% !important;
    font-size: 1.3em;
    font-weight: 300 !important;
    font-family: 'ocUniviaMedium';
}

.oc-nav-principal:hover {
    color: #63C947;
}

.oc-nav-principal-focus {
    color: #7569DE;
    padding-right: 0 !important;
    padding-left: 10% !important;
    font-size: 1.3em;
    font-weight: 300 !important;
    font-family: 'ocUniviaMedium';
}

.oc-toggle-navbar {
    display: none;
}
/*  ==========================FIM===============================*/

/*  REMOVE PADDING DAS UI-G */
.remove-padding-bt-tp {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.remove-padding-lt-rt {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.remove-padding-lt {
    padding-left: 0 !important;
}

.remove-padding-rt {
    padding-right: 0 !important;
}

/*  ==========================FIM===============================*/
.alingIMG {
    text-align: left;
}

/* CLASSES DO DROP DOWN  NOTIFICACAO E PERFIL*/
.label-notification {
    font-size: 10px;
    display: block;
    font-weight: 500;
    margin-bottom: 0;
    color: white;
}

.oc-notificacao {
    color: #7569DE;
    width: 100%;
}

.oc-notificacao-hover {
    background: #7569DE;
    cursor: pointer;
    color: #63C947;
    width: 100%;
}

.oc-link-perfil {
    color: #c7c4c4;
    padding: 11px;
}

.oc-link-perfil-focus {
    color: #7569DE;
    padding: 11px;
    cursor: pointer;
}

.oc-link-perfil:hover {
    color: #63C947;
}

.oc-link-perfil-focus:hover {
    color: #63C947;
}

.divBusca {
    margin-left: 1.8%;
}

/*  ==========================FIM===============================*/
.ver-mais-click {
    text-align: center;
    text-align: left;
    color: #63C947;
    font-size: 9px;
    cursor: pointer;
}

.ver-menos-click {
    text-align: center;
    text-align: left;
    color: #63C947;
    font-size: 9px;
    display: none;
    cursor: pointer;
}

.botaoRoxoPequeno {
    background: #7569de !important;
    font-size: 12px !important;
    padding: 0;
}

.repeat-jogos {
    font-size: 12px;
    justify-content: flex-end;
    border-radius: 14px;
    background: #FCFCFC;
    height: 110px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    margin-right: 3em;
    margin-top: 10px;
}

.oc-box-long {
    justify-content: flex-end;
    border-radius: 14px;
    border: 0;
    height: 100px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    margin-right: 2em;
    margin-bottom: 2em;
    background: #FCFCFC;
    padding: 1.5em !important;
    padding-top: 1.5em !important;
    padding-bottom: 1.5em !important;
}

.valor-estatistica {
    color: #63c947;
    text-align: right;
}

.ver-mais {
    display: none;
}

.oc-h3-grande {
    margin: 0;
    color: #7569DE;
    font-size: 15px;
    width: 100%;
    font-size: 30px;
    font-weight: 400;
    margin-bottom: 2vh;
}

.box-img {
    background: #ffffff;
    height: 65px;
    display: flex;
    border-radius: 7px;
    overflow: hidden;
    width: 65px !important;
    padding: 0 !important;
    text-align: center;
    box-shadow: 0 0 1px 0 #dbdbdb;
    align-items: center;
}

a:hover {
    text-decoration: none;
}

.oc-h3-pequeno {
    margin: 0;
    color: #7569DE;
    font-size: 15px;
    width: 100%;
    font-size: 18px;
}

.unbreakCollumnTitle {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 12px;
    max-height: 24px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.unbreakCollumn {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 16px;
    word-break: break-word;
    max-height: 47px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.unbreakCollumn2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 16px;
    max-height: 16px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.abrevia__noticia--descricao {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 18px;
    max-height: 77px;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.abrevia__noticia--titulo {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 18px;
    max-height: 47px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.margin-entre-campos {
    padding: .5em;
}

.header__atleta--mobile {
    display: none;
}

.table__atletas {
    padding: 8px 16px 8px 31px !important;
    height: 69px;
    background: #fcfcfc;
    border-radius: 10px;
    margin-bottom: 11px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}

.margin__right--20px {
    margin-right: 20px;
}

.menu__icon-align {
    width: 26px !important;
    height: 26px !important;
    display: flex !important;
    align-items: center !important;
}

.hoverVermelho {
    color: #c7c4c4;
}

.hoverVermelho:hover {
    color: red;
}

.hoverConfigSvg:hover {
    content: url("/fonts/img/config-verde.svg");
}

/* estilos da pagina de cadastro online de times */
.inputSecret {
    width: 400px;
    margin: auto;
    position: absolute;
    top: calc(50% - 7px);
    left: calc(50% - 200px);
}

.h3CadastroEquipe {
    text-align: center;
    font-family: "ocUniviaBlack";
    font-size: 40px;
    margin: 0;
    color: #7569DE;
    width: 100%;
    font-weight: 400;
    margin-bottom: 2vh;
}

.boxStepCadastroOnline {
    width: 54%;
    position: absolute;
    top: 20%;
    overflow: hidden;
    right: calc(50% - 27%);
    background: white;
    height: 450px;
    display: flex;
    box-shadow: 0px 7px 9px 7px rgba(0, 0, 0, 0.1);
}

.stepLayout {
    position: absolute;
    height: 100%;
    width: 400%;
    left: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    transition: all 0.6s;
}

.stepBlock {
    flex-grow: 0;
    width: calc(100%/ 4);
    position: relative;
    height: inherit;
    float: left;
    padding-right: 80px;
    padding-left: 80px;
    min-height: 100%;
    padding-top: 80px;
}

.stepOne {
    transition: all 0.3s;
    left: -100%;
}

.stepTwo {
    transition: all 0.3s;
    left: -200%;
}

.stepSenha {
    transition: all 0.3s;
    left: -300%;
}

.titulosAvisos {
    text-align: center;
    top: 15%;
    position: absolute;
    width: 60%;
    margin-left: 20%;
    margin-right: 20%;
    font-size: 31px;
    font-family: 'ocUniviaBlack';
}

.headerAling {
    margin-left: 33px;
    height: 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menuOpen {
    transition: all 0.3s;
    display: inherit;
    left: 0;
}

.menuClose {
    transition: all 0.3s;
    left: -222px;
}

.stepBack {
    height: 50px;
    width: 135px;
    margin: 0 5px;
    background: white;
    position: absolute;
    bottom: 20px;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.4);
    color: #7569de;
    left: 80px;
    border-radius: 5px;
    border: 1px solid #7569de;
    display: flex;
    align-items: center;
    padding: 0 18px;
    display: flex;
    justify-content: space-between;
    transition: all 0.3s;
}

.stepFinish {
    height: 50px;
    width: 135px;
    margin: 0 5px;
    background: #FE6845;
    position: absolute;
    bottom: 3%;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.4);
    color: white;
    right: 80px;
    border-radius: 5px;
    border: 1px solid #FE6845;
    display: flex;
    align-items: center;
    padding: 0 18px;
    display: flex;
    justify-content: space-between;
    transition: all 0.3s;
}

.stepFinish:hover {
    color: white;
    transition: all 0.4s;
    transform: scale(1.05);
}

.stepFinish:focus {
    color: white;
    transition: all 0.4s;
    transform: scale(0.9);
    box-shadow: 0px 5px 15px 0px #FE6845;
    outline: none;
}

.stepFinishAtleta {
    height: 50px;
    width: 200px;
    margin: 0 5px;
    background: #FE6845;
    position: absolute;
    bottom: 3%;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.4);
    color: white;
    right: 80px;
    border-radius: 5px;
    border: 1px solid #FE6845;
    display: flex;
    align-items: center;
    padding: 0 18px;
    display: flex;
    justify-content: space-between;
    transition: all 0.3s;
}

.stepFinishAtleta:hover {
    color: white;
    transition: all 0.4s;
    transform: scale(1.05);
}

.stepFinishAtleta:focus {
    color: white;
    transition: all 0.4s;
    transform: scale(0.9);
    box-shadow: 0px 5px 15px 0px #FE6845;
    outline: none;
}

.stepReturn {
    height: 50px;
    width: 135px;
    margin: 0 5px;
    background: #FE6845;
    position: absolute;
    bottom: 3%;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.4);
    color: white;
    left: 80px;
    border-radius: 5px;
    border: 1px solid #FE6845;
    display: flex;
    align-items: center;
    padding: 0 18px;
    display: flex;
    justify-content: space-between;
    transition: all 0.3s;
}

.stepReturn:hover {
    color: white;
    transition: all 0.4s;
    transform: scale(1.05);
}

.stepReturn:focus {
    color: white;
    transition: all 0.4s;
    transform: scale(0.9);
    box-shadow: 0px 5px 15px 0px #FE6845;
    outline: none;
}

.stepNext {
    height: 50px;
    width: 135px;
    margin: 0 5px;
    background: #7569de;
    position: absolute;
    bottom: 3%;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.4);
    color: white;
    right: 80px;
    border-radius: 5px;
    border: 1px solid #7569de;
    display: flex;
    align-items: center;
    padding: 0 18px;
    justify-content: space-between;
    transition: all 0.3s;
}

.stepBack:hover {
    color: #7569de;
    transition: all 0.4s;
    transform: scale(1.05);
}

.stepBack:focus {
    color: #7569de;
    transition: all 0.4s;
    transform: scale(0.9);
    box-shadow: 0px 5px 15px 0px #7569DE;
    outline: none;
}

.stepNext:active {
    transform: scale(0.8);
}

.stepNext:hover {
    color: white;
    transition: all 0.4s;
    transform: scale(1.05);
}

.stepNext:focus {
    color: white;
    transition: all 0.4s;
    transform: scale(0.9);
    box-shadow: 0px 5px 15px 0px #7569DE;
    outline: none;
}

.numberSteps {
    color: #63c947;
    font-size: 50px;
    position: absolute;
    top: 15px;
    left: 40px;
    font-family: 'ocUniviaBlack';
}

.locale {

}

.subH3 {
    color: #63c947;
    font-family: 'ocUniviaBlack';
    font-size: 25px;
}

.tituloChamativo {
    color: #fe6845;
    font-family: 'ocUniviaBlack';
    text-align: center;
    font-size: 40px;
}

.spanEquipeOnline {
    position: absolute;
    width: 100%;
    text-align: center;
    color: #ffffff;
    background: #7569de;
    height: 19px;
    right: 0;
    border-radius: 0px 0px 14px 14px;
    bottom: 0;
    font-family: 'ocUniviaBook';
}

.onlineReprova {
    color: white;
    background: red;
    font-size: 11px;
    position: absolute;
    top: 60px;
    right: 110px;
    padding: 8px;
    border-radius: 12px;
}

.onlineAprova {
    color: white;
    background: #63c947;
    font-size: 11px;
    position: absolute;
    top: 60px;
    left: 100px;
    padding: 8px;
    border-radius: 12px;
}

.onlineReprova:hover {
    color: white;
    box-shadow: 1px 1px 9px 0px red;
}

.onlineAprova:hover {
    color: white;
    box-shadow: 1px 1px 9px 0px #63c947;
}

.onlineReprova:active {
    color: white;
    box-shadow: 1px 1px 9px 0px red;
}

.onlineAprova:active {
    color: white;
    box-shadow: 1px 1px 9px 0px #63c947;
}

/* _____________________________________________________________________________________________ */
@media screen and (max-width: 1024px) {
    .remove-label {
        display: none;
    }
    .display-icon-home {
        display: inline;
    }
    .ui-g-10 {
        width: 100%;
    }
    .btn-oc-df {
        width: 40%;
    }
    .margin__right--20px {
        margin-right: 15px;
    }
    .divBusca {
        margin-left: 0%;
    }
}

@media screen and (max-width: 769px) {
    .margin__right--20px {
        margin-right: 0;
    }
    .oc-nav-principal {
        text-align: center;
        padding-left: 0 !important;
    }
    .oc-nav-principal-focus {
        text-align: center;
        padding-left: 0 !important;
    }
    .oc-toggle-navbar {
        display: inline;
    }
    .alingIMG {
        text-align: center;
    }
    .width__45 {
        width: 100%;
        margin-right: 0 !important;
    }
}

@media screen and (max-width: 766px) {
    .suporteMenu {
        color: green;
        font-size: 71px;
    }
    .inputSecret {
        width: 100%;
        position: initial;
    }
    .stepFinishAtleta {
        width: 210px;
        position: inherit;
        float: right;
    }
    .messagens {
        position: absolute !important;
        width: 90% !important;
        top: 59% !important;
        left: 5% !important;
        right: 5% !important;
    }
    .head__atleta {
        display: none;
    }
    .header__atleta--mobile {
        display: block;
        color: #63C947;
        padding: 3px 8px;
    }
    .left__mobile {
        text-align: left !important;
    }
    .right__mobile {
        text-align: right !important;
    }
    .divBusca {
        margin: 0;
    }
    .oc-side-menu {
        display: none;
    }
    .oc-img-header {
        text-align: center;
    }
    .ui-md-11 {
        width: 100% !important;
    }
    .center-align {
        text-align: center;
    }
    .btn-oc-df {
        width: 100%;
    }
    .oc-h3-grande {
        font-size: 30px;
    }
    .div-colapse-menu {
        right: 0 !important;
        position: fixed;
        height: 100%;
        width: 100%;
        -webkit-box-shadow: 0px 0px 0px #828282;
        top: 49px;
    }
    .div-colapse-menu-profile {
        right: 0 !important;
        position: fixed;
        height: 100%;
        width: 100%;
        box-shadow: 0 !important;
        -webkit-box-shadow: 0px 0px 0px #828282;
        top: 55px;
    }
    .oc-sino {
        right: 50px;
    }
    .oc-profile {
        right: 10px;
    }
    .hanburguer-button {
        background: transparent;
        color: white;
        border: 0 !important;
        display: inline;
        text-align: left;
    }
    .responsive-nav {
        display: inline;
    }
    .icons-drop {
        position: unset;
        margin-top: -6px;
    }
    .icons-drop-selected {
        position: unset;
        text-align: right;
        margin-top: -6px;
    }
    .navbar-items-style>li>a {
        width: 100%;
        font-size: 25px;
        color: #c7c4c4 !important;
        font-family: 'ocUniviaMedium';
    }
    .navbar-items-style>li>a:hover {
        font-family: 'ocUniviaMedium';
        color: #63C947 !important;
    }
    .navbar-items-style>li>a:active {
        font-family: 'ocUniviaMedium';
        color: #7569DE !important;
    }
    .menu-navbar {
        background: white;
        position: fixed;
        height: 100%;
        padding-left: 10vw;
        padding-right: 10vw;
        text-align: left;
        width: 100%;
        left: -100%;
        display: none;
    }
    .remove-padding-lt-rt-responsive {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .center {
        text-align: center;
    }
    .oc-box-camp {
        margin-right: 0;
    }
    .cardEmpty {
        margin-right: 0;
    }
    .meus-favoritos {
        display: none;
    }
    .pc-check-box {
        margin-left: 14%;
    }
    .buttonPlus {
        width: 15% !important;
    }
    .responsive-padding {
        padding-left: 3vw !important;
        padding-right: 3vw !important;
    }
    .checkPadding {
        padding-top: 3px;
    }
    .checkPadding2 {
        padding-top: 3px;
    }
    .botaoPequenoPadding {
        padding-top: 3px;
    }
    .botaoRoxoPequeno {
        width: 100%;
    }
    .borderLeft {
        border: 0;
    }
    .boxStepCadastroOnline {
        width: 96%;
        position: absolute;
        top: 55px;
        overflow: hidden;
        right: calc(50% - 48%);
        background: white;
        height: calc(100% - 55px);
        display: flex;
        box-shadow: 0px 7px 9px 7px rgba(0, 0, 0, 0.1);
        overflow-y: scroll;
    }
    .stepBlock {
        flex-grow: 0;
        min-height: 100%;
        width: calc(100%/ 4);
        position: relative;
        float: left;
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 70px;
    }
    .stepReturn {
        margin-left: 7px;
        float: left;
        position: initial;
        margin-top: 15%;
    }
    .stepNext {
        margin-right: 7px;
        float: right;
        position: initial;
        margin-top: 15%;
    }
    .stepAbsolute {
        position: absolute !important;
        right: 10px;
        margin: 0;
    }
    .stepBack {
        left: 10px;
    }
    .stepFinish {
        right: 10px
    }
}

@media screen and (max-width: 660px) {
    .placeHolder {
        margin-left: -20vw;
    }
    .cardEmpty {
        width: 100%;
    }
}

.closeElement {

}

@media screen and (max-width: 830px) {
    .closeElement {
        display: none;
    }
    .compartilhar {
        position: inherit !important;
    }
    .whatsapp-share-button {
        position: inherit !important;
    }
    .wppClass {
        transition: all .4s;
        position: fixed;
        bottom: 12px;
        right: 8px;
        color: #34af23;
        font-size: 40px;
        z-index: 9999;
    }
    .none {
        display: none;
    }
    .abreviacao__mobile {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        font-size: 13px;
        line-height: 16px;
        max-height: 32px;
        word-break: break-word;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        margin-bottom: 7px;
        letter-spacing: -0.1px;
        -webkit-line-clamp: 2;
    }
}

/* FIM MEDIA */
.ribbon-wrapper-green {
    width: 85px;
    height: 88px;
    overflow: hidden;
    position: absolute;
    top: -3px;
    right: -3px;
}

.fitaEsperando {
    font-family: 'ocUniviaBlack';
    color: white;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    position: relative;
    padding: 7px 0;
    left: -5px;
    top: 15px;
    width: 120px;
    background: linear-gradient(123deg, rgba(156, 105, 222, 1) 0%,
        rgba(117, 105, 222, 1) 58%);
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.fitaEsperando:before, .fitaEsperando:after {
    content: "";
    border-top: 3px solid #7569de;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: -3px;
}

.fitaEsperando:before {
    left: 0;
}

.fitaEsperando:after {
    right: 0;
}

.fitaWarn {
    font-family: 'ocUniviaBlack';
    color: white;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    position: relative;
    padding: 7px 0;
    left: -5px;
    top: 15px;
    width: 120px;
    background: linear-gradient(123deg, rgba(230, 177, 77, 1) 0%,
        rgba(277, 100, 69, 1) 100%);
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.fitaWarn:before, .fitaWarn:after {
    content: "";
    border-top: 3px solid #FE6845;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: -3px;
}

.fitaWarn:before {
    left: 0;
}

.fitaWarn:after {
    right: 0;
}

.fitaAtivo {
    font-family: 'ocUniviaBlack';
    color: white;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    position: relative;
    padding: 7px 0;
    left: -5px;
    top: 15px;
    width: 120px;
    background: url(/principal/home.png) no-repeat 100% 100%;
    background-size: 100% 100%;
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.fitaAtivo:before, .fitaAtivo:after {
    content: "";
    border-top: 3px solid #63C947;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: -3px;
}

.fitaAtivo:before {
    left: 0;
}

.fitaAtivo:after {
    right: 0;
}

.fitaReprovada {
    font-family: 'ocUniviaBlack';
    color: white;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    position: relative;
    padding: 7px 0;
    left: -5px;
    top: 15px;
    width: 120px;
    background: red;
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.fitaReprovada:before, .fitaReprovada:after {
    content: "";
    border-top: 3px solid red;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    position: absolute;
    bottom: -3px;
}

.fitaReprovada:before {
    left: 0;
}

.fitaReprovada:after {
    right: 0;
}