.omc-job-card {
position: relative;
width: 100%;
max-width: 400px;
height: 100%;
background: #ffffff;
box-shadow: 0px 12px 35px rgba(0, 0, 0, 0.08);
margin-inline: auto;
overflow: hidden;
display: flex;
flex-direction: column;
} .omc-card-top {
position: relative;
min-height: 290px;
width: 100%;
} .omc-shapes-layer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
.omc-shape-main,
.omc-shape-badge,
.omc-bottom-white-shape {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} .omc-job-card.right-shape .omc-shape-main {
clip-path: polygon(0 0, 100% 0, 100% 30%, 0 68%);
z-index: 5;
}
.omc-job-card.right-shape .omc-shape-badge {
clip-path: polygon(0 68%, 100% 30%, 100% 100%, 0 90%);
z-index: 2;
}
.omc-job-card.right-shape .omc-bottom-white-shape {
clip-path: polygon(0 0%, 100% 100%, 100% 100%, 0% 100%);
background: #fff;
z-index: 5;
height: 110px;
top: unset;
bottom: 0;
} .omc-job-card.left-shape .omc-shape-main {
clip-path: polygon(0 0, 100% 0, 100% 68%, 0 30%);
z-index: 5;
}
.omc-job-card.left-shape .omc-shape-badge {
clip-path: polygon(0 30%, 100% 68%, 90% 100%, 0 100%);
z-index: 2;
}
.omc-job-card.left-shape .omc-bottom-white-shape {
clip-path: polygon(0 100%, 100% -15%, 100% 100%, 0% 100%);
background: #fff;
z-index: 3;
height: 107px;
top: unset;
bottom: 0;
} .omc-content-layer {
position: relative;
z-index: 5;
padding: 40px 30px;
min-height: 290px;
display: flex;
flex-direction: column;
justify-content: space-between;
box-sizing: border-box;
}
.omc-title-wrapper {
width: 100%;
}
.omc-job-card .omc-job-title {
color: #ffffff;
font-size: 24px !important;
font-weight: 700;
line-height: 1.1;
margin: 0;
position: relative;
z-index: 10;
} .omc-salary-box {
display: flex;
flex-direction: column;
color: #ffffff;
margin-top: auto;
padding-bottom: 40px;
}
.omc-salary-box-info {
position: relative;
z-index: 10;
} .omc-job-card.right-shape .omc-salary-box { text-align: right; }
.omc-job-card.left-shape .omc-salary-box { text-align: left; }
.omc-salary-title {
display: block !important;
font-size: 17px !important;
font-weight: 700;
line-height: 1.1;
margin-bottom: 3px;
}
.omc-salary-val {
font-size: 15px !important;
line-height: 1.1;
} .omc-card-body {
padding: 0 30px 45px 30px;
background: #ffffff;
z-index: 10;
}
.omc-card-body h3 {
font-size: 18px !important;
font-weight: 700;
line-height: 1.1;
color: #111111;
margin: 25px 0 8px 0;
}
.omc-card-body h3:first-child { margin-top: 0; }
.omc-card-body p {
color: #444444;
line-height: 1.6;
margin: 0 0 15px 0;
} .omc-card-bottom {
position: relative;
background: #ffffff;
height: 45px;
width: 100%;
margin-top: auto;
}
.omc-bottom-shape {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #12284C;
clip-path: polygon(0 60%, 100% 0, 100% 100%, 0 100%);
}
@media only screen and (max-width: 1200px) {
.omc-card-top,
.omc-content-layer {
min-height: 250px;
}
.omc-content-layer {
padding: 30px 20px;
}
.omc-salary-box {
padding-bottom: 30px;
}
.omc-card-body {
padding: 0 20px 30px 20px;
}
}