
               
.frame-logos {
  background-color: #f9f9e6;
  padding-top: 50px;
  padding-bottom: 100px;
  padding-left: 50px;
  padding-right: 50px;
}
 

.frame-logos .logos-wrapper {
  display: grid;
  grid-template-columns: repeat(6, 1fr); /* 6 columns for larger screens */
  gap: 65px; /* Equivalent to Tailwind's gap-4 */
/*
  display: flex;
  justify-content: center;
  align-items: center;
*/

}



/*  desktop  */

.frame-logos .logo-img-spam {

  width: 174.116px;
  height: fit-content;
  flex-shrink: 0;
  aspect-ratio: 174.12/51.08;
}

.frame-logos .logo-img-cornuts {
  width: 122.409px;
  height: fit-content;
  flex-shrink: 0;
  aspect-ratio: 122.41/127.77;
               
}

.frame-logos .logo-img-paramount {
  width: 222.657px;
  height: fit-content;
  flex-shrink: 0;
  aspect-ratio: 222.66/60.27;
               
}

.frame-logos .logo-img-arcteryx {
  width: 160.398px;
  height: fit-content;
  flex-shrink: 0;
  aspect-ratio: 160.40/97.71;
               
}

.frame-logos .logo-img-lotto {
  width: 155.122px;
  height: fit-content;
  flex-shrink: 0;

  aspect-ratio: 155.12/98.31;
               
}

.frame-logos .logo-img-telus {
  width: 180.448px;
  height: fit-content;
  flex-shrink: 0;
  aspect-ratio: 180.45/101.50;
               
}



.frame-logos .col-1 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.frame-logos .col-2 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.frame-logos .col-3 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.frame-logos .col-4 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.frame-logos .col-5 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.frame-logos .col-6 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}





@media (max-width: 768px) { 


    .frame-logos {
      background-color: #f9f9e6;
      padding-top: 50px;
      padding-left: 12px;
      padding-right: 12px;
      padding-bottom: 50px;
    }
 




    .frame-logos .logos-wrapper {
      display: grid;
      gap: 25px;
      grid-template-columns: repeat(3, 1fr);
      justify-content: center;
      align-items: center;
    }

    /*  mobile  */
    .frame-logos .logo-img-spam {
      width: 96.215px;
      height: fit-content;
      aspect-ratio: 96.22/28.23;              
    }

    .frame-logos .logo-img-cornuts {
      width: 67.642px;
      height: fit-content;
      aspect-ratio: 67.64/70.61;              
    }

    .frame-logos .logo-img-paramount {
      width: 123.039px;
      height: fit-content;
      aspect-ratio: 123.04/33.31;
    }

    .frame-logos .logo-img-arcteryx {
      flex-shrink: 0;
      width: 88.635px;
      height: fit-content;
      aspect-ratio: 88.63/53.99;
    }

    .frame-logos .logo-img-lotto {
      width: 85.719px;
      height: fit-content;
      flex-shrink: 0;
      aspect-ratio: 85.72/54.32;


    }

    .frame-logos .logo-img-telus {
      width: 99.714px;
      height: fit-content;
      aspect-ratio: 99.71/56.09;
      flex-shrink: 0;
    }


    .frame-logos .col-1 {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .frame-logos .col-2 {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .frame-logos .col-3 {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .frame-logos .col-4 {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .frame-logos .col-5 {
      display: flex;
      justify-content: center;
      width: 100%;
    }

    .frame-logos .col-6 {
      display: flex;
      justify-content: center;
      width: 100%;
    }


}
