/*
//////////////////////////////////////////////////////////////////////////////
//
// Notes
//
// z-index rules:
//  Use 4 digit numbers incrimented by whole numbers
//  Modals use X000
//  Sticky elements use 0X00
//  Normal elements use 00X0
//  Minor adjustments within a type use 000X
//  
//
//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////
//
// Variables
//
//////////////////////////////////////////////////////////////////////////////
*/

















/*
//////////////////////////////////////////////////////////////////////////////
//
// Reset
//
//////////////////////////////////////////////////////////////////////////////
*/

.small {
  font-size: 0.875em;
}

.thin-text {
  font-weight: 200;
}


/*/////////////////////////////////
UTILITIES
/////////////////////////////////*/





.flex-wrap {
   display: -webkit-box !important; display: -ms-flexbox; display: flex !important; -ms-flex-wrap: wrap; flex-wrap: wrap; ;
}

.flex-item {
  -webkit-box-flex: 1; -ms-flex: 1 0; flex: 1 0;;
}

.flex-middle{
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.flex-self{
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}




.section-wrapper{
  padding:3.5em 0;
  display:block;
  min-width:100% !important;
}


.section-wrapper_small{
  padding:2.5em 0;
  display:block;
  min-width:100% !important;
}

.relative{
  position:relative;
}

@media (max-width:767px){
  .section-wrapper{
    padding:2em 0;
  }
}


.background{
  background-size:cover;
  object-fit:cover;
  background-position: center;
  width:100%;
  position:relative;

  /*background-position: center bottom;*/
  /*background-size:562px 315px;*/
  /*background-repeat:no-repeat;*/
  /*background-color:#3a95fb;*/
}

.page-wrapper{
  max-width: 1170px;
  margin: 0 auto !important;
  float: none !important;
  padding-left: 2em !important;
  padding-right: 2em !important;
}


.page-wrapper_small{
  max-width: 900px;
  margin: 0 auto !important;
  float: none !important;
  padding-left: 2em !important;
  padding-right: 2em !important;
}

.page-wrapper_small_smaller{
  max-width: 750px;
  margin: 0 auto !important;
  float: none !important;
}

@media (max-width:767px){
  .page-wrapper{
    padding-left: 1.3em !important;
    padding-right: 1.3em !important;
  }

  .page-wrapper_small{
    padding-left: 1.3em !important;
    padding-right: 1.3em !important;
  }
}

.center{
  text-align:center;
}


/*/////////////////////////////////
colors
/////////////////////////////////*/






.red{
  color:#BF243A;
}

.dgrey{
  color:#333;
}

.white{
  color:#fff;
}

.lgrey{
  color:#eee;
}

.ldgrey{
  color:#a1a1a1 !important;
}

/*---BACKGROUND COLORS----*/
.red-background{
  background-color:#BF243A;
}

.dgrey-background{
  background-color:#333;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

.white-background{
  background-color:#fff;
}

.lgrey-background{
  background-color:#eee;
}

.ldgrey-background{
  background-color:#a1a1a1;
}

.d_dgrey-background{
  background-color:#2B2B2B;
}


/*////////////////////////////////////
//BUTTON
////////////////////////////////////*/

.link,
.link a{
  text-decoration:none;
  /*color:currentColor;*/
}

.hs-button{
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  text-decoration:none;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  margin: 0.6em;
}

.hs-button-ghost-red{
  background-color: transparent;
  padding: 15px 35px;
  border: 1.5px solid #BF243A;
  color: #BF243A;
  text-transform: uppercase;
  text-decoration:none;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 1.51px;
  line-height: 16px;
  border-radius: 0;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  margin: 0.6em;
}

.hs-button-ghost-red:hover{
  background-color: #BF243A;
  color: #fff;
}

.new-comments input[type=submit] {
  margin-top: 2em;
}

.hs-button-ghost-white{
  background-color: transparent;
  padding: 15px 35px;
  border: 1.5px solid;
  border-color: #fff;
  color: #fff;
  text-transform: uppercase;
  text-decoration:none;
  font-family: Roboto;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 1.51px;
  line-height: 16px;
  border-radius: 0;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  margin: 0.6em;
}

.hs-button-ghost-white:hover{
  background-color: #fff;
  color: #000;
}


@media (max-width:611px){
  .hs-button,
  .hs-button-ghost-red,
  .hs-button-ghost-white
  {
    display: block;
  }
}




/*/////////////////////////////////
PADDING
/////////////////////////////////*/
.ptb2{
  padding:2em 0;
}

.ptb3{
  padding:3em 0;
}

/*----margin-----*/
.mtb0e{
  margin-top:0;
  margin-bottom:0;
}


/*/////////////////////////////////
BZ FORM BASIC STYLE
/////////////////////////////////*/

.bz-form form > div:nth-child(2n){
  margin-right:0;
  margin-bottom: 1em;
}

.bz-form form input,
.bz-form form textarea{
  border: solid 1px #a1a1a1;
  border-radius: 4px;
}


.bz-form form .hs_comment {
  min-width: 100%;
}

.bz-form form .hs_subscribe {
  display: block;
  min-width: 100%;
}

.bz-form form input[type="checkbox"] {
  margin-right: 0.5em;
}

.bz-form .hs-error-msgs.inputs-list li label {
  position:absolute;
  top: 1px;
  font-size: 0.7em;
  color: red;
}


.bz-form .hs-error-msgs.inputs-list {
  list-style: none;
  position: relative;
}




/*/////////////////////////////////
BLOG LISTING
/////////////////////////////////*/

.blog-hero {
  min-height: 400px;
  height: 50vh;
  background-position: center;
  background-size: cover;
}

/*---BLOG FILTER NAVIGATION----*/
.blog-filter-nav-wrapper {
  background-color: #eaebed;
  width: 100%;
}

.blog-filter-nav ul {
  display: block !important;
}

.blog-filter-nav ul li a{
  color:#9ca4ac;
  display: block !important;
  text-overflow:initial !important;
  max-width: none !important;
  font-size: 0.75rem;
  padding: 1.2em 0.85em !important;
  border-top: solid 3px transparent;
  margin-top: 0.5em;
}

.active-blog li:nth-child(1) a,
.active-insider li:nth-child(2) a,
.active-live-streaming li:nth-child(3) a,
.active-monetization li:nth-child(4) a,
.active-pr-marketing li:nth-child(5) a,
.blog-filter-nav li a:hover{
  background-color: #fff;
}

.active-blog li a,
.blog-filter-nav li a:hover{
  border-color: currentColor;
}




/*---BLOG LISTING----*/
.featured-post-title{
  font-size: 1.7em;
}

.post_list_topic_title,
.post_list_topic_title:hover {
  color: #333;
}

.meta {
  line-height: 2.6em;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
  opacity: 0.8;
  display:block;
}


.post-featured-link {
  padding: 7em 0 7em;
  display: block;
}

@media (max-width:768px){
  .post-featured-link {
    padding: 5em 0 7em;
  }
}

@media (min-width:768px){
  .post-featured-link {
    padding: 6em 0 8em;

  }
}

.post-item {
  width: calc(33% - 1.8em);
  display: inline-block;
  float: none;
  vertical-align: top;
  margin: 0.8em;
  text-decoration: none;
  color: #333;
  border: solid 1px #eee;
  border-radius: 5px;
  overflow:hidden;
}

@media (max-width:767px){
  .post-item {
    width: 44%;
  }
}

@media (max-width:425px){
  .post-item {
    width: 100%;
    margin-left:0;
    margin-right:0;
  }
}

.post-item:hover,
.post-item:hover .post_list-header{
  box-shadow: 0px 0px 1px #e6e6e6;
  background-color:#fff;
}

.post-item:hover {
  border-color: #999;
  box-shadow: 0px 0px 10px -5px #e6e6e6;
}

.post_list_summary_featured_image {
  width: 100%;
  height: 200px;
  background-size: cover;
  display: block;
}

.post-listing {
  margin: 0 auto;
  text-align: center;
}


.post_list-header {
  padding: 1em;
}

/*--post list meta style---*/

.category p {
  font-size: 13px;
  color: #bfbfbf;
  position:relative;
}

.category p:before{
  left: 28px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background: #e6e6e6;
  content: "";
  height: 1px;
  position: absolute;
  top: 10px;
  width: 20px;
}

.category p:after{
  right: 28px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background: #e6e6e6;
  content: "";
  height: 1px;
  position: absolute;
  top: 10px;
  width: 20px;
}

.recommened-category {
  font-size: 11px !important;
}

.recommened-category:before,
.recommened-category:after{
  display:none;
}



.post_list-header,
.post-recommended-post-content{
  border-top: 5px solid black;
}

.topic-live-streaming {
  border-color: #3a95fb;
}

.topic-insider {
  border-color: #796ec2;
}

.topic-monetization {
  border-color: #ffb83f;
}

.topic-pr-marketing{
  border-color: #45e8c5;
}


/*---POST SHARE----*/

@media (max-width:855px){
  .post-social-share {
    display: block;
    min-width: 100%;
    text-align:center !important;
  }

  .post-social-share a{
    display:inline-block !important;
  }

  .post-share.active{
    position:relative !important;
  }
}



.post-share a {
  display: block;
  width: auto;
  color: rgba(42, 42, 42, 0.4);
  margin-bottom: 1em;
  padding-left: 2em;
}

@media (max-width:480px){
  .post-share a {
    padding-left: 1em;
  }
}

.post-share.active {
  position: fixed;
  top: 6em;
}

.social-icons i {
  width: 42px;
  line-height: 42px;
  height: 42px;
  text-align: center;
  border: 1px solid transparent;
  border-radius: 100%;
  font-size: 1.3em;
  background-color:rgba(236, 236, 236, 0.45);
}


.social-icons .fa-twitter:hover{
  background-color:#04aceb;
  color:#fff;
}

.social-icons .fa-instagram:hover{
  background-color:#125688;
  color:#fff;
}

.social-icons .fa-envelope:hover{
  background-color:#a4a4a4;
  color:#fff;
}

.social-icons .fa-reddit-alien:hover{
  background-color:#4E4E4E;
  color:#fff;
}

.social-icons .fa-google:hover{
  background-color:#f44336;
  color:#fff;
}

.social-icons .fa-facebook:hover{
  background-color:#3b5998;
  color:#fff;
}


/*---AUTHOR----*/
.author-image img{
  border-radius: 100%;
  display: block;
  margin: 0 auto 1.2em;
  width: 80px;
  object-fit:cover;
}

.author-bio-name {
  font-weight: 700;
}

/*----RECOMMENDED POST----*/

.text-line p{
  padding:1.5em 0;
}

.text-line p:before {
  content: "";
  width: 31%;
  display: inline-block;
  height: 1px;
  background-color: #eee;
  margin-right: 1em;
  position: relative;
  top: -4px;
}

.text-line p:after {
  content: "";
  width: 31%;
  display: inline-block;
  height: 1px;
  background-color: #eee;
  margin-left: 1em;
  position: relative;
  top: -4px;
}


.post-recommended-post {
  max-width: 22%;
  border: solid 1px #eee;
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 1em;
}

@media (max-width:767px){
  .post-recommended-post {
    max-width: 46%;
    display: inline-block !important;
    float: none !important;
    margin: 0.8em;
    text-align: center;
    vertical-align: top;
  }

  .text-line p:after,
  .text-line p:before {
    width:10%;
  }
}

@media (max-width:320px){
  .post-recommended-post {
    max-width: 100%;
  }
}

.post-content {
  padding: 2em;
  padding-top:0;
  display:block;
}

.post-content a {
  background: none;
  color: #1091e7;
  font-family: Georgia, "Times New Roman", Times, serif;
  text-decoration: none;
}

.post-content a:hover,
.post-content a:focus {
  color: #0081d7;
}

.post-content ul{
  padding-left:1.2em;
}

.post-recommended-post-content {
  font-size: 0.8em;
  text-align: center;
  padding: 0.5em;
  color: #333;
  background-color:#eee;
}

.post-recommended-post:hover,
.post-recommended-post:hover .post-recommended-post-content {
  background-color:#fff;
  box-shadow: 0px 0px 6px #e6e6e6;
}

/*--blog speciality--*/

.callout {
  color: #72808e;
  background-color: #f1f3f5;
  padding: 1.5em;
}

blockquote {
  border-left: 3px solid #222;
  margin: 35px 0;
  padding: 5px 0 5px 18px;
  font-style:italic;
}

/*--blog speciality ends--*/

.featured-image_image {
  height: 100px;
  background-size: cover;
}


/*-----comment form------*/
.post-blog-comment form > div{
  display: inline-block;
  width: 48%;
  margin-right: 1em;
}

@media (max-width:480px){
  .post-blog-comment form > div{
    width:100%;
  }
}
/*---sign up form-----*/
.signup-post-form-wrapper {
  padding: 2em;
  background-color: #BF243A;
  color: #fff;
  text-align:center;
}

.signup-post-form input[type=submit]{
  position: absolute;
  top: 9px;
  background-color: #000;
  color: #fff;
  right: 0;
  border-radius: 0;
  line-height: 25px;
  margin: 0;
}

.signup-post-form form {
  position: relative;
  line-height: 10px;
}

.signup-post-form form input[type=email]{
  padding:0.5em;
}

.signup-post-form label {
  position: relative;
  top: -10px;
}

@media (max-width:481px){
  .signup-post-form input[type=submit] {
    position: relative;
    top: 0;
    display: initial;
    text-align: center;
    float: none;
    margin-top: 0.5em;
    margin-bottom:0.5em;
  }
}


/*/////////////////////////////////
FOOTER
/////////////////////////////////*/


.footer-background-image{
  background-image:url(https://cdn2.hubspot.net/hubfs/2567839/footer-map.png);
}

@media (max-width:767px){
  .footer-background-image{
    background-image:none;
  }
}


.footer-address ul {
  list-style: none;
  max-width: 600px;
  display:inline-block;
}

.footer-address ul li {
  vertical-align: top;
  padding-left: 2em;
  position: relative;
  display: block;
  margin: 1em;
  width: 100%;
}

.footer-address ul li:before{
  content:"";
  background-image:url(https://cdn2.hubspot.net/hubfs/2567839/geo-marker.png);
  background-size: contain;
  background-repeat:no-repeat;
  background-position:center;
  position:absolute;
  left:0;
  width: 30px;
  height: 41px;
  top: 0;
}

.privacy a {
  color: red;
}

/*
//////////////////////////////////////////////////////////////////////////////
//
// Comments
//
//////////////////////////////////////////////////////////////////////////////
*/

[id=comment-form] label {
  color: #333 !important;
}

[id=comments-listing] .comment {
  padding: 1rem 1rem 1rem 1.5rem;
  border-left: 3px solid ;
  background: #eee;
}

.comment.depth-0.depth-0 {
  border-top: 0;
}

.comment.depth-0.comment.depth-0:first-child {
  margin-top: 1.25rem;
}

.comment.depth-1.depth-1 {
  margin-left: 3rem;
  padding-left: 1.5rem;
}

.comment.depth-2.depth-2 {
  padding-left: 1.5rem;
  margin-left: 6.5rem;
}

.comment-reply-to.comment-reply-to {
  color: #fff;
  background: ;
}
.comment-reply-to:before {
  content: '\f112';
  font-family: FontAwesome;
  position: relative;
  right: 0.75em;
}


/* UGH */

div.blog-post-wrapper div.post-body{
  margin-top:0;
  padding-top: 0;
}

#comment-form {
  background: none;
  padding: 0;
  margin-top: 0;
}


.post-featured-link {
  background: rgba(51, 51, 51, 0.66);
  color: #fff;
}

.featured-post-title {
  color: #fff;
}

html body fieldset {
  max-width: none !important;
}




/*SIMPLE FLEX 2 COLUMNS*/

.flex-span-12 .cols,
.flex-span-6 .cols {
  -webkit-box-flex:1;-ms-flex:auto;flex:auto;
  width:100%;
}

@media (min-width:768px){
  .flex-span-6 .cols {
    max-width: calc(50% - 1em);
    min-width: calc(50% - 1em);
    margin: 0;
    padding: 0;
  }

  .flex-span-6 .col-2 {
    margin-left: 2em;
  }
}








/* REQUEST A DEMO 
////////////////////////////////*/
.new-hero__content.left {
  display: block;
  text-align: left !important;
}

.new-hero__content.left h1:before {
  left: 0 !important;
  transform: initial !important;
}

.white-form > div {
  background-color: #fff !important;
  background-image: none !important;
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.27);
  border: solid 1px #e4e4e4;
  padding: 0 !important;
}

.white-form label {
  color: #333;
  font-size: 0.8em;
}

.white-form h3 {
  background-color: #146db9;
  padding: 0.5em 1em !important;
  display: block;
  margin-top:0;
  margin-bottom:0;
  font-size: 1.2em;
}

.white-form form {
  padding: 1em;
}

@media (min-width:769px){
  .new-hero__content.left{
    padding-left: 0;
  }

  .white-form.overlay {
    margin-top: -11.5em;
    position: relative;
    z-index: 1;
  }
}