.bodyCenter{ display: flex; flex-direction: column; justify-content: space-between; height: 100vh;}

@supports (gap:30px){
    .bodyCenter{ gap: 30px;}
}

@supports not(gap:30px){
    .bodyCenter{ grid-gap: 30px;}
}

.bgRegister{ display: flex; flex-direction: column; justify-content: center;}
.gridForm{ display: grid; grid-template-columns: 1fr 0.7fr; grid-gap: 15px 70px;}

@media (max-width:991px){
    .gridForm{ grid-template-columns: 1fr;}
}

.flexGroup{ display: flex; justify-content: space-between; align-items: flex-start; gap: 15px;}
.flexGroup > span{ flex: 1 0 35%;}
.flexGroup > div{ flex: 1 0 65%;}
.form-group{ margin-bottom: 15px;}
.form-control-back{ border-radius: 50px;}

@media (max-width:768px){
    .flexGroup{ flex-wrap: wrap; gap: 5px 15px;}
    .flexGroup > span{ margin-top: 0 !important; text-align: left !important;}
}

.tel{ display: flex; gap: 15px;}
.tel > :first-child{ flex-grow: 1;}
.tel > :last-child{ flex-basis: 150px;}

.code{ display: flex; align-items: center; jgap: 15px;}
.code img{ max-width: 100%;}
.code button{ color: var(--clRed); width: 40px; height: 40px; border: none;}

.accordion_custom{ border: 1px solid var(--clGray); border-radius: 5px; margin-bottom: 15px; padding: 15px;}

.gridLabel{ display: grid; grid-template-columns: 10px 1fr; align-items: baseline; grid-gap: 15px; cursor: pointer;}
.panelCollapse{ margin-top: 10px; height: 300px; overflow-y: scroll;}
.panelCollapse::-webkit-scrollbar{ width: 5px; background-color: #7D7979;}
.panelCollapse::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;  }
.panelCollapse::-webkit-scrollbar-thumb { background-color:#7D7979;}

.indent{ padding-left: 15px;}
.textIndent{ text-indent: 30px;}

.regisUser{ display: flex; align-items: center; justify-content: center;}
.regisUser button{ background: var(--clRed); padding: 5px 20px; border-radius: 50px; color: var(--clWhite); 
    border: 1px solid var(--clRed);}
.regisUser button:hover{ background: var(--clRedHover); border: 1px solid var(--clRedHover);}
.regisUser button.disable{ cursor: not-allowed; background: var(--clGray); color: var(--clWhitetGray); 
    border: 1px solid var(--clWhitetGray);}

.bgRight{ display: flex; flex-direction: column; margin-top: 50px;}

.social{ display: flex; justify-content: center; flex-wrap: wrap; gap: 15px;}
.social a{ color: var(--clBlackGray);}
.social figure{ text-align: center;}
.social img{ max-width: 50px; text-align: center;}
.social p{ text-align: center;}

.error{
    color: red;
}
.success{
    color: green;
}
.error.help-inline {
    color: red;
}