/* Blog post */


/* CODE BLOCK WIDTH */

div.code-toolbar {
	  width: 1136px;
	  margin: 0 -184px 32px;
    position: relative;
}

@media (max-width:1200px) {
	div.code-toolbar {
    width: calc(100vw - 64px);
    margin: 0 calc(-50vw + 50% + 32px) 32px;
	}
}


.blog-post {
  margin: 0 auto;
  max-width: 768px;
}

.blog-post__meta {
  margin-bottom: 54px;
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  align-items:center;
}

.blog-post__meta i {margin-right:6px}

.blog-post__meta a {
  text-decoration: underline;
}

.blog-post__timestamp {
  display: block;
}

.blog-post__tags svg {
  height: auto;
  margin-right: 0.35rem;
  width: 15px;
}

.blog-post__tag-link {
  font-size: 0.875rem;
}


.blog-post__author,
.blog-post__author a,
.blog-post__author a:hover   {font-weight: 900;
  font-size: 18px;
  line-height: 28px;
  color: #434A56;
  text-decoration:inherit;
}

.blog-post__meta,
.blog-post__meta .reading-time{font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 171%;
  font-feature-settings: 'salt' on;
  color: #21252B;
}


/*.blog-post .reading-time:before {content:url('https://lp.axoniq.io/hubfs/2021%20-%20Assets%20-%20AxonIQ%20Commercial%20Website%20Refresh/reading-time-blog-post.svg');
position:absolute;
top:2px;
left:-22px} */

/* Blog related posts */

.blog-related-posts {
  background-color: #F8FAFC;
}

.blog-related-posts h2 {
  text-align: left;

}

.blog-related-posts__list {
  display: flex;
  flex-wrap: wrap;
  gap:5%;
}

.blog-related-posts__post {
  flex: 0 0 100%;
  padding: 1rem;
}

@media screen and (min-width: 768px) {
  .blog-related-posts__post {
    flex: 0 0 calc(90% / 2);
  }
}

@media screen and (min-width: 1000px) {
  .blog-related-posts__post {
    flex: 0 0 calc(90% / 3);
  }
}

.blog-related-posts__image {
  height: auto;
  max-width: 100%;
}

.blog-related-posts__title {
  margin: 0.7rem 0;
}



/* Blog post custom styles */

.quote {
	margin: 32px 0;
	width: 100%;
	position: relative;
}

.quote::before {
	color: rgb(19, 116, 207);
	content: "“";
	display: block;
	font-family: Lato;
	font-size: 64px;
	font-style: italic;
	font-weight: 900;
	height: 44px;
	left: -32px;
	line-height: 44px;
	position: absolute;
	text-align: left;
}

.alert {
    position: relative;
    display: block;
    padding: 24px 24px 24px 48px;
    margin: 0 -24px 0 -48px;
    background-color: #F5F6F6;
    border-radius: 15px;
    border: 4px solid #FBCAAD;
}

.alert::before {
    display: block;
    position: absolute;
    top: 0px;
    left: 12px;
    content: "!";
    font-size: 4em;
    font-weight: 900;
    color: #FE5E00;
}

.blog-related-posts__blog-type a {position:relative}

