/******************************************
    File Name: custom.css
    Template Name: YourJob
    Created By: PSD Convert HTML Team
    Envato Profile: http://themeforest.net/user/psdconverthtml
    Website: https://psdconverthtml.com
    Version: 1.0
    Support: support@psdconverthtml.com
/******************************************/

.otp h6{
  font-size: 13px;
   font-family: "poppinssemibold", sans-serif;
  font-weight: normal !important;
}


.covid-products img.covid-product-image:hover{
 background-color: #b5a1b7 !important;
 backdrop-filter: grayscale(100%) blur(2px);
}

.grid {
display: grid;
grid-gap: 0;
overflow: hidden;
list-style: none;
margin: 0;
padding: 0;
}
.grid li {
position: relative;
display: inline-block;
}
.grid li:hover ~ li:last-child:after,
.grid li:last-child:hover:after,
.grid li:hover ~ li:last-child:before,
.grid li:last-child:hover:before {
opacity: 1;
transition: 1s ease;
}
.grid li:last-child:after,
.grid li:last-child:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
pointer-events: none;
clip-path: polygon(var(--offset) var(--offset), var(--offset) calc(100% - var(--offset)), calc(100% - var(--offset)) calc(100% - var(--offset)), calc(100% - var(--offset)) var(--offset));
-webkit-clip-path: polygon(var(--offset) var(--offset), var(--offset) calc(100% - var(--offset)), calc(100% - var(--offset)) calc(100% - var(--offset)), calc(100% - var(--offset)) var(--offset));
opacity: 0;
transition: opacity 1s, transform 1s 1s, background 1s;
}
.grid li:last-child:after {
mix-blend-mode: multiply;
background: #aaafc3;
}
.grid li:last-child:before {
backdrop-filter: grayscale(100%) blur(2px);
-webkit-backdrop-filter: grayscale(100%) blur(2px);
}
.grid li:nth-child(1):hover ~ li:last-child:after {
background: #1A237E;
}
.grid li:nth-child(2):hover ~ li:last-child:after {
background: #b5a1b7;
}
.grid li:nth-child(3):hover ~ li:last-child:after {
background: #aaafc3;
}
.grid li:nth-child(4):hover ~ li:last-child:after {
background: #daa384;
}
.grid li:nth-child(5):hover ~ li:last-child:after {
background: #A5D6A7;
}
.grid li:nth-child(6):hover ~ li:last-child:after {
background: #6c4331;
}
.grid li:nth-child(7):hover ~ li:last-child:after {
background: #555;
}
.grid li:last-child:hover:after {
background: #a88504;
}

.grid li:last-child:after,
.grid li:last-child:before {
left: 100%;
transform: translate3d(-100%, -100%, 0);
}
.grid li:nth-child(1):hover ~ li:last-child:after,
.grid li:nth-child(1):hover ~ li:last-child:before {
transform: translate3d(-200%, -200%, 0);
}
.grid li:nth-child(2):hover ~ li:last-child:after,
.grid li:nth-child(2):hover ~ li:last-child:before {
transform: translate3d(-100%, -200%, 0);
}
.grid li:nth-child(3):hover ~ li:last-child:after,
.grid li:nth-child(3):hover ~ li:last-child:before {
transform: translate3d(0%, -200%, 0);
}
.grid li:nth-child(4):hover ~ li:last-child:after,
.grid li:nth-child(4):hover ~ li:last-child:before {
transform: translate3d(-200%, -100%, 0);
}
.grid li:nth-child(5):hover ~ li:last-child:after,
.grid li:nth-child(5):hover ~ li:last-child:before {
transform: translate3d(-100%, -100%, 0);
}
.grid li:nth-child(6):hover ~ li:last-child:after,
.grid li:nth-child(6):hover ~ li:last-child:before {
transform: translate3d(0%, -100%, 0);
}
.grid li:nth-child(7):hover ~ li:last-child:after,
.grid li:nth-child(7):hover ~ li:last-child:before {
transform: translate3d(-200%, 0%, 0);
}
.grid li:last-child:hover:after,
.grid li:last-child:hover:before {
transform: translate3d(-100%, 0%, 0);
}

/*dashboard CSS start*/
.navbar-default .navbar-nav:first-child li.clientname a{
cursor: default;
color: #ffc813;
}
.navbar-default .navbar-nav.navbar-right{
margin-top: 0;
}
.dashboard-client{
display: flex;
flex-wrap: wrap;
color: #18293b;
}
.dashboard-client p{
font-size: 14px;
color: #18293b;
line-height: normal;
}
.dashboard-client strong{
font-size: 22px;
}
.dashboard-client h5{
font-size: 20px;
min-height: 44px;
display: flex;
justify-content: center;
align-items: center;
}
.dashboard-client a{
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
position: relative;
}
.dashboard-client span{
width: 22px;
height: 22px;
background-color: #ff0000;
color: #fff;
border-radius: 50%;
position: absolute;
top: 25px;
left: 53%;
display: flex;
justify-content: center;
align-items: center;
}
.dashboard-client a:hover, .dashboard-client .w-50:hover p, .dashboard-client .w-100:hover p{
color: #000 !important;
}
.dashboard-client .supplier-first{
width: calc(40% - 5px);
margin-right: 5px;
}
.dashboard-client .supplier-first .supplier-check{
display: flex;
}
.dashboard-client .supplier-first .supplier-check h5{
  width: calc(50% - 2.5px);
}
.dashboard-client .supplier-first .first-inner{
display: flex;
flex-wrap: wrap;
}
.dashboard-client .w-50{
width: calc(50% - 2.5px);
background-color: #fdb813;
margin-bottom: 5px;
padding: 8px;
min-height: 205px;
}
.dashboard-client .w-50:first-child{
margin-right: 5px;
}
.dashboard-client .w-50:last-child, .dashboard-client .w-50:nth-last-child(2){
  min-height: 95px;
}
.dashboard-client .w-50:nth-last-child(2){
    margin-right: 5px;
}
.dashboard-client .w-50:last-child a{
  flex-direction: row;
}
.dashboard-client .w-50:last-child a img{
  margin-left: 8px;
}
.dashboard-client .w-100{
width: 100%;
background-color: #fdb813;
margin-bottom: 5px;
padding: 8px;
min-height: 100px;
}
.dashboard-client .w-50:hover, .dashboard-client .w-100:hover{
background-color: #ffbb3d;
}

