/* @import url('http://example.com/example_style.css'); */
@import url('https://fonts.googleapis.com/css2?family=Roboto&family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

.blog-index {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  @media (max-width: 800px) {
  flex-direction: column !important;
}
}



.blog-index-header {
    margin-top: 48px;
}

.blog-index__post {
  flex-basis: calc(33.33% - 16px);
      @media (max-width: 768px) {
    width: 92vw;
  }
}

.hs_cos_wrapper_blog-subscribe {
  display:none;
}

.blog-subscribe {
  display:none;
}


.blog-index__post-image {
    padding-bottom: 0 !important;
}

.dnd_area-row-1-padding {
  margin: 0 36px 0 24px;
}

.hs-search-results__description {
 font-size: 23px !important; 
}


.blog-header--post {
  position: relative;
  height: 0;
/*   padding-bottom: 42%; /* set this to your desired aspect ratio */ */
  background-size: 85%;
  background-color: white;
}

.blog-header--post img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blog-header--post {
min-height: 320px;
}

.blog-post {
    margin: 0 auto;
    padding: 2rem 0 4.5rem 0;
}
p, body, h1, h2, h3, h4, h5, h6, *{
  font-family: 'Roboto', sans-serif !important;
}

.blog-post__body-wrapper {
  max-width: none !important;
}

.blog-summary {
-webkit-mask-image: linear-gradient(180deg, #000 70%, transparent);
    max-height: 250px;
    overflow: hidden;
}

.blog-summary h2 {
font-size: 18px !important;
}

.blog-index__post-content__title {
  height: 120px;
}
/*
.kl-navbar__panel {
  top: 190px;
}
*/
/*****************************************/
/* Start your style declarations here    */
/*****************************************/