/* Show More Button in About Page 

.desc {
    position: relative;
    height: 210px;
    overflow: hidden;
}

.desc.readingMore {
    height: auto;
}
.desc+.readMore .readMore, .desc.readingMore+.readMore .readLess {
    display: block;
}
.desc+.readMore .readLess, .desc.readingMore+.readMore .readMore {
    display: none;
}



.readMore {
    background-color: #a4c639;
	color: #fff;
	font-size: 13px;
	text-transform: uppercase;
	font-weight: 700;
	padding: 2px 2px;
	border-radius: 20px;
	display: inline-block;
	transition: all 0.3s;
    margin-top: 7px;
}

.more-info .right-content span {
    margin-bottom: 10px;
}

.readMore:hover{
    background-color: #fff;
	color: #a4c639;
}

.readLess{
    background-color: #a4c639;
	color: #fff;
	font-size: 13px;
	text-transform: uppercase;
	font-weight: 700;
	padding: 2px 2px;
	border-radius: 20px;
	display: inline-block;
	transition: all 0.3s;
    margin-top: 7px;
}

.readLess:hover{
    background-color: #fff;
	color: #a4c639;
}

.col {
    width: 85%;
    display: inline-block;
   padding-left: 0;
   text-align: left;
} */

/*** What we deals with ***/

.whatwedeals {
    height: 135vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background-color: #fff;
   /* background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%); */
}
.wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.tt-box {
    font-family: inherit;
    margin: 0 0 0.75em 0;
    text-align: center;
    padding-top: 20px;
    font-size: 18px;
}
.box {
    display: block;
    min-width: 300px;
    height: 300px;
    margin: 10px;
    background-color: white;
    border-radius: 5px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    overflow: hidden;
}
.stt-box {
    position: relative;
    height: 100%;
    cursor: pointer;
    overflow: hidden;
    text-align: center;
    transition: background-color ease-in-out 150ms;
}

@media (max-width:766px) {
    .table-text {
      
    }
}



#bg1 {
    background: url("../images/procuring_all_\ kinds_of_\ scraps.png");
    background-size: cover;
}
#bg2 {
    background: url("../images/machinery_scraps.png");
    background-size: cover;
}
#bg3 {
    background: url("../images/manpower_contracts.png");
    background-size: cover;
}
#bg4 {
    background: url("../images/vehicles.PNG");
    background-size: cover;
}
#bg5 {
    background: url("../images/cranes_earthmoving.png");
    background-size: cover;
}
#bg6 {
    background: url("../images/forklifts.png");
    background-size: cover;
}
.img-box {
    height: 225px;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-image: url("");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.img-box::after {
    position: relative;
    font-size: 4.5em;
    color: rgba(230, 230, 230, 1);
    top: calc(50% - 3rem);
    left: calc(50% - 2.25rem);
    z-index: 0;
}

@media (max-width:766px) {
    .whatwedeals{
        height:270vh;
    }
}


/*** Where we procuring scraps ***/

#bg7 {
    background: url("../images/daimler.png");
    background-size: cover;
}

#bg8 {
    background: url("../images/ramky.png");
    background-size: cover;
}

#bg9 {
    background: url("../images/saint_gobain.png");
    background-size: cover;
}

#bg10{
    background: url("../images/modine.png");
    background-size: cover;
}

#bg11{
    background: url("../images/eta_engineering.png");
    background-size: cover;
}

#bg12{
    background: url("../images/korea_fuel.png");
    background-size: cover;
}

/* Align Table */
.table-text{
    text-align: center;
    line-height: 46px;
    font-weight: 900;
    margin: 0 0 30px;
    font-size: 36px;
   }
   
   table.center{
     margin-left: auto;
     margin-right: auto;
     font-size:20px;
   }
   
   table th,td{
     padding: 8px;
     border-bottom: 1px solid #ddd;
   }
   
   table td{
     color: #70a13c;
   }
   
   .center .fa{
     color: #70a13c;
     margin-right: 10px;
   }

/*** Gallery ***/

.gallery {
  min-height: 100%;
}

.gallery{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 2rem;
  margin: 0 auto;
  max-width: 1200px;
  padding: 2rem 1rem;
  background-color: #a4c639;
}

.card {
  padding: 0.9rem;
  border-radius: 4px;
  background-color: #fff;
  transition: transform 300ms ease-in;
  box-shadow: 
    0 1px 1px hsl(0deg 0% 0% / 0.075),
    0 2px 2px hsl(0deg 0% 0% / 0.075), 0 4px 4px hsl(0deg 0% 0% / 0.075),
    0 8px 8px hsl(0deg 0% 0% / 0.075), 0 16px 16px hsl(0deg 0% 0% / 0.075);
}

.card:focus {
  outline: 2px solid #1D4ED8; 
}

.card-wrapper {
  position: relative;
  overflow: hidden;
}

.card-wrapper img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: bottom;
  border-radius: 3px;
  transition: transform 500ms linear;
}

.card-wrapper:hover img {
  transform: scale(1.1);
}

.hidden-cover {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scaleY(0);
  transition: transform 250ms ease-in;
  background: linear-gradient(transparent 5%, hsl(0, 0%, 5%, 0.6));
  transform-origin: top;
  will-change: transform;
}

.card-wrapper:hover .hidden-cover {
  transform: scaleY(1);
}

.card-wrapper h4 {
  position: absolute;
  z-index: 1;
  bottom: 0px;
  right: 2rem;
  font-size: 20px;
  padding: 0.3rem 0.8rem;
  border-radius: 4px;
  overflow: hidden;
  font-family: "Oswald";
  color: hsl(0, 0%, 100%);
  text-transform: uppercase;
  letter-spacing: 2px;
  transform: translateY(100%);
  transform-origin: bottom;
  transition: transform 250ms ease-out;
  will-change: transform;
  left: 0;
}

.card-wrapper:hover h4 {
  transform: translateY(-2rem);
}

.facility-header{
    margin-top: 30px;
}

.card-wrapper h5 {
    position: absolute;
    z-index: 1;
    bottom: -25px;
    right: 2rem;
    font-size: 15px;
    padding: 0.3rem 0.8rem;
    border-radius: 4px;
    overflow: hidden;
    font-family: "Oswald";
    color: #a4c639;
    text-transform: uppercase;
    letter-spacing: 2px;
    transform: translateY(100%);
    transform-origin: bottom;
    transition: transform 250ms ease-out;
    will-change: transform;
    left: 0;
  }
  
  .card-wrapper:hover h5 {
    transform: translateY(-2rem);
  }