.dashboard-client .supplier-other{
width: calc(20% - 5px);
margin-right: 5px;
}
.dashboard-client .supplier-other:last-child{
margin-right: 0;
}
.stickyfooter{
  padding: 20px 0 10px !important;
}
@media(min-width: 1440px){
  .dashboard-con{
    width: 1450px;
  }
}
@media(max-width: 991px){
.dashboard-client .supplier-first{
  width: calc(70% - 5px);
}
.dashboard-client .supplier-other{
  width: calc(30% - 5px);
}
}
@media(max-width: 767px){
.dashboard-client h5, .dashboard-client strong{
  font-size: 14px;
}
.dashboard-client p{
  font-size: 12px;
}
.dashboard-client .supplier-first{
  width: 100%;
}
.dashboard-client .supplier-other{
  width: calc(33.33% - 5px);
}
.dashboard-client a img{
  max-width: 30%;
}
.dashboard-client .w-100{
  min-height: 105px;
}
.dashboard-client span{
  width: 18px;
  height: 18px;
  font-size: 11px;
}
}
@media(max-width: 415px){
.dashboard-client span{
  top: 30px;
}
}
/*dashboard CSS end*/

@media (max-width: 60em) {
.grid {
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(4, 25%);
}
.grid li:last-child:after,
.grid li:last-child:before {
  left: 0%;
  transform: translate3d(-50%, -150%, 0);
}
.grid li:nth-child(1):hover ~ li:last-child:after,
.grid li:nth-child(1):hover ~ li:last-child:before {
  transform: translate3d(-100%, -300%, 0);
}
.grid li:nth-child(2):hover ~ li:last-child:after,
.grid li:nth-child(2):hover ~ li:last-child:before {
  transform: translate3d(0%, -300%, 0);
}
.grid li:nth-child(3):hover ~ li:last-child:after,
.grid li:nth-child(3):hover ~ li:last-child:before {
  transform: translate3d(-100%, -200%, 0);
}
.grid li:nth-child(4):hover ~ li:last-child:after,
.grid li:nth-child(4):hover ~ li:last-child:before {
  transform: translate3d(0%, -200%, 0);
}
.grid li:nth-child(5):hover ~ li:last-child:after,
.grid li:nth-child(5):hover ~ li:last-child:before {
  transform: translate3d(-100%, -100%, 0);
}
.grid li:nth-child(6):hover ~ li:last-child:after,
.grid li:nth-child(6):hover ~ li:last-child:before {
  transform: translate3d(0%, -100%, 0);
}
.grid li:nth-child(7):hover ~ li:last-child:after,
.grid li:nth-child(7):hover ~ li:last-child:before {
  transform: translate3d(-100%, 0%, 0);
}
.grid li:last-child:hover:after,
.grid li:last-child:hover:before {
  transform: translate3d(0%, 0%, 0);
}

:root {
  --offset: 0;
}
}
.description {
font-family: "Unica One", sans-serif;
font-size: 1.25rem;
position: absolute;
display: block;
right: 2rem;
left: 2rem;
text-align: center;
top: 50%;
width: 60px;
margin: auto;
color: white;
z-index: 100;
opacity: 0;
transform: translate3d(0, -50%, 0);
transition: 0.3s 0s;
}

li:hover .description {
opacity: 1;
transition: 0.6s 0.3s;
}

.img-thumbnail-1{

display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  line-height: 1.42857143;
}
.all-jobs-wrap{
display: flex;
justify-content: space-between;
flex-wrap:  wrap;
}
.all-jobs-wrap .all-jobs{
border: solid 1px #000;
flex: 0 0 45%;
margin-bottom: 30px;
}
.all-jobs-wrap .job-tab{
padding:  6px 0 0 0;
border-top: solid 12px #febf00;
border-bottom: none;
}
.all-jobs-wrap .job-tab .job-content{
font-size:  14px;
line-height: 18px;
padding-bottom: 10px;
}
.all-jobs-wrap .job-tab .job-content a{
color: #4aa2c2;
}
.all-jobs-wrap .job-tab .post-media{
width: 100%;
min-height: 200px;
}
@media(max-width: 992px){
.all-jobs-wrap .all-jobs{
  flex: 0 0 48%;
}
}
@media(max-width: 767px){
.all-jobs-wrap .all-jobs{
  flex: 0 0 100%;
}
}