.setPasswordSection { padding: 10px 0; align-self: left; max-width: 100%; overflow-wrap: break-word; } .checkbox { min-height: 24px; } .checkbox__input { position: absolute; opacity: 0; } .checkbox__label { line-height: 23px; cursor: pointer; color: var(--lightTextColor); } .checkbox__label::before { content: ''; height: 20px; width: 20px; margin-right: 10px; margin-left: 5px; float: left; border: 1px solid rgba(12, 12, 13, 0.3); border-radius: 2px; } .checkbox__input:focus + .checkbox__label::before, .checkbox:hover .checkbox__label::before { border: 1px solid var(--primaryControlBGColor); } .checkbox__input:checked + .checkbox__label { color: var(--textColor); } .checkbox__input:checked + .checkbox__label::before { background-image: url('../assets/check-16-blue.svg'); background-position: 2px 1px; } .checkbox__input:disabled + .checkbox__label { cursor: auto; } .checkbox__input:disabled + .checkbox__label::before { background-image: url('../assets/check-16.svg'); background-repeat: no-repeat; background-size: 18px 18px; border-color: var(--successControlBGColor); background-color: var(--successControlBGColor); cursor: auto; } @media (max-device-width: 520px), (max-width: 520px) { .setPasswordSection { align-self: center; min-width: 95%; } .checkbox__label::before { margin-left: 0; } }