@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700,700i|Roboto:400,400i,500,500i,700,700i&display=swap');

/* Typography */














/* Colors */







/* Containers */






 /*** Purple ****/

/***** css reset + typography ****/


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display:block;
}

html{
  box-sizing:border-box;
  font-size:62.5%;
}

body{
  font-size:18px;
  font-size:1.8rem;
  line-height:1.5;
  font-family:'Roboto', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans', 'Helvetica Neue',sans-serif;
  color:#555555;
}
*,:before,:after{
  box-sizing:inherit;
}
body {
  margin:0;
  padding:0;
  font-weight:400;
}
h1,h2,h3,h4,h5,h6,p,ol,ul{
  margin:0;
  padding:0 0 1.6rem 0;
  font-weight:400;
}
h1,h2,h3,h4,h5,h6 {
  font-family:'Roboto', -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans', 'Helvetica Neue',sans-serif;
  font-weight:400;
}

h1 {
  font-size: 28px;
  font-size: 2.8rem;
  color:#02b4e6;
}
h2 {
  font-size:22px;
  font-size:2.2rem;
  color:#02b4e6;
}

h3 {
  font-size:22px;
  font-size:2.2rem;
  color:#555555;
  font-weight:700;
}
h4 {
  font-size:20px;
  font-size:2rem;
  color:#555555;
}
h5 {
  font-size:20px;
  font-size:2rem;
  color:#555555;
}
h6 {
  font-size:18px;
  font-size:1.8rem;
  color:#555555;
}
p, li{
  font-size:18px;
  font-size:1.8rem;
}
ol,ul,dl{
  font-size:18px;
  font-size:1.8rem;
}
ul{
  list-style-type: disc;
  list-style-position: inside;
}
ol li {
  list-style-position: inside;
}
.bg-purple {
  background-color:#A30072;
}
.bg-cyan {
  background-color:#02b4e6;
}
.bg-blue {
  background-color:#182958;
}
.bg-grey {
  background-color:#777777;
}

.the-post blockquote p,
.the-post blockquote {
  position: relative;
  font-size: 2.4rem;
  line-height: 1.2;
  color: #182958;
  margin: 24px;

}
.the-post blockquote::before {
  content: open-quote;
  font-family: sans-serif;
  font-size: 64px;
  position: absolute;
  top: -26px;
  left: 0;
  color: #e4e4e4;
}
.the-post blockquote::after {
  content: close-quote;
  font-family: sans-serif;
  font-size: 64px;
  position: absolute;
  bottom: -48px;
  color: #e4e4e4;
}



/*ul li{
position:relative;
margin-left:80px;
}
ul li:before {
content: "";
position: absolute;
width: 8px;
height: 8px;
background: #2c70b4;
border-radius: 100%;
top: 10px;
left: -20px;
}
*/
a:link, a:hover, a:active, a:visited {
  text-decoration:none;
  font-size: inherit;
}
a:link{
  color:#00b2e4;
  text-decoration:none;
}
a:hover{
  color:#000000;
  text-decoration:underline;
}
a:active{
  color:#00b2e4;
}
a:visited{
  color:#00b2e4;
}
img{
  width:100%;
  height:auto;
  max-width: none;
}

main img{
  display: block;
  margin: auto;
}

footer {
  font-size:13px;
  font-size:1.3rem;
}
footer small{
  font-size:12px;
  font-size:1.2rem;
}
.page-center{
  float: none;
  max-width: 1178px;
  margin: 0 auto;
  padding-left:24px;
  padding-right:24px;
}

.paddingTB {
  padding-top:4.8rem;
  padding-bottom:4.8rem;
}
.paddingT {
  padding-top:4.8rem;
  padding-bottom:0px;
}
.paddingB {
  padding-top:0px;
  padding-bottom:4.8rem;
}

.paddingTBsmall {
  padding-top:2.4rem;
  padding-bottom:2.4rem;
}
.paddingTsmall {
  padding-top:2.4rem;
  padding-bottom:0px;
}
.paddingBsmall {
  padding-top:0px;
  padding-bottom:2.4rem;
}




.text-center {
  text-align:center;
}

.text-right {
  text-align:right;
}

.text-left {
  text-align:initial;
}

.cover-bg {
  background-size:cover;
  background-repeat: no-repeat;
  background-position: center center;
}
a.cta_button,
input[type="submit"],
input[type="reset"] {
  -webkit-appearance: none;
  -moz-appearance:    none;
  appearance:         none;
  border:none;
  border-radius:0;
  font-size: 17px;
  font-weight: 600;
  font-family:inherit;
  background-color: #A30072;
  padding: 8px 18px;
  margin: 12px auto 0px auto;
  color: #ffffff;
  display: block;
  transition: background-color 0.5s ease;
  /*max-width: 190px;*/
  text-align: center;
  max-width: max-content;
  cursor:pointer;
}

@supports (-ms-ime-align:auto) {

  a.cta_button,
  input[type="submit"],
  input[type="reset"] {
    max-width: 240px;
  }
}