.blog-related-posts__blog-type a.Podcasts:before {
  content: url(https://www.axoniq.io/hubfs/2021%20-%20Assets%20-%20AxonIQ%20Commercial%20Website%20Refresh/podcast-icon-black.svg);
  position: absolute;
  left: -19px;
  top: -2px;}


.blog-related-posts__blog-type a.AxonIQ.Videos:before {
  content: url(https://www.axoniq.io/hubfs/2021%20-%20Assets%20-%20AxonIQ%20Commercial%20Website%20Refresh/video-icon-black.svg);
  position: absolute;
  left: -19px;
  top: -4px;}

.blog-related-posts__blog-type a.Blog:before,
.blog-post .blog-related-posts__blog-type:before{
  content: url(https://www.axoniq.io/hubfs/2021%20-%20Assets%20-%20AxonIQ%20Commercial%20Website%20Refresh/blog-post-type-icon-black.svg);
  position: absolute;
  left: -19px;
  top: -2px;}              
.blog-post .blog-related-posts__blog-type:before {top:2px}

/* Related content card style */

.blog-related-posts__list article {filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.2)) drop-shadow(6px 7px 14px rgba(0, 0, 0, 0.1));
  border-radius: 15px;
  background: #fff;
  position:relative;
  padding:0}

.blog-related-posts__list article img {border-radius:15px 15px 0 0}

.blog-related-posts__info {padding:30px 49px}

.blog-related-posts__content {position:absolute;
  bottom: 40%;
  left: 30px;
  right: 30px;}

.blog-related-posts__content h3 a{
  font-weight: 900;
  font-size: 24px;
  line-height: 125%;
  color:#fff}


.blog-related-posts__post-image-wrapper img {height:290px;
  object-fit:cover}

.blog-related-posts__blog-type {position:relative}

/* Blog comments */

.blog-comments {
  margin: 0 auto;
  max-width: 680px;
}

.blog-comments .hs-submit {
  text-align: center;
}

.blog-comments .comment-reply-to {
  border: 0 none;
}

.blog-comments .comment-reply-to:hover,
.blog-comments .comment-reply-to:focus {
  background-color: transparent;
  text-decoration: underline;
}




/* Blog listing */

.blog-index.author-page .blog_index--hero-wrapper,
.blog-index.author-page .featured.blog-index__post{
  display:none
}






.blog_index--hero-wrapper h1,
.events-hero h1,
.datasheets-hero h1{font-weight:900;
  color: #21252B;
  font-size: 40px;
  line-height: 120%;}


#main-content {margin-top:80px}

.dnd-section .dnd-column {padding:0}

.blog-index__post {margin: 32px auto;
  max-width: 1024px;
  padding: 121px 30px 75px 30px;
  border-radius: 15px;
  background:#F5F6F6;
  filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.2)) drop-shadow(6px 7px 14px rgba(0, 0, 0, 0.1));}

.blog-index__post-content--large {padding-left:30px;
  margin-top: 30px;}

/* Featured article */
.blog-index__post.featured {background:#ECEDEE;
  border-radius:0;
  filter:none;
  max-width:100%;
  display:block;
  margin: 0 auto
}

.blog-index__post.featured > div {max-width:1024px;
  padding:48px 0 64px 0;
  margin:auto;}

article.featured .blog-index__post-title,
article.featured .blog-index__post-author
{position:relative;
  top:auto;
  color:#21252B; 
  float:none;
}

article.featured .blog-index__post-title a
{font-style: normal;
  font-weight: 900;
  font-size: 48px;
  line-height: 56px;
  color: #21252B;}

#hs_cos_wrapper_dnd_area-module-5 article.featured .blog-index__post-timestamp {color:#21252B;
  position:relative}

.blog-post__date {position:relative}

/* article.featured .blog-index__post-timestamp:before,
.blog-post__date:before{content:url('https://lp.axoniq.io/hubfs/time-icon.svg');
position:absolute;
left: -18px;
top: 2px;} */

.featured__main-info-wrapper {display: flex;
  align-items: center;
  gap: 16px;
  margin-top:20px}

.featured .blog-index__post-image {display:none;}

.blog-index__featured-type {width:fit-content;
  background: #00B7BF;
  border-radius: 4px;
  padding:8px 16px;
  color:#fff;
  font-size:16px;
  font-weight:900;
  margin-bottom:8px} 

article img {width:100%}

/*.blog-index__post-title {position: absolute;
top: 121px;

z-index: 2;
} */

.blog-index__post-title a {color:#fff;
  font-style: normal;
  font-weight: 900;
  font-size: 24px;
  line-height: 30px;
}

.blog-index__post-title a:hover {color:#fff;
  font-style: normal;
  font-weight: 900;
  font-size: 24px;
  line-height: 30px;
}

.blog-index__post-author 
{ /* position:absolute;
  top:155px;*/
  font-weight: 900;
  font-size: 18px;
  line-height: 28px;
  color:#fff;
} 

