/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
.h1, h1 {
  font-size: 1.6em;
}

.h2, h2 {
  font-size: 1.4em;
}

h3, h4 {
  font-size: 1.2em;
}

h5, h6 {
  font-size: 1.1em;
}

h5.post-title.is-large {
  font-size: 1.1em;
}

table {
  border-collapse: collapse;
  width: 50%;
}

table.thong-so-ky-thuat {
  width: 80%;
}

tr.bang-thong-so:nth-child(even) {
  background-color: #f2f2f2;
}

td, th {
  font-size: .9em;
  color: #777;
  border: solid 1px #ddd;
  padding-left: 0.4em !important;
  text-transform: unset;
  font-weight: normal;
}

td.thong-so {
  border: none;
}

.entry-content ul li {
  margin: 0;
}

.product_meta {
  font-size: .9em;
}

blockquote {
  font-size: .9em !important;
  color: #777 !important;
  border-left: none !important;
  padding: 0 .75em 0 .75em;
}

blockquote:before {
  font-family: "FontAwesome";
  content: '\f10d';
  color: #d2b077;
  float: left;
  font-size: 12px;
  font-style: italic;
  padding-right: 5px;
}

.wp-caption .wp-caption-text {
  background: none;
  padding: 0.4em 0 0 0;
  margin: 0 10px 0 10px;
}

.wp-caption { 
  margin-bottom: 20px !important;
}

.back-to-top, .back-to-top.active {
  font-size: small;
  background-color: #d2b077;
  border: none !important;
  border-radius: 2px;
  z-index: 999;
}

.back-to-top.active:hover {
  background: #d2b077 !important;
}

.icon-angle-up:before {
  font-size: x-large;
  color: #ffffff;
}

.button.is-outline {
  border: 1px solid;
  border-right: none;
  border-left: none;
}

.is-outline:hover, .primary.is-outline:hover {
  border-color: #446084 !important;
  background-color: unset !important;
  color: #446084 !important;
}

.wps-toc-title {
  font-size: 1.2em !important;
}

.wps-toc-list {
  font-size: 1em;
}

.wps-shortcode-wrapper {
  max-width: 60% !important;
}

.wps-expand {
  max-width: 100% !important;
}

.wps-table {
  margin-top: -15px;
}

.wps-inner-wrapper {
  border: 1px solid #D2B077 !important;
  border-radius: 4px;
  background: #d2b07770 !important;
}

#wps-toc-wrapper.wps-shortcode-wrapper .wps-inner-wrapper ul.wps-toc-list>li>a:hover {
  background-color: #fdebce !important;
}

#wps-expand.wps-shortcode-wrapper .wps-expand-link {
  background: linear-gradient(to bottom, rgba(255 255 255 / 0), rgba(255 255 255 / 62.5), rgba(255 255 255 / 1));
  position: absolute;
  width: 100%;
  height: 4em;
  bottom: 1.2em;
  z-index: 99;
}

a.bt-expand {
  position: relative;
  display: block;
  border: solid 1px;
  border-radius: .25em;
  max-width: 8em;
  margin: 2em auto;
  padding-top: .2em;
  padding-bottom: .2em;
}

#wps-expand.wps-shortcode-wrapper .wps-expand-link i.fa.fa-sort-up {
  position: relative;
  top: 5px;
}

.woocommerce-Reviews-title, .yikes-custom-woo-tab-title {
  display: none;
}

.button-product {
  background: #334862;
  padding: 4px 4px 4px 10px;
  border-radius: 4px;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 10px;
  width: 162px;
  font-size: .9em;
}

p.liet-ke {
  padding: 0 .75em 0 .75em;
}

p.uu-dai {
  font-size: .9em;
  color: #008b71;
  border: dashed 1px #008b71;
  border-radius: 4px;
  padding: 2px 4px;
  margin-right: 4px;
  display: inline-block;
  text-align: center;
}

.entry-header-text.text-center {
  padding-left: .5em;
  padding-right: .5em;
}

.flickity-prev-next-button svg {
  background: #111;
  border-radius: 5%;
}

.flickity-prev-next-button .arrow, .flickity-prev-next-button svg {
  fill: #fff;
}

button.flickity-button.flickity-prev-next-button.previous {
  left: 50px;
}

button.flickity-button.flickity-prev-next-button.next {
  right: 50px;
}

.slider .flickity-prev-next-button:hover svg, .slider .flickity-prev-next-button:hover .arrow {
  fill: #d2b077 !important;
}

.slider-nav-reveal .flickity-prev-next-button, .slider-nav-reveal .flickity-prev-next-button:hover {
  background-color: unset;
  box-shadow: unset;
}

.posted-on {
  margin-right: 5px;
}

.byline {
  margin-left: 5px;
}

.nav-pagination>li>a, .nav-pagination>li>span {
  border: 1px solid;
  border-radius: unset;
  font-size: .9em;
  font-weight: normal;
}