a.cta_button.cyan-cta{
  background-color: #02b4e6;
}
a.cta_button.white-cta{
  background-color: #ffffff;
  color:#02b4e6;
}
a.cta_button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover {
  background-color: #555555;
  color:#ffffff;
  text-decoration:none;
}


.grid-half, 
.grid-3, 
.grid-4, 
.grid-golden, 
.grid-golden-reverse {
  display: flex;
  flex-wrap: wrap;
  display: grid;
  grid-gap: 24px;

}
.grid-half {
  grid-template-columns: repeat(2, 1fr);
}

.grid-3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid-4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid-golden {
  grid-template-columns: 33fr 66fr;
}
.grid-golden-reverse {
  grid-template-columns: 66fr 33fr;
}


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

.index-article {
  background-color: #eaebeb;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.index-article .featured-img {
  height: 200px;
  object-fit: cover;
}




.index-article .listing-post-header,
.index-article footer {
  padding:12px 24px;
}

.index-article footer {
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.index-article footer img.more-arrow {
  width:16px;
  height:auto;
}


#index_subscription {
  grid-column-start:4;
  grid-row-start:2;
  background:#02b4e6;
  color:#ffffff;
}

#index_subscription.tall-sub {
  grid-row-end: 4;
}


.index-articles .featured-article {
  grid-column-start:1;
  grid-column-end:3;
}

.index-article h2,
.index-article.featured-article h2 {
  padding-bottom: 0;
}


.index-article h2 a,
.index-article.featured-article h2 a{
  color:#02b4e6;
  display:inline-block;
  text-decoration:mone;
}
.index-article h2 a {
  font-size:21px;
  font-size:2.1rem;
}
.index-article.featured-article h2 a{
  font-size:28px;
  font-size:2.8rem;
}
/* better for fading text ******
p.exerpt {
background: -webkit-linear-gradient(#555555, #eaebeb);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
*/
.auth-details {
  font-size:14px;
}

a.more-link {
  font-size: 15px;
  font-weight: 600;
  color: #9B9B9B;
}


/****** not recomanded *******/
.listing-post-header {
  overflow: hidden;
  position: relative;
}
/*
.listing-post-header::after {
position: absolute;
content: "";
bottom: 0;
width: 100%;
height: 100%;
background: -moz-linear-gradient(top,  rgba(234,235,235,1) 0%,rgba(255,255,255,0) 40%);
background: -webkit-linear-gradient(top,  rgba(234,235,235,1) 0%,rgba(255,255,255,0) 40%);
background: linear-gradient(to bottom,  rgba(234,235,235,1) 0%,rgba(255,255,255,0) 40%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#eaebeb',GradientType=0 );


pointer-events: none;
left: 0;
}
*/
/****** not recomanded *******/


/********* BLOG PAGINATION **********/
.blog-pagination {
  display: block;
  display: flex;
  text-align: center;
  padding: 15px;
  justify-content: center;
  align-items: center;
  background:#ffffff;
  margin-top:48px;
  flex-wrap: nowrap;
}
.blog-pagination > div {
  display: inline-block;
}
.blog-pagination-left {
  text-align: right;
  font-size: 22px;
}
.blog-pagination-right {
  text-align: left;
  font-size: 22px;
}
.blog-pagination a,
.blog-pagination span {
  display: inline-block;
  text-align: center;
  padding: 5px 10px;
  color: #02b4e6;
  min-width: 48px;
  border: 2px solid #ffffff;
}
.blog-pagination a:hover,
.blog-pagination a:focus {
  border: 2px solid #02b4e6;
}
.blog-pagination a.elipses {

}
.blog-pagination a.active {
  color: #02b4e6;
  pointer-events: none;
  cursor: default;
  border: 2px solid #02b4e6;
  background-color:#02b4e633;
}
.blog-pagination a.next-link,
.blog-pagination a.prev-link {
  color: #02b4e6;
}
.blog-pagination a.next-link:hover,
.blog-pagination a.prev-link:hover {

}


@media all and (max-width : 790px ) {

  .index-articles .featured-article {
    grid-column-start:initial;
    grid-column-end:initial;
  }
  .index-articles #index_subscription {
    grid-column-start:initial;
    grid-row-start:initial;
  }

  .blog-pagination {
    padding: 15px 0;
    justify-content: space-between;
    max-width:500px;
    margin-left: auto;
    margin-right: auto;
  }

  .blog-pagination a,
  .blog-pagination span {
    min-width: initial;
    padding:6px;
  }
  .blog-pagination a.view-all {
    display: none;
  }

  .first-page.prev-link, .last-page.next-link {
    display: none;
  }



}

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




/*********************************************/
/*********************************************/
/**************** BLOG POST *****************/

#post_view {
  display:flex;
  display:grid;
  grid-template-columns: 1fr 200px;
  grid-gap:24px;
  border-bottom: 1px solid #eeeeee;
  padding-bottom: 48px;
}
#post_view aside {
  background: #f8f9f9;
  position: relative;
}
#post_view .the-post {
  position:relative;
}

