.tp-caption1{z-index: 12;background-color:rgba(0, 0, 0, 0.10);border-color:rgba(0, 0, 0, 0);border-width:0px;}
.tp-caption2{z-index: 13;  white-space: normal;  font-weight: 700;   color: rgba(255, 255, 255, 1.00); border-width:0px;}
.fm-roboto{font-family:'Roboto'}
.slider-bg{background-color:#111111;padding:0px;}
.dnone{display: none;}
.dblock{display: block;}
#dnone{display: none;}
#dblock{display: block;}
.vhidden{visibility: hidden !important;}
.client-logo-carousel img {
    width: 80% !important;
}

.div-modal-content{width: 60% !important;}
.div-modal-content img{width: 100% !important;}
.pf-item.construction ul li {
    list-style: unset;
    display: unset;
}
.owl-dots {
    display: none;
}
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  cursor: zoom-out;
}

.modal-content {
  position: relative;
  max-width: 90%;
  max-height: 100%;
  background: transparent;
  padding: 10px;
  border-radius: 10px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  cursor: default;
  /* overflow-x: scroll; */
}

.modal-image {
  width: 40%;
  /* max-height: 80vh; */
  border-radius: 8px;
  margin: 0 auto;
}

.close-btn {
  position: absolute;
  /* top: 5px; */
  right: 15px;
  font-size: 28px;
  color: #141313;
  cursor: pointer;
  font-weight: bold;
  transition: 0.2s;
  background-color: #fff;
  height: 29px;
  line-height: 15px;
  border-radius: 50%;
  padding: 5px;
}

.close-btn:hover {
  color: red;
}

.logo-header img, .logo-footer img {
    max-width: 100%;
    width: auto;
    height: 90px;
    vertical-align: middle;
    margin-top: 10px;
}
.logo-footer img{height: 113px !important;;}

span.alert-error {
    color: #f00;
    font-weight: normal;
    font-size: 11px;
    display: block;
    width: 100%;
}

.section-head.text-left strong , .section-head.text-left h5{
    color: #f05c28;
    margin-bottom: 10px !important;
    display: block;
}

.career-title h3 {
    color: #000000;
}

.blog-card__date {
    font-weight: bold;
    width: 90px;
    float: left;
    display: grid;
}

.career-title {}

.blog-card__date span:first-child {
    font-size: 60px !important;
    color: #f05b29;
    line-height: 50px;
}

.blog-card__date span:last-child {
    font-size: 22px;
    color: #5a5858;
}

.career-info {
    margin-bottom: 50px;
}

a.btn.btn-primary.apply {background-color: #f05b29;border: solid;}

.contact-items {
    padding: 40px;
    border: solid 1px #6a676647;
    background-color: #dddddd38;
    margin-bottom: 80px;
}

button#submit {
    background-color: #f05b29;
    border: solid #f05b29;
    height: 50px;
    color: #fff;
    font-size: 20px;
    border-radius: 10px !important;
}

/* hide items cleanly for Masonry */
.masonry-item.masonry-hidden {
  display: none !important;
}

/* optional fade animation (remove display:none approach if you want opacity animations) */
.masonry-item {
  transition: opacity 240ms ease;
}
#cover_letter{height: 100px; margin-bottom:20px;;}

/* react-masonry-css base classes */
.my-masonry-grid {
  display: flex;
  margin-left: -16px; /* gutter offset (match column gutter) */
  width: auto;
}
.my-masonry-grid_column {
  padding-left: 16px; /* gutter */
  background-clip: padding-box;
}

/* item spacing inside column */
.my-masonry-grid_column > .masonry-item {
  margin-bottom: 16px;
  width: 100% !important;
}

/* keep images block-level and responsive */
.masonry-item img {
  display: block;
  width: 100%;
  height: auto;
}

/* filter active state */
.masonry-filter li.active > a {
  font-weight: 700;
}

/* optional: hide items via CSS if you prefer (we already filter in React) */
.masonry-item.masonry-hidden { display: none !important; }
.masonry-item {
  transition: transform 400ms ease, opacity 300ms ease;
  will-change: transform, opacity;
}

.client-logo-carousel .owl-nav {display: none;}

.wt-icon-box-wraper img {
    margin-bottom: 5px;
}
.dblock {
    display: block !important;
}
.dnone {
    display: none !important;
}

@media only screen and ( max-width:760px){
.logo-header img, .logo-footer img{height: 65px;}
 
    .header-style-1.active .header-nav .nav > li > a .fa {
         display: block; 
    }
 
}