i.fa-solid.fa-droplet{
  position: relative;
  bottom: 2.8px;
}

.row-small>.flickity-viewport>.flickity-slider>.col {
  padding: 0 9.8px 0 19.6px;
}

/***** CSS Related Posts *****/
.feature {
  position: relative;
  overflow: hidden;
}

.feature::before {
  content: "";
  display: block;
  padding-top: 65%;
}

.feature .image {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  background-size: cover;
  background-position: inherit;
}

ul.row.related-post li {
  list-style: none;
}

.related-title {
  line-height: 1.3 !important;
  margin-top: 10px !important;
  padding: 0 10px;
  text-align: center;
}

.related-title a{
  color: #555555;
  font-weight: 400;
  font-size: 1em;
}

.col.large-4.related-post {
  padding: 0 5px 30px !important;
}
/***** End CSS Related Posts *****/

.related-products ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;    
  flex-wrap: wrap;    
  gap: 0;
  justify-content: flex-start;
}

.related-products li {
  flex: 0 0 auto;
  margin-left: 10px !important;
}

.related-products .thumbnail {
  display: block;
  overflow: hidden;
  max-width: 101.500px;
  border: solid 1px rgba(0,0,0,.2);
  transition: transform 0.3s ease, border 0.3s ease; 
}

.related-products .thumbnail img {
  transition: transform 0.3s ease;
}

.related-products .thumbnail img:hover {
  transform: scale(1.1);
}

.image-tools.bottom.left {
  transform: scale(0.8);
}

.messenger-artistry {
  display: block !important;
  position: fixed !important;
  bottom: 20px !important;
  right: 50px !important;
  width: 45px !important;
  z-index: 99999999999 !important;
}

/***** CSS Pofily *****/
.viwcpf_wrap_filter-content .viwcpf_filter-items .viwcpf_filter-item a.viwcpf_chosen:after {
  top: unset;
  right: unset;
  transform: translateY(-70%);
}

.viwcpf_checkbox_checkmark {
  top: 5px;
  height: 18px;
  width: 18px;
}

.viwcpf_checkbox label .viwcpf_checkbox_checkmark:after {
  left: 7px;
  top: 3px;
}

.viwcpf_term-label {
  font-weight: 400;
}
/***** End CSS Pofily *****/

@media only screen and (min-width: 720px) {
/*************** ADD TABLET ONLY CSS HERE  ***************/
.large-columns-2>.col {
  flex-basis: 50% !important;
  max-width: 100%;
}

.button.icon.back-to-top {
  opacity: 0 !important;
}

.button.icon.back-to-top.active {
  opacity: 1 !important;
}

.col.large-4.related-post {
  flex-basis: 33.3333333333%;
}
}
@media only screen and (max-width: 710px) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
.col {
  padding-left: 10px;
  padding-right: 10px;
}

.h1, h1 {
  font-size: 1.35em;
}

.h2, h2 {
  font-size: 1.3em;
}

h3, h4 {
  font-size: 1.25em;
}

h5, h6 {
  font-size: 1.2em;
}

h5.post-title.is-large {
  font-size: 1.2em;
}

blockquote {
  color: #777 !important;
  padding: 0 10px 0 10px;
}

table {
  border-collapse: collapse;
  width: 100%;
  table-layout: unset; 
}

table.thong-so-ky-thuat {
  width: 100%;
}

.wps-shortcode-wrapper {
  max-width: 100% !important;
}

a.bt-expand {
  max-width: 6em;
  padding-top: .1em;
  padding-bottom: .1em;
}

.wp-caption .wp-caption-text {
  font-size: .9em;
  padding: 0.4em 0.4em 0 0.4em;
}

.button-product {
  padding: 4px 4px;
  width: 158px;
  margin: 6px 2px;
}

p.liet-ke {
  padding: 0 10px 0 10px;
}

.slider-wrapper .flickity-prev-next-button {
  display: block;
}

.flickity-prev-next-button svg {
  height: 50%;
  width: 70%;
}

button.flickity-button.flickity-prev-next-button.previous {
  left: 6px !important;
}

button.flickity-button.flickity-prev-next-button.next {
  right: 6px !important;
}

.slider-nav-push.slider-nav-reveal .flickity-prev-next-button svg {
  height: 10%;
  width: 100%;
}

button.button.secondary.is-outline.is-small.mb-0 {
  width: 40%;
}

.button.icon.back-to-top {
  opacity: 0 !important;
}

.button.icon.back-to-top.active {
  opacity: 1 !important;
}

a.button.secondary.is-outline.is-small.mb-0{
  width: 125px;
}

.col.large-4.related-post {
  padding: 0 15px 30px !important;
}

.related-products .thumbnail {
  max-width: 59px;
}

.messenger-artistry {
  right: 25px !important;
  bottom: 19px !important;
}
}