.post-author {
  display: flex;
  padding: 12px 0px;
  align-items: center;
}

.post-author .post-date {
  font-weight: 600;
  padding: 0 0 0 16px;
  position:relative;
  color:#9B9B9B;
}
.post-author .post-date::after {
  content: "";
  height: 4px;
  width: 120px;
  background: #02b4e6;
  position: absolute;
  left: 16px;
  bottom: -7px;
}
.post-author .post-author-name {
  font-weight: 600;
  padding: 8px 0 0 16px;
}
.post-author .post-author-name a:link {
  color:#6A6A6A;
}
#post_view .the-post p.topics,
.listing-topics {
  position: absolute;
  text-transform:uppercase;
  padding: 6px 12px;
  background: #182958;
  color: #ffffff;
  font-size:1.4rem;

}
#post_view .the-post p.topics a,
.listing-topics a {
  color: #ffffff;
  text-decoration:none;
  font-size:1.4rem;
}

#post_view img.author-img {
  border-radius: 100%;
  width: 70px;
  height: 70px;
}

#post_view .the-post h1 {
  font-size:28px;
  font-size:2.8rem;
  display:inline-block;
  line-height:1.4;
}




@media all and (max-width : 790px ) {
  #post_view,
  .post-CTA-under {
    grid-template-columns: 1fr; 
  }

}

/*************** END BLOG POST ***************/
/*********************************************/
/*********************************************/



@media all and (max-width : 790px ) {
  html{
    font-size:54.6875%;
  }
  .paddingTB {
    padding-top:calc(4.8rem / 2);
    padding-bottom:calc(4.8rem / 2);
  }
  .paddingT {
    padding-top:calc(4.8rem / 2);
    padding-bottom:0px;
  }
  .paddingB {
    padding-top:0px;
    padding-bottom:calc(4.8rem / 2);
  }
  /* ul li {
  margin-left: 20px;
} */
  .grid-half, 
  .grid-3, 
  .grid-4, 
  .grid-golden, 
  .grid-golden-reverse {
    display:block;
    display:grid;
    grid-template-columns: 1fr;
  }
}

a.screen-reader-text {display:none;}



ul#hsresults li > a:link {
  color: #02b4e6;
  font-weight: 600;
}

ul#hsresults li {
  margin: 0 0 12px 0;
}
.hs-search-results__pagination {
  display: inline-block;
  margin-bottom: 4rem;
}




/****** Form BITS ********/

/****** GDPR *********/

form .legal-consent-container {
  font-size:14px;
  color:#666666;
  padding: 0px 0px 24px 0px;
}

form .legal-consent-container .field.hs-form-field {
  margin-bottom: 0;
}

form .legal-consent-container p,
form .legal-consent-container p a:link {
  font-size:14px;
  padding: 0;
}
form .legal-consent-container p {
  color:#ffffff;
} 




form .legal-consent-container ul {
  line-height: 14px;
  color:#666666;
}
form .legal-consent-container .hs_cos_wrapper_type_form ul.inputs-list li label {
  font-size:14px!important;
  color:#666666;
}
form .legal-consent-container .hs-form-booleancheckbox-display {
  font-size:14px!important;
  color:#666666;
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
}
form ul.inputs-list {
  padding: 0;
}


/********** end GDPR ********/

form fieldset {
  max-width: none!important;
}

form .hs-form-field {
  margin-bottom: 24px;
}

form label {
  color: #111111;
  margin-bottom: 6px;
}

form .hs-error-msgs li {
  margin-left:0;
  font-size:smaller;
}
form .hs-error-msgs li:before {
  content:none;
}
form .hs-error-msgs label {
  color: #f2545b;
}


form .hs-form-required {
  color: #a95f5f;
}

form input[type="text"],
form input[type="password"],
form input[type="datetime"],
form input[type="datetime-local"],
form input[type="date"],
form input[type="month"],
form input[type="time"],
form input[type="week"],
form input[type="number"],
form input[type="email"],
form input[type="url"],
form input[type="search"],
form input[type="tel"],
form input[type="color"],
form input[type="file"],
form textarea,
form select {
  -webkit-appearance: none;
  -moz-appearance:    none;
  appearance:         none;
  border-radius: 2px;
  width: 100%;
  border: 1px solid #cccccc;
  padding: 12px;
  font-size: inherit;
  background:#ffffff;
}
form fieldset.form-columns-1 .hs-input {
  width:100%!important;
}
form select {
  background-image: linear-gradient(45deg,transparent 50%,#02b4e6 50%),linear-gradient(135deg,#02b4e6 50%,transparent 50%),linear-gradient(to right,#fff,#fff);
  background-position: calc(100% - 25px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),calc(100% - 2.5em) .5em;
  background-size: 10px 10px,10px 10px,1px 1.5em;
  background-repeat: no-repeat;
}


form textarea {
  min-height:90px;
}

.content-wrapper a {
    color: #02b4e6;
}
.the-post a {
    color: #02b4e6;
}