.hr-management-container {
    padding: 94px 24px;
}

.hr-management-row1 {
    margin-bottom: 24px;
}

.hr-management-row1-title {
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 8px;
}

.homepage-h1 {
    font-weight: 700;
    font-size: 48px;
    margin-bottom: 8px;
}


.hr-management-row2 {
    font-weight: 400;
    font-size: 14px;
    color: #475569;
    margin-bottom: 24px;
}

.strengths {
    margin-bottom: 24px;
}

.strengths li{
    vertical-align: top;
    margin-bottom: 16px;
    display:inline-block;
    width: 275px;
}

.employee-attendance {
    background: url('../images/homepage/employee-attendance.png') no-repeat;
    background-size: 48px 48px;
    padding-left: 48px;
}

.hr-management-title {
    font-weight: 500;
    font-size: 14px;
    color: #1E293B;
    padding-top: 6px;
}

.hr-management-subtitle {
    font-weight: 500;
    font-size: 12px;
    color: #64748B;
    padding-bottom: 6px;
}

.leave-management {
    background: url('../images/homepage/leave-management.png') no-repeat;
    background-size: 48px 48px;
    padding-left: 48px;
}

.teams-management {
    background: url('../images/homepage/teams-management.png') no-repeat;
    background-size: 48px 48px;
    padding-left: 48px;
}

.hr-management {
    background: url('../images/homepage/hr-management.png') no-repeat;
    background-size: 48px 48px;
    padding-left: 48px;
}

.spacer {
    margin-right: 16px;
}

.hr-management-row4-right {
    font-weight: 600;
    font-size: 12px;
    color: #475569;
}

.hr-management-row4-left {
    font-weight: 400;
    font-size: 12px;
    color: #475569;
}

.hr-management-get-started-btn {
    width: 300px;
    height: auto;
    border-radius: 6px;
    padding: 16px 24px;
    border: #3B82F6;
    background-color: #3B82F6;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    color: #FFFFFF;
    display: inline-block;
    margin-top: 8px;
}

.choose-vonstaff-container{
    padding: 92px 48px;
    justify-content: center;
}

.choose-vonstaff-row1 {
    margin: 0 auto;
    margin-bottom: 48px;
}

.choose-vonstaff-title {
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #475569;
    margin-bottom: 8px;
}


.choose-vonstaff-h2-features {
    text-align: center;
    margin-bottom: 24px;
}

#choose-vonstaff-navbar {
    text-align: center;
    margin-bottom: 24px;
}

#choose-vonstaff-navbar li {
    display:inline-block;
    padding: 12px 0px;
    margin-right: 24px;
}

#choose-vonstaff-navbar a {
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    color: #475569;
}

#choose-vonstaff-navbar li a.active {
    color: #3B82F6;
    padding: 12px 0px;
    border-bottom: 2px solid #3B82F6;
}


.tab-content-choose-vonstaff  {
    display: none;
}

.tab-content-choose-vonstaff:target {
    display: block;
}

.tab-content-choose-vonstaff.active{
    display: block;
}

.choose-vonstaff-description {
    text-align: center;
    font-weight: 400;
    font-size: 14px;
    color: #475569;
    margin: 0 auto;
    margin-bottom: 48px;
}

.choose-vonstaff-row2 {
    margin: 0 auto;
}

.choose-vonstaff-img {
    margin: 0 auto;
    margin-bottom: 32px;
    display: block;
}

.choose-vonstaff-footer {
    margin: 0 auto;
    text-align: center;
}

.choose-vonstaff-get-started {
    font-weight: 600;
    font-size: 12px;
    text-align: center;
    padding: 8px 0px;
    margin-right: 8px;
}

.scheduling-container {
    padding: 96px;
    background: url('../images/homepage/bg-scheduling.png') no-repeat;
}

.scheduling-title{
    font-weight: 500;
    font-size: 14px;
    color: #475569;
    margin-bottom: 24px;
    margin-top: 5px;
}