.blog-index__post-author a

{font-style: normal;
  font-weight: 900;
  font-size: 18px;
  line-height: 28px;
  color:inherit;
  text-decoration:underline;
  text-underline-offset: 3px;}

.blog-post__author {font-weight: 900;
  font-size: 18px;
  font-weight: 900;
  line-height: 28px;
  color:inherit;}

.blog-index__post-author a:hover
{font-style: normal;
  font-weight: 900;
  font-size: 18px;
  line-height: 28px;
  color:inherit;
  text-decoration:underline;}

.blog-index__post-timestamp{position:relative;
  color:#fff}

/*
.blog-index__post-timestamp:before {content:url('https://lp.axoniq.io/hubfs/time-icon-white.svg');
position:absolute;
left: -18px;
top: 2px;

}
*/
.blog-index__post-summary {padding-right:2rem}

.blog-index__main-info-wrapper {
  display: block;
  bottom: 24px;
  left:20px;
  width: calc(100% - 40px);
  height: auto;
  position: absolute;

}


.reading-time,
.blog-index__post-timestamp

{position:relative;
  font-weight:900;
  font-size: 14px;
  line-height: 24px;
  color: #fff;}

/*
.reading-time:before {content:url('https://lp.axoniq.io/hubfs/hourglass-icon-white.svg');
position:absolute;
left: -18px;
top: 1px}
*/
.blog-related-posts__info .reading-time:before {content:url('https://www.axoniq.io/hubfs/hourglass-icon.svg');
  position:absolute;
  left: -18px;
  top: 1px}

.blox-index__listing-info-wrapper i {margin-right:6px}



.featured .reading-time,
.featured .blog-index__post-timestamp,
.blog-related-posts__blog-type a {position:relative;
  font-weight:900;
  font-size: 14px;
  line-height: 24px;
  color: #21252B;}




.hs_cos_wrapper_widget .pagination {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  max-width: 1024px;
  margin: auto;
  margin-top:32px;
  margin-bottom:46px;
}


.pagination .pagination__link--active,
.pagination .pagination__link--active:hover
{border-color:transparent;
  font-weight: 900;
  font-size: 18px;
  line-height: 28px;
  color: #21252B;

  border-radius:0px;
  position:relative;
}


.pagination .pagination__link--active:before
{content:"";
  position:absolute;
  bottom:0;
  background:#21252B;
  width:10px;
  height:2px;}

.pagination .pagination__link--number,
.pagination .pagination__link--number:hover,
.paginate-pagination a{font-weight: normal;
  font-size: 18px;
  line-height: 28px;
  color: #21252B;
  border:none;
  margin-left:12px;
  margin-right:12px;
}

.pagination .pagination__link-icon {padding:5px;
  display: flex;}

.linear-progress .bar {transition:none}

.offset-right {float: right;
  position: relative;
  margin-right: -30px;
  margin-bottom: 25px;}




.paginate-pagination ul {list-style:none;
  display:flex;
  gap:20px;
  max-width:1024px;
  margin:auto;
  width:100%;
  justify-content:flex-end;
  border-top: 1px solid #ECEDEE;
  border-bottom: 1px solid #ECEDEE;
  margin-bottom:46px;
}

.hubdb-events__listing-wrapper .paginate-pagination ul {
  justify-content: flex-start;
  padding-left: 0px;
  column-gap: 12px;
}


/* Events pagination */ 

.events-listing__pagination-wrapper .blog-pagination {max-width:1024px;
  margin:auto;
  border-bottom:1px solid #ECEDEE;
  border-top:1px solid #ECEDEE;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:4px 0;
  margin-bottom:50px;
  margin-top:32px}
}

.events-listing__pagination-wrapper .blog-pagination a.active,
.events-listing__pagination-wrapper .blog-pagination a.active:hover{border-color:transparent;
  font-weight: 900;
  font-size: 18px;
  line-height: 28px;
  color: #21252B;
  position:relative;
  border-radius:0px;
  position:relative;
}


.events-listing__pagination-wrapper .blog-pagination a.active:before {content:"";
  position:absolute;
  bottom:0;
  left:0px;
  background:#21252B;
  width:100%;

  border-bottom: 2px solid currentColor;}

.events-listing__pagination-wrapper .blog-pagination a,
.events-listing__pagination-wrapper .blog-pagination a:hover{font-weight: normal;
  font-size: 18px;
  line-height: 28px;
  color: #21252B;
  position:relative;
  border:none;
  margin-left:12px;
  margin-right:12px;
}

.pagination .pagination__link-icon {padding:5px;
  display: flex;}

/* Datasheets */

.datasheets-main-info-wrapper {height:168px;
  position:relative;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 30px;
  border-radius: 15px 15px 0 0;}


.datasheet__listing-title{font-weight: 900;
  font-size: 24px;
  line-height: 140%;
  color: #fff;
  position: absolute;
  margin-bottom: 24px;
  bottom: 0;}


.paginate-pagination .page-prev,
.paginate-pagination .page-next{position:relative;
  color:transparent;}

.paginate-pagination .page-prev:before {content:"\fb2b";
  position:absolute;
  font-family: 'tabler-icons';
  font-weight:900;
  color:#21252b}

.paginate-pagination .page-next:before {content:"\fb2c";
  position:absolute;
  font-family: 'tabler-icons';
  font-weight:900;
  color:#21252b}

.datasheets-hero {display: flex;
  justify-content: space-between;
  align-items: center;
  gap: initial;
  margin: 100px auto 32px auto;
  max-width: 1024px;}

.blog-index__post-image {position:relative;
  border-radius:16px 16px 0 0px}


.f-social {
  margin-top:64px;
}

.f-social-buttons {
  display: flex;
  gap: 24px;
}

.f-social-buttons>div, .f-social-buttons>iframe {
  margin: 0px;
  padding: 0px;
}

.f-social-buttons>iframe {
  margin: 5px 0 0 0;
}


/* Media queries */

@media (max-width:769px) {
  .blog_index--hero-wrapper,
  .events-hero{flex-direction:column;
    align-items:flex-start;
    gap: 30px;
    padding:0 30px}

  .blog_index--filters {max-width:100%}



  .blog_index--filters select {min-width:auto;
    flex:0 0 43%;}

  .blog_index--filters .blog-search-form {flex: 0 0 50%;}
  .blog-search-form input[type=text] {min-width:auto!important}

  .hubdb-events__listing-wrapper .tab-content,
  .listing-events-container__featured .container,
  .event-listing__gallery-wrapper,
  .training-listing__main-wrapper{padding:0 30px}

  .event-cta-listing.three-colors-hover {left:auto}

  .blog-index__post {margin: 30xp auto}

  .blog-index__post.featured>div {padding:48px 30px 64px 30px }

  .blog-index__post-button-wrapper.offset-right {float:none;
    margin-top:20px}

  .blog-index__post-image-wrapper img {min-height:260px}



  .blog-index__main-info-wrapper {bottom:56%;
    top:auto}
  article.featured .blog-index__post-title a {font-size:24px;
    line-height:125%}

  .blog-post__meta {display:block}

  .body-container--blog-post .content-wrapper,
  .blog-related-posts__button {padding:0 30px}

  .blog-related-posts__content {bottom:45%}

  .blog-related-posts__list {gap:30px}

  .blog-related-posts__post {flex:0 0 100%}

  .featured__main-info-wrapper {display:block}

  .whitepaper-post__custom-bg .event-detail__author-bio {margin:30px 0}

  .event-detail__author-bio-profile {align-items:flex-start}


  /* Blog media queries */



  .blog-index__main-info-wrapper {position:relative;
    padding:15px 10px;}


  /* Datasheets media queries */

  .datasheets-hero { 
    flex-direction:column;
    align-items:flex-start;
    padding:0 30px
  }

  .listing-events-container__featured.datasheets,
  .events-listing__pagination-wrapper {margin:0;
    padding:30px}


  /* Podcast mobile updates */

  .podcast-post__module-wrapper
  {padding:30px}


  /* End of mex-width 768px */
}