custom-grid[type="news"] > custom-grid-item
{
   border-radius: var(--kl-border-radius);
   background: var(--kl-bg-color);
   overflow: hidden;
   cursor: pointer;
   margin-bottom: 20px;
   color: var(--kl-text-color-light);
   position: relative;
}
custom-grid[type="news"] > custom-grid-item > a
{
   color: var(--kl-text-color-light);
}
custom-grid[type="news"] > custom-grid-item .image-container
{
   position: relative;
   width: 100%;
   aspect-ratio: 16 / 9;
}
custom-grid[type="news"] > custom-grid-item .image-container > img
{
   display: block;
   width: 100%;
   object-fit: cover;
   aspect-ratio: 16 / 9;
   line-height: 50px;
   text-align: center;
}
custom-grid[type="news"] > custom-grid-item .info-container
{
   padding: 20px;
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos
{
   display: flex;
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title
{
   flex: 1;
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .date
{
   display: block;
   margin-top: 4px;
   font-size: 13px;
   font-weight: 300;
   line-height: 17px;
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .title
{
   margin-top: 10px;
   font-size: 24px;
   font-weight: 700;
   line-height: 31px;
   max-height: 93px;

   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}
custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .badge
{
   display: none;
   box-sizing: border-box;
   height: 25px;
   margin-left: 10px;
   margin-top: 41px;
   padding: 4px 8px;
   color: var(--kl-text-color-dark);
   border-radius: var(--kl-border-radius);
   background: var(--kl-color-gradient);
   font-size: 13px;
   font-weight: 500;
   line-height: 17px;
}
custom-grid[type="news"] > custom-grid-item .info-container > .text
{
   font-size: 16px;
   font-weight: 300;
   line-height: 21px;

   height: auto;
   margin-bottom: 60px;

   display: -webkit-box;
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}
custom-grid[type="news"] > custom-grid-item .action
{
   box-sizing: border-box;
   align-items: center;
   font-size: 16px;
   font-weight: 700;
   line-height: 20px;
   text-transform: uppercase;
   color: var(--kl-color-2);
   width: 100%;
   height: auto;
   margin: 0;
   display: flex;
   position: absolute;
   bottom: 25px;
   left: 0;
   padding: 0 25px;
}
custom-grid[type="news"] > custom-grid-item .action:after
{
   content:url(/images/icons/arrow-right.svg);
   width: 40px;
   height: 40px;
   margin-left: 10px;
}
custom-grid[type="news"] > custom-grid-item .action > .read
{
   display: inline-flex;
}

@media screen and (min-width: 744px)
{
   custom-grid[type="news"] > custom-grid-item
   {
      margin-bottom: 60px;
   }
   custom-grid[type="news"] > custom-grid-item .image-container > regular-icon
   {
      display: none;
   }
   custom-grid[type="news"] > custom-grid-item .info-container
   {
      padding: 25px;
   }
   custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .date
   {
      margin-top: 0px;
      font-size: 16px;
      line-height: 21px;
   }
   custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .title
   {
      margin-top: 20px;
      font-size: 20px;
      line-height: 26px;
      height: 78px;
      max-height: 78px;
   }
   custom-grid[type="news"] > custom-grid-item .info-container > .text
   {
      -webkit-line-clamp: 5;
   }
}

@media screen and (min-width: 1440px)
{
   custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .date
   {
      margin-top: 4px;
   }
   custom-grid[type="news"] > custom-grid-item .info-container > .head-infos > .date-and-title > .title
   {
      height: auto;
      max-height: calc(3 * 26px);
      -webkit-line-clamp: 3;
   }
   custom-grid[type="news"] > custom-grid-item .info-container > .text
   {
      max-height: 189px;
      -webkit-line-clamp: 4;
   }
}