#scheduling-navbar {
    margin-bottom: 24px;
    margin-left: -32px;
}

#scheduling-navbar li {
    display:inline-block;
    padding: 12px 0px;
    margin-right: 24px;
}

#scheduling-navbar a {
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    color: #475569;
}

#scheduling-navbar  li a.active {
    padding: 12px 0px;
    border-bottom: 2px solid #3B82F6;
    color: #3B82F6;
}

.tab-content-scheduling {
    display: none;
}

  .tab-content-scheduling:target {
    display: block;
}

  .tab-content-scheduling.active{
    display: block;
}

.scheduling-h2-features {
    margin-bottom: 8px;
}

.scheduling-description {
    font-weight: 400;
    font-size: 14px;
    color: #475569;
    margin-bottom: 24px;
}

.scheduling-get-started {
    font-weight: 600;
    font-size: 12px;
    padding: 8px 0px;
    margin-right: 8px;
}

.leave-management-container {
    padding: 96px 48px;
    background-color: #FFFFFF;
    justify-content: center;
}

.leave-management-row1 {
    margin: 0 auto;
}

.leave-management-title {
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #1E293B;
    margin-bottom: 24px;
}

#leave-management-navbar {
    margin-bottom: 24px;
    text-align: center;
}

#leave-management-navbar li {
    display:inline-block;
    padding: 12px 0px;
    margin-right: 24px;
}

#leave-management-navbar a {
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    color: #475569;
}

#leave-management-navbar  li a.active {
    padding: 12px 0px;
    border-bottom: 2px solid #16A34A;
    color: #16A34A;
}

.tab-content-leave {
    display: none;
}

.tab-content-leave:target {
    display: block;
}

.tab-content-leave.active{
    display: block;
}


.leave-management-h2-features {
    text-align: center;
    margin-bottom: 8px;
}

.third-color {
    color: #16A34A;
}

.leave-management-description {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #475569;
    margin: 0 auto;
    margin-bottom: 48px;
}

.leave-management-row2 {
    margin: 0 auto;
}

.leave-management-img {
    margin: 0 auto;
    margin-bottom: 48px;
    display: block;
}

.leave-management-footer {
    margin: 0 auto;
    text-align: center;
}

.leave-management-get-started {
    font-weight: 600;
    font-size: 12px;
    text-align: center;
    padding: 8px 0px;
    margin-right: 8px;
}


.each-content-footer {
    display: inline-block;
    margin-left: 8px;
}

.homepage-arrow-right {
    vertical-align: middle;
}


.manage-employees-container {
    padding: 96px 48px;
    background: url('../images/homepage/bg-manage-employees.png') no-repeat;
}

.manage-employees-title {
    font-weight: 500;
    font-size: 14px;
    color: #1E293B;
    margin-bottom: 24px;
}

#manage-employees-navbar {
    margin-bottom: 24px;
    margin-left: -32px;
}

#manage-employees-navbar li {
    display:inline-block;
    padding: 12px 0px;
    margin-right: 24px;
}

#manage-employees-navbar a {
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    color: #475569;
}

#manage-employees-navbar  li a.active {
    padding: 12px 0px;
    border-bottom: 2px solid #6366F1;
    color: #6366F1
}

.tab-content-teams-employees {
    display: none;
}

  .tab-content-teams-employees:target {
    display: block;
}

  .tab-content-teams-employees.active{
    display: block;
}


.eleventh-color {
    color: #6366F1;
}

.manage-employees-h2-features {
    margin-bottom: 8px;
}

.manage-employees-description {
    font-weight: 400;
    font-size: 14px;
    color: #475569;
    margin-bottom: 24px;
}

.manage-employees-get-started {
    font-weight: 600;
    font-size: 12px;
    padding: 8px 0px;
    margin-right: 8px;
}

.office-management-container {
    padding: 96px 48px;
    background-color: #FFFFFF;
    justify-content: center;
}

