html{
    height: 100%;
}

body{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.fullHeightWithHeader{
	height: calc(100vh - 80px);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

main{
    flex: 1;
}

.inputNumber{
	width: 2.375rem;
}

.formConfirmCode .btn svg{
	display: none;
}

.formConfirmCode .btn.btn-outline-success svg{
	display: block;
}

#passwordInfoList {
    padding: 0;
    list-style-type: none
}

.PasswordInfoListItem {
    position: relative;
    padding-left: 20px
}

.PasswordInfoListItem:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0px;
    color: inherit;
    height: 100%;
    width: 16px;
    background-image: urL(../../imgs/close-16-r.svg);
    background-position: center;
    background-repeat: no-repeat;
}

.PasswordInfoListItem.text-success:before {
    background-image: url(../../imgs/ok-16-v.svg);
}

#formCreatePassword [name='confirmPassword'].border-danger{

    background-repeat: no-repeat;
    background-size: 16px;
    background-position: right 10px center;
}

#formCreatePassword [name='confirmPassword'].border-danger {
    background-image: url(../../imgs/close-16-r.svg);
}

.btn label{
    pointer-events: none;
}

.pointer{
    cursor: pointer;
}

.imgProfileType{
    width: 96px;
    height: 96px;
    background-repeat: no-repeat;
    background-position: center;
}

#linkEntity .imgProfileType{
    background-image: url(../../imgs/clinic-off.png);
}

#linkEntity:hover .imgProfileType{
    background-image: url(../../imgs/clinic-on.png);
}

#linkProfessional .imgProfileType{
    background-image: url(../../imgs/doctor-off.png);
}

#linkProfessional:hover .imgProfileType{
    background-image: url(../../imgs/doctor-on.png);
}

#linkEntity:hover, #linkProfessional:hover{
    border-color: rgba(var(--cx-primary-rgb),var(--cx-border-opacity))!important;
}

#linkEntity label, #linkProfessional label{
    color:#CBCFDA;
}

#linkEntity:hover label, #linkProfessional:hover label{
    color:inherit
}

.clickable, .clickable *,.pointer{
    cursor: pointer;
}

.smallLogo,.smallPhoto{
    width: 80px;
}

.videoValidation,.canvasPreview,.explainPhoto img{
    max-width: 100%;
    max-height: 480px;
}

#containerFront,#containerBack,#containerSelfie,#canvasFront,#canvasBack,#canvasSelfie,.camera,.containerButtonsPhoto, .explainPhoto{
    display: none;
}

#containerFront.explain, #containerFront.explain .explainPhoto, #containerFront.taking, #containerFront.taking .camera, #containerFront.taken, #containerFront.taken .canvasPreview, #containerFront.taken .containerButtonsPhoto,
#containerBack.explain, #containerBack.explain .explainPhoto, #containerBack.taking, #containerBack.taking .camera, #containerBack.taken, #containerBack.taken .canvasPreview, #containerBack.taken .containerButtonsPhoto,
#containerSelfie.explain, #containerSelfie.explain .explainPhoto, #containerSelfie.taking, #containerSelfie.taking .camera, #containerSelfie.taken, #containerSelfie.taken .canvasPreview, #containerSelfie.taken .containerButtonsPhoto {
    display: flex;
}


.rotate-90{
    transform: rotate(90deg);
}

@media (min-width: 420px){
	#boxConfirmCodes{
		min-width: 416px;
	}
}

@media (max-width: 420px){
	.formConfirmCode > .d-flex{
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.formConfirmCode .btn{
		margin-top: .5rem;
		width: 100%;
	}
}