/* custom */.table-sm {font-size: 1rem}
/* navbar */@media only screen and (max-width:769px){.nav-link-0 {color:#000000!important;font-weight:500!important}}

      
/* v2 */
@media only screen and (min-width: 1200px) {
  .figure-float-start { float:left; margin:0 1.2rem 1.2rem 0; }
  .figure-float-end { float:right; margin:0 0 1.2rem 1.2rem; }
  .figure-float-start, .figure-float-end { max-width: 47%; }
  .figure-float-start + p, .figure-float-end + p { margin-top: 0 !important; }
  
  .figure-float-start img { border-top-left-radius: 5rem; }
  .figure-float-end img { border-top-right-radius: 5rem; }
  .figure-float-center img { border-top-right-radius: 8rem; border-top-left-radius: 1.3rem; }
}

@media only screen and (max-width: 1200px) {
  .figure-float-start, .figure-float-end { text-align: center; margin: 2rem 0; }
  .figure-float-start img, .figure-float-end img { border-top-left-radius: 1.3rem; border-top-right-radius: 8rem; }
}

.article-figure figure { position: relative; margin-bottom: 0; }
.article-figure figure figcaption { display: block; font-size: .75em; text-align: left; font-style: italic; font-weight: 400; }
.article-figure figure img { margin-bottom:.25rem!important; background-color: var(--light); }
.figure-float-center { text-align: center; margin: 2rem 0; }
.figure-float-center figure { text-align: center; display: inline-block; margin-left: auto; margin-right: auto; }

h3.section-heading, p.section-heading { margin: 2.2rem 2rem 3rem 2rem !important; font-size: calc(1.275rem + .3vw) !important; }

.article-tips-intro-container {  margin-bottom: 2rem; padding: 1rem; border: var(--border-color) 1px solid; box-shadow: 0 6px 12px rgba(140,152,164,0.08); border-radius: var(--border-radius); }
.article-tips-intro-p { color: var(--primary); }
.article-inner-qa { color: var(--primary); font-weight: 500 !important; }

.article-section-opening { margin-bottom: 2rem; padding: 1rem; border: var(--border-color) 2px solid; border-radius: var(--border-radius); } 
.article-section-opening p, .article-section-opening ul, .article-section-opening ol { padding-bottom: 0; margin-bottom: 0; }
.article-section-opening-nostyle ul, .article-section-opening-nostyle ol { padding-bottom: 0; margin-bottom: 0; }
.article-section-opening-nostyle { margin-bottom: 2rem !important;  }

.article-references a { overflow-wrap: break-word;  }

.tiktok-embed { display:block !important; margin:auto !important; padding:0 !important }
.tiktok-embed section { margin:0 !important; padding:0 !important }

h2#tips:before, h2#references:before, h2#facts:before, h2#qa_headline:before, h2#rate_box:before, h2.hashed:before { content: '#'; padding-right: 0.8rem; color: var(--primary); }

.article-tips-intro-container + .article-inline-share { margin-top: -1rem; }
.article-inline-share {
  margin-bottom: 2rem;
  padding: 1rem;
  border-left: var(--border-color) 5px solid;
}


/* Template_* */
#Template_G .article-section,
#Template_0 .article-section,
#Template_2 .article-section { margin-bottom:4rem }

#Template_G .article-section .article-figure + p,
#Template_0 .article-section .article-figure + p,
#Template_2 .article-section .article-figure + p { margin-top:1rem !important }

#Template_G .article-inner-qa,
#Template_0 .article-inner-qa { color: inherit; font-weight: 500; }
#Template_G .article-tips-heading,
#Template_0 .article-tips-heading { font-size: 1.3rem !important; font-weight: 700; }

.article-box--top-tips { margin-bottom: 3rem; }

@media (min-width: 1200px) {
  #Template_G h3, 
  #Template_0 h3, 
  #Template_1 h3,
  #Template_2 h3 { font-size: 1.75rem !important; }
}


img.lazy[data-loaded="true"] {
  height: auto;
  max-width: 100%;
}


/* <h2 data-count="1/10">... </h2> */
h2[data-count]:before {
  content: attr(data-count);
  margin-right: .8rem;
  position: relative;
  background: linear-gradient(45deg, var(--gray-900) 0%, var(--gray-700) 100%);
  color: #ffffff;
  padding: .3rem .6rem;
  border-radius: var(--border-radius);
  font-weight: normal;
  line-height: 1.5;
}

.btn-visit { background-color: #f69422; border-color: #f69422 !important; color: #ffffff !important; }
.btn-visit:hover { background-color: #e08316; }

.link-visit { color: #ff8338 !important; }
.link-visit:hover { text-decoration: underline !important; }
  
.fs-xs { font-size: .5rem !important; }
.fs-sm { font-size: 1.06rem !important; }
.fs-lg { font-size: 1.2rem !important; }
.fs-xl { font-size: 1.3rem !important; }


/* thumbnail/grid overlay bottom  */
.overlay-bottom:before {
  content: "";
  position: absolute;
  height: 50%;
  width: 100%;
  bottom: 0;
  left: 0;
  right: 0;
  background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black));
  background-image: linear-gradient(180deg, transparent, black);
  z-index: 1;
}



/*

  Article accordion

    <div class="accordion-quick">
      <h3>...</h3>
      <p>...</p>
    </div>

*/
.accordion-quick{padding:1.3rem;margin-bottom:.5rem;border:1px solid var(--border-color);border-radius:var(--border-radius);cursor:pointer;user-select:none}
.accordion-quick h3{display:flex;align-items:center;position:relative;cursor:pointer;margin-bottom:0;font-size:1.1rem}
.accordion-quick h3:before{content:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20px' height='20px' viewBox='0 0 24 24'><g fill='none'><polygon points='0 0 24 0 24 24 0 24'></polygon><path fill='%23000000' d='M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z' fill-rule='nonzero' transform='translate(12.000003, 11.999999) rotate(-270.000000) translate(-12.000003, -11.999999)'></path></g></svg>");margin-right:.3rem;line-height:1}
.accordion-quick.active h3:before{transform: rotate(90deg);-webkit-transform: rotate(90deg)}
.accordion-quick p { margin:1rem 0 0!important }
.accordion-quick:not(.active) p { display: none; }



.section-faq {
  margin: 2rem 0;
  background-color: var(--gray-200);
  padding: 1.5rem;
  border-radius: var(--border-radius);
}
.section-faq ul { margin: 0; }
.section-faq li:not(:last-child) { padding-bottom: 1.3rem; }




/*

  Info box (.article-tip, .article-info)

*/
.article-tip, .article-info {
  background-color: #fbf5ed;
  background-image: url(/assets/images/svg/wave-background-mobile.svg);
  background-position: bottom right;
  background-repeat: no-repeat;
  border:0!important;
  padding: 1.6rem!important;

}
@media (min-width: 768px) {
  .article-tip, .article-info {
    background-image: url(/assets/images/svg/wave-background-desktop.svg);
    padding: 2.2rem!important;
  }
}




/*

  Article fact

*/
.article-fact { min-height: 81px; display:block; position:relative; padding:1rem 1rem 1rem 5.4rem; border: var(--border-color) 2px solid; border-radius: 0.5rem; }
.article-fact:before {
  content: '';
  position: absolute;
  background-position: center;
  width: 60px; height: 60px;
  left: 1rem; 

  transform: rotate(270deg);
  background: url('/assets/images/did-you-know/4_60.jpg') no-repeat;
  margin-top: -0.3rem;
}



/*

  Article takeawys

*/
#key_takeaways {
  background-color: #fbf5ed; padding: 1.6rem!important; border-radius: 0.6rem;
}





/*

  Article faq

*/
#article-faq{border:2px solid var(--border-color);border-radius:.8rem;padding:2rem 2rem .6rem 2rem;margin-top:3rem}
#article-faq h3{font-size:2rem;margin-bottom:2.3rem;font-weight:bold}
#article-faq h4{font-size:1.2rem;margin-top:2rem;font-weight:bold}






/*

  Shortcodes

*/
.shortcode iframe { margin-bottom: 0!important; } 
  
  /* google trends : chart */
  .shortcode-trends-chart,.shortcode-trends-map{background-color: var(--light)} 
  .shortcode-trends-chart.ratio { --aspect-ratio: 54.5% }
  @media only screen and (max-width:1200px){.shortcode-trends-chart.ratio { --aspect-ratio: 59.6% }}
  @media only screen and (max-width:1024px){.shortcode-trends-chart.ratio { --aspect-ratio: 59.7% }}
  @media only screen and (max-width:769px){.shortcode-trends-chart.ratio { --aspect-ratio: 61% }}
  @media only screen and (max-width:425px){.shortcode-trends-chart.ratio { --aspect-ratio: 91.7% }}
  @media only screen and (max-width:375px){.shortcode-trends-chart.ratio { --aspect-ratio: 105% }}

  /* google trends : map */
  .shortcode-trends-map.ratio { --aspect-ratio: 53.8% }
  @media only screen and (max-width:1200px){.shortcode-trends-map.ratio { --aspect-ratio: 53.6% }}
  @media only screen and (max-width:1024px){.shortcode-trends-map.ratio { --aspect-ratio: 96.8% }}
  @media only screen and (max-width:769px){.shortcode-trends-map.ratio { --aspect-ratio: 60% }}
  @media only screen and (max-width:425px){.shortcode-trends-map.ratio { --aspect-ratio: 149.5% }}
  @media only screen and (max-width:375px){.shortcode-trends-map.ratio { --aspect-ratio: 175% }}



/* 

  ezoic layout issue  

*/
.ez-video-wrap{margin:3rem 0}
@media only screen and (min-width:1024px){
  .row>.ezoic-autoinsert-video {width:auto!important;display:inline-block;position:absolute;}
}