.office-management-row1 {
    margin: 0 auto;
}

.office-management-title {
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #1E293B;
    margin-bottom: 24px;
}

#office-management-navbar {
    margin-bottom: 24px;
    text-align: center;
}

#office-management-navbar li {
    display:inline-block;
    padding: 12px 0px;
    margin-right: 24px;
}

#office-management-navbar a {
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    color: #475569;
}

#office-management-navbar  li a.active {
    padding: 12px 0px;
    border-bottom: 2px solid #A855F7;
    color: #A855F7;
}

.tab-content-office {
    display: none;
}

.tab-content-office:target {
    display: block;
}

.tab-content-office.active{
    display: block;
}



.office-management-h2-features {
    text-align: center;
    margin-bottom: 8px;
}

.tenth-color {
    color: #A855F7;
}

.office-management-description {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #475569;
    margin: 0 auto;
    margin-bottom: 48px;
}

.office-management-row2 {
    margin: 0 auto;
}

.office-management-img {
    margin: 0 auto;
    margin-bottom: 48px;
    display: block;
}

.office-management-footer {
    margin: 0 auto;
    text-align: center;
}

.office-management-get-started {
    font-weight: 600;
    font-size: 12px;
    text-align: center;
    padding: 8px 0px;
    margin-right: 8px;
}

.modern-workflows-container {
    padding: 96px 48px;
    background: url('../images/homepage/bg-modern-workflows.png') no-repeat;
}

.modern-workflows-title {
    font-weight: 500;
    font-size: 14px;
    color: #1E293B;
    margin-bottom: 24px;
}

#modern-workflows-navbar {
    margin-bottom: 24px;
    margin-left: -32px;
}

#modern-workflows-navbar li {
    display:inline-block;
    padding: 12px 0px;
    margin-right: 24px;
}

#modern-workflows-navbar a {
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    color: #475569;
}

#modern-workflows-navbar  li a.active {
    padding: 12px 0px;
    border-bottom: 2px solid #0EA5E9;
    color: #0EA5E9;
}

.tab-content-modern-workflows {
    display: none;
}

.tab-content-modern-workflows:target {
    display: block;
}

.tab-content-modern-workflows.active{
    display: block;
}

.sixth-color {
    color: #0EA5E9;
}

.modern-workflows-h2-features {
    margin-bottom: 8px;
}

.modern-workflows-description {
    font-weight: 400;
    font-size: 14px;
    color: #475569;
    margin-bottom: 24px;
}

.modern-workflows-get-started {
    font-weight: 600;
    font-size: 12px;
    padding: 8px 0px;
    margin-right: 8px;
}

.data-protection-container {
    padding: 96px 48px;
    background-color: #FFFFFF;
    justify-content: center;
}

.data-protection-row1 {
    margin: 0 auto;
    margin-bottom: 48px;
}

.data-protection-title {
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    color: #1E293B;
    margin-bottom: 16px;
}

.data-protection-h2-features {
    text-align: center;
    margin-bottom: 16px;
}

.seventh-color {
    color: #10B981;
}

.data-protection-description {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
    color: #475569;
}

.data-protection-img {
    margin: 0 auto;
    margin-bottom: 48px;
    display: block;
}

.data-protection-footer {
    margin: 0 auto;
    text-align: center;
}

.data-protection-get-started {
    font-weight: 600;
    font-size: 12px;
    text-align: center;
    padding: 8px 0px;
    margin-right: 8px;
}

.data-protection-row2 {
    margin: 0 auto;
}


.distance-between-cols {
    margin-bottom: 0px;
}

#errors {
    display: none;
    background-color: #f8d7da;
    border-color: #f5c2c7;
    text-align: left;
    padding: 10px;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 30px;
}

#errors p {
    text-align: left;
    color: #842029;
    margin-bottom: 10px;
}

input.signup-page-box.error {
    border: 1px red solid;
}

select.form-select.error {
    border: 1px red solid;
}