.career .navbar .nav-link {
 color: var(--white);
}


.career-1 {
 background: var(--dark-grad), url(/img/career.jpg) no-repeat 50% 50%;
 background-size: cover;
 padding: 240px 0px;
}

.career-2 img {
 max-width: 80%;
}

.career-3 {
 background: var(--dark-grad), url(/img/client-bg.png) no-repeat 50% 50%;
 background-size: cover;
 background-attachment: fixed;
}

.career-3 .card {
 background: var(--white);
 height: 220px;
}

.career-3 .card .card-title:nth-child(1) {
 color: var(--primary);
 font-size: 34px;
 font-weight: 600;
}

.career-3 .card:hover .card-title:nth-child(1){
 color: var(--white);
}

.career-3 .card:hover {
 background: var(--primary);
 color: var(--white);
}

.career-4 .job-grid {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 20px;
}

.career-4 .job-grid .card {
 padding: 20px;
}

.career-5 {
 background: var(--dark-grad), url(/img/why-bg.jpg) no-repeat 50% 50%;
 background-size: cover;
}

.career-5 .card {
 display: flex;
 flex-direction: row;
 align-items: center;
 padding: 10px 30px;
}

.career-5 .card:nth-of-type(even) {
 background: var(--primary);
 color: var(--white);
}


.career-5 .card img {
 width: 50px;
 height: 50px;
 object-fit: contain;
}

.career-5 .card .fa {
 font-size: 54px;
 color: var(--primary);
}

.career-6 .card form {
 padding: 30px 10px;
}

.career-6 .card form  button {
 padding: 20px;
}

.career-6 .card form .form-control , .form-select {
 padding: 20px 10px;
}


.career-form-img {
 max-width: 90%;
}

@media screen and (max-width: 992px) {
 .career-4 .job-grid {
  grid-template-columns: 1fr;
 }

 .career-2 img  , .career-form-img {
   max-width: 100%;
}


}