/*------------------------------------
  20. Brand
-------------------------------------*/
.cs_brands.cs_style_1 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    @media (min-width: 1550px) {
      gap: 40px;
    }
    @media (max-width: 991px) {
      &.cs_ml_30,
      &.cs_mr_30 {
        margin: 0;
      }
    }
    @media (max-width: 575px) {
      gap: 20px;
      grid-template-columns: repeat(1, 1fr);
    }
    .cs_brand {
      box-shadow: 0px 10px 60px 0px rgba(23, 20, 78, 0.1);
      transition: all 0.3s ease-in-out;
      p {
        padding: 5px 0;
      }
      &:hover {
        transform: translateY(-8px);
        box-shadow: 0 50px 30px -40px rgba(23, 20, 78, 0.15);
      }
    }

    .cs_brand p span{
      color: #000041;
    }
    .cs_brand_logo_wrap img{
      height: 90%;
      min-width: 50%;
      border-radius: 50%;
    }
    .cs_brand_logo_wrap {
      /* height: 120px; */
        padding: 18px;
        margin: auto;
      @media (max-width: 1199px) {
        height: auto;
        min-width: 50%;
       
        padding: 2px;
        margin: auto;
      }
      padding: 2px;
    }
  }
  .cs_brands.cs_style_1.cs_type_1 {
    grid-template-columns: repeat(5, 1fr);
    @media (max-width: 991px) {
      grid-template-columns: repeat(3, 1fr);
    }
    @media (max-width: 575px) {
      grid-template-columns: repeat(2, 1fr);
    }
    @media (max-width: 380px) {
      grid-template-columns: repeat(1, 1fr);
    }
  }
  
  /*--------------Brand background colors---------------*/
  .cs_brand_bg_1 {
    background-color: #000041;
  }
  .cs_brand_bg_2 {
    background-color: #c2eec1;
  }
  .cs_brand_bg_3 {
    background-color: #ffe9df;
  }
  .cs_brand_bg_4 {
    background-color: #34bc85;
  }
  .cs_brand_bg_5 {
    background-color: #ff3767;
  }
  .cs_brand_bg_6 {
    background-color: #f8d84a;
  }
  
  /*----------Responsive------------*/
  @media only screen and (max-width: 991px) {
  }