body {
		
    background-color: #c1c1c1;
  
  }
  .heading-grid_pd{
      height:   530px;
      padding: 7% 0% 0% 36%;
      font-size: 205px;
      letter-spacing: -5px;
      animation: myfirst 5s 2;
        animation-direction: alternate;
  }
  .center {
    margin: auto;
    width: 50%;
    padding: 10px;
  }
  .Div3 {
      width: 40%;
      background-color: #4950579e;
      /* border: 2px solid #333; */
      min-height: 100px;
      position: relative;
      right: 10px;
      bottom: 2px;
      text-align: center;
      align-items: center !important;
      z-index: 10000;
  }


  .clr-wht, .active-tabs{
      color: white !important;
  }
  .pad-footer-tabs{
      padding: 10% 0% 10% 8%;
      color: #8e8e8e;
  }
  .pad-footer-tabs > a{
    cursor: pointer;

  }

  .card-modified{
      background-color: #fff0 !important;
      border: none !important;
      border-radius: 0px !important;
  }
  .bottom-left {
    position: absolute;
    top: 45%;
    left: 10%;
    font-size: 30px;
    line-height: initial;
    color: white;
    z-index: inherit;
  }
  

  .img-pics-container img {
    display: block;
    transition: transform .7s;   /* smoother zoom */
  }

  .img-pics-container:hover img {
    transform: scale(1.1);
    color: linear-gradient(to right, #c1c1c1 50%, black 50%);
    transform-origin: 50% 50%;
   
  }

       img.card-img-top:hover ~ div.bottom-left {
            color: black;
          
          }

  .img-pics-container{
      /*display: inline-block;*/
      overflow: hidden;
  }
  @media (min-width: 360px) and (max-width: 780px) {
    .Div3{
        display: none;
    }
    .heading-grid_pd{
        height: 290px;
        font-size: 110px;
    }
  }
  @media screen and (max-width: 360px) {
    .heading-grid_pd{
        height: 240px;
        font-size: 78px;

    }
    .Div3{
        display: none;
    }
  }