/*
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.   ***************/
#button-contact-vr {
    position: fixed;
    bottom: 100px;
    z-index: 999;
    right: 0;
  }
  
  /*phone*/
  #button-contact-vr .button-contact {
    position: relative;
    margin-top: -5px;
  }
  
  #button-contact-vr .button-contact .phone-vr {
    position: relative;
    visibility: visible;
    background-color: transparent;
    width: 90px;
    height: 90px;
    cursor: pointer;
    z-index: 11;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0);
    transition: visibility .5s;
    left: 0;
    bottom: 0;
    display: block;
  }
  
  .phone-vr-circle-fill {
    width: 65px;
    height: 65px;
    top: 12px;
    left: 12px;
    position: absolute;
    box-shadow: 0 0 0 0 #c31d1d;
    background-color: #cf203170;
    border-radius: 50%;
    border: 2px solid transparent;
    -webkit-animation: phone-vr-circle-fill 2.3s infinite ease-in-out;
    animation: phone-vr-circle-fill 2.3s infinite ease-in-out;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animuiion: zoom 1.3s infinite;
    animation: zoom 1.3s infinite;
  }
  
  .phone-vr-img-circle {
    background-color: #CF2031;
    width: 40px;
    height: 40px;
    line-height: 40px;
    top: 25px;
    left: 25px;
    position: absolute;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
    animation: phone-vr-circle-fill 1s infinite ease-in-out;
  }
  
  .phone-vr-img-circle a {
    display: block;
    line-height: 37px;
  }
  
  .phone-vr-img-circle img {
    max-height: 25px;
    max-width: 27px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
  }
  
  @-webkit-keyframes phone-vr-circle-fill {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }
  
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
    }
  
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
    }
  
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
    }
  
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg);
    }
  
    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }
  
    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }
  }
  
  @-webkit-keyframes zoom {
    0% {
        transform: scale(.9)
    }
  
    70% {
        transform: scale(1);
        box-shadow: 0 0 0 15px transparent
    }
  
    100% {
        transform: scale(.9);
        box-shadow: 0 0 0 0 transparent
    }
  }
  
  @keyframes zoom {
    0% {
        transform: scale(.9)
    }
  
    70% {
        transform: scale(1);
        box-shadow: 0 0 0 15px transparent
    }
  
    100% {
        transform: scale(.9);
        box-shadow: 0 0 0 0 transparent
    }
  }
  
  .phone-bar a {
    position: fixed;
    bottom: 25px;
    left: 30px;
    z-index: -1;
    color: #fff;
    font-size: 16px;
    padding: 8px 15px 7px 50px;
    border-radius: 100px;
    white-space: nowrap;
  }
  
  .phone-bar a:hover {
    opacity: 0.8;
    color: #fff;
  }
  
  #zalo-vr .phone-vr-img-circle {
    background-color: #1F5E9D;
  }
  
  #zalo-vr .phone-vr-circle-fill {
    box-shadow: 0 0 0 0 #1f5e9da3;
    background-color: #1f5e9d7a;
  }
body{
  font-size: 12px;
    -ms-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -o-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    background-color: #fff;
}
#main, #wrapper {
        margin: 0 auto;
        max-width: 420px;
        box-shadow: 0px 10px 30px 0px #0000001A;
}
.sec-01{
}
.sec-01 h3{
      width: 100%;
    display: inline-block;
    word-break: break-word;
    background-size: cover;
    background-position: center center;
      font-size: 28px;
    font-weight: bold;
    line-height: 1.6;
    color: rgb(255, 228, 1);
    text-align: center;
    text-shadow: rgb(0, 0, 0) 1px 2px 6px;
}
.sec-01 p{
  font-size: 22px;
    font-weight: bold;
    line-height: 1.6;
    color: rgb(255, 255, 255);
    text-align: center;
}
.col12-ladi-box .col-inner{
      border-width: 3px;
      border-style: dashed;
      border-color: rgb(140, 2, 0);
      background-color: rgba(255, 255, 255, 0.44);
      padding: 20px;
}
.text-mom{
}
.text-mom h2{
  background-image: linear-gradient(#199684, rgb(123, 67, 151));
  background-color: initial;
  background-size: initial;
  background-origin: initial;
  background-position: initial;
  background-repeat: initial;
  background-attachment: initial;
  font-family: Bungee, cursive;
  font-size: 25px;
  font-weight: bold;
  line-height: 1.2;
  color: rgb(140, 2, 0);
  letter-spacing: 1px;
  text-align: center;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.text-mom p{
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-image: linear-gradient(rgb(142, 14, 0), rgb(31, 28, 24));
      background-color: initial;
      background-size: initial;
      background-origin: initial;
      background-position: initial;
      background-repeat: initial;
      background-attachment: initial;
      font-family: Sriracha, cursive;
      font-size: 18px;
      font-weight: bold;
      line-height: 1.6;
      color: rgb(0, 0, 0);
      letter-spacing: 0px;
      /* text-align: left; */
}
.text-mom .ladi-line-mom{
  border-top: 3px dashed #199684;
  width: 235px;
  margin: 0 auto;
}
.icon-mom{align-items: center;}
.icon-mom .icon-box-img{
}
.icon-mom .icon-box-img .icon{/* border: 2px solid rgb(241, 243, 244); *//* border-radius: 50%; *//* width: 61px; *//* height: 61px; *//* overflow: hidden; */}
.icon-mom .icon-box-img .icon .icon-inner{width: 61px;height: 61px;/* overflow: hidden; */position: relative;}
.icon-mom .icon-box-img .icon img{
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 2px solid rgb(241, 243, 244);
  border-radius: 50%;
}

.icon-mom .icon-box-text{
}
.icon-mom .icon-box-text p{font-size: 16px;font-weight: bold;line-height: 1.6;color: rgb(0, 0, 0);}
.text-dieudo{
}
.text-dieudo h2{
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(#199684, #44b08c);
  background-color: initial;
  background-size: initial;
  background-origin: initial;
  background-position: initial;
  background-repeat: initial;
  background-attachment: initial;
  font-family: "Baloo Bhaina", cursive;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.2;
  color: rgb(140, 2, 0);
  letter-spacing: 1px;
  text-align: center;
}
.but-ngay{text-align: center;animation-name: pulse;animation-delay: 1s;animation-duration: 1s;animation-iteration-count: infinite;}
.but-ngay h3{position: relative;display: inline;animation-name: pulse;animation-delay: 1s;animation-duration: 1s;animation-iteration-count: infinite;}
.but-ngay h3:before{
  content:"";
  background: #fff;
  position: absolute;
  left: 9px;
  width: 100%;
  height: 161%;
}
.but-ngay h3 span{background: #199684;font-size: 18px;font-weight: bold;line-height: 1.6;color: #fff;text-align: left;padding: 10px;position: relative;border-width: 1px;border-radius: 1px;border-style: solid;border-color: rgb(241, 243, 244);/* background-color: rgb(56, 182, 255); */box-shadow: rgb(241, 243, 244) 8px 8px 0px 0px;}
 @keyframes pulse {
            0% {
                -webkit-transform: scale(1);
                transform: scale(1);
            }
            50% {
                -webkit-transform: scale(1.1);
                transform: scale(1.1);
            }
            100% {
                -webkit-transform: scale(1);
                transform: scale(1);
            }
        }
        
        @keyframes pulse {
            0% {
                -webkit-transform: scale(1);
                -ms-transform: scale(1);
                transform: scale(1);
            }
            50% {
                -webkit-transform: scale(1.1);
                -ms-transform: scale(1.1);
                transform: scale(1.1);
            }
            100% {
                -webkit-transform: scale(1);
                -ms-transform: scale(1);
                transform: scale(1);
            }
        }
        
        @-webkit-keyframes bounce {
            0%, 100%, 20%, 50%, 80% {
                -webkit-transform: translateY(0);
                transform: translateY(0);
            }
            40% {
                -webkit-transform: translateY(-30px);
                transform: translateY(-30px);
            }
            60% {
                -webkit-transform: translateY(-15px);
                transform: translateY(-15px);
            }
        }
        
        @keyframes bounce {
            0%, 100%, 20%, 50%, 80% {
                -webkit-transform: translateY(0);
                -ms-transform: translateY(0);
                transform: translateY(0);
            }
            40% {
                -webkit-transform: translateY(-30px);
                -ms-transform: translateY(-30px);
                transform: translateY(-30px);
            }
            60% {
                -webkit-transform: translateY(-15px);
                -ms-transform: translateY(-15px);
                transform: translateY(-15px);
            }
        }
.img-muiten{
}
.img-muiten p{margin-bottom: 0;}
.img-muiten img{margin-bottom: 0 !important;}
.col10-combo .col-inner{
  border-width: 3px;
  border-style: dashed;
  border-color: rgb(255, 255, 255);
  background-color: rgba(255, 255, 255, 0.21);
  margin-top: 5px;
  padding: 10px;
}
.text-combo{
}
.text-combo h3{
  font-family: "Bungee Inline", cursive;
  font-size: 30px;
  line-height: 1.4;
  color: #199684;
  text-align: center;
  text-shadow: #ffffff 2px 2px 3px;
}
.text-combo p{
    font-size: 21px;
    font-weight: bold;
    font-style: italic;
    line-height: 1.2;
    color: rgb(0, 0, 0);
    text-align: center;
    margin-bottom: 0;
}
.img-tay{
}
.img-tay p{animation-name: bounce;animation-delay: 1s;animation-duration: 1s;animation-iteration-count: infinite;margin-bottom: 0;}
.img-tay img{margin-bottom: 0 !important;}
.ladi-section-background{padding-bottom: 20px;}
.ladi-section-background h2{
  font-family: "Bungee Inline", cursive;
  font-size: 30px;
  line-height: 1.4;
  color: rgb(255, 252, 1);
  /* text-align: center; */
  text-shadow: rgb(0, 0, 0) 2px 2px 3px;
  padding: 0 15px;
}
.ladi-section-background h3{
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 background-image: linear-gradient(#fff, rgb(56, 249, 215));
 background-color: initial;
 background-size: initial;
 background-origin: initial;
 background-position: initial;
 background-repeat: initial;
 background-attachment: initial;
 font-family: "Alfa Slab One", cursive;
 font-size: 28px;
 line-height: 1.6;
 color: rgb(0, 0, 0);
 letter-spacing: 1px;
 text-align: center;
 padding: 0 15px;
}
.product-gallery{
}
.product-gallery .slider-for{margin-bottom: 12px;}
.product-gallery .slider-for .slick-prev{
  left: 15px;
    z-index: 9;
}
.product-gallery .slider-for .slick-next {
    right: 15px;
    z-index: 9;
}
.product-gallery .slider-nav{
   /* margin: 0 -3px; */
}
.product-gallery  .slider-nav .slick-slide {
    padding: 0 3px; /* chỉnh 6px – 10px tùy ý */
}
.product-gallery .slider-nav .slick-prev{
  left: 0;
  z-index: 9;
}
.product-gallery .slider-nav .slick-next {
    right: 0;
    z-index: 9;
}
.content-sach{
      font-size: 16px;
      line-height: 1.4;
      color: rgb(255, 255, 255);
      text-align: left;
      padding: 10px 15px;
      padding-top: 30px;
}
.content-sach h6{
  font-size: 15px;
  font-weight: bold;
  line-height: 1.2;
  color: rgb(255, 228, 1);
  text-align: center;
  margin-bottom: 20px;
}
.content-sach p{margin-bottom: 5px;}
.content-sach img{
   filter: brightness(0) invert(1);
   -webkit-filter: brightness(0) invert(1);
}
.text-dautu{
}
.text-dautu h3{
      -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  background-image: linear-gradient(rgb(255, 226, 89), rgb(255, 167, 81));
    background-color: initial;
    background-size: initial;
    background-origin: initial;
    background-position: initial;
    background-repeat: initial;
    background-attachment: initial;
    font-family: Bungee, cursive;
    font-size: 20px;
    line-height: 1.6;
    color: rgb(0, 0, 0);
    text-align: center;
}
.text-dautu p{
}
.text-dautu img{margin-bottom: 0 !important;}
.col12-taisao{
}
.col12-taisao .col-inner{
  border-width: 3px;
    border-style: dashed;
    border-color: rgb(255, 255, 255);
    background-color: rgba(255, 255, 255, 0.21);
}
.text-taisao{
}
.text-taisao h2{
  font-family: "Bungee Inline", cursive;
    font-size: 30px;
    line-height: 1.4;
    color: rgb(255, 252, 1);
    text-align: center;
    text-shadow: rgb(0, 0, 0) 2px 2px 3px;
}
.col10-cv>.col-inner{
  background-color: rgb(255, 255, 255);
  border-width: 2px;
  border-radius: 22px;
  border-style: solid;
  border-color: rgb(241, 243, 244);
  box-shadow: rgb(0, 0, 0) 0px 15px 15px -15px;
  padding: 10px 10px;
}
.text-vc{
}
.text-vc h3{
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(rgb(255, 106, 0), rgb(238, 9, 121));
  background-color: initial;
  background-size: initial;
  background-origin: initial;
  background-position: initial;
  background-repeat: initial;
  background-attachment: initial;
  font-family: Bungee, cursive;
  font-size: 23px;
  line-height: 1.6;
  color: rgb(0, 0, 0);
  text-align: left;
  margin-bottom: 0;
}
.text-vc h4{
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-image: linear-gradient(rgb(170, 7, 107), rgb(97, 4, 95));
  background-color: initial;
  background-size: initial;
  background-origin: initial;
  background-position: initial;
  background-repeat: initial;
  background-attachment: initial;
  font-family: Bungee, cursive;
  font-size: 22px;
  line-height: 1.6;
  color: rgb(255, 3, 3);
  /* text-align: left; */
  margin-bottom: 0;
}
.text-lh{
}
.text-lh p{
  font-size: 16px;
  line-height: 1.6;
  color: rgb(0, 0, 0);
  text-align: justify;
  margin-bottom: 0;
  font-family: "Roboto Slab", serif;
}
.text-img{
}
.text-img p{margin-bottom: 0;}
.text-img img{margin-bottom: 0 !important;}
.row-chuyenvien{position: relative;}
.row-chuyenvien:before{
  content:"";
  position: absolute;
  right: 28px;
  bottom: -33%;
  background: url(images/cong.png) no-repeat;
  width: 90px;
  height: 90px;
  background-size: 90px 90px;
  z-index: 9;
  transform: rotate(28deg);
}
.text-banggia{
  background-color: rgb(241, 243, 244);
  padding: 10px;
}
.text-banggia h3{
  font-family: "Roboto Slab", serif;
    font-size: 26px;
    font-weight: bold;
    line-height: 1.6;
    color: rgb(255, 1, 1);
    text-align: left;
}
.text-banggia p{
  font-family: Tinos, serif;
  font-size: 22.06px;
  font-weight: bold;
  line-height: 1.6;
  color: rgb(0, 0, 0);
  margin-bottom: 0;
}
.form-contact{
  border-width: 3px;
  border-radius: 15px;
  border-style: solid;
  border-color: rgb(0, 0, 0);
  background-color: rgb(1, 108, 247);
  overflow: hidden;
  padding: 10px;
  color: #fff;
}
.form-contact h3{
  font-family: Tinos, serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3;
    color: rgb(255, 254, 254);
    text-align: center;
}
.form-contact .wpcf7-form-control{
  
}
.form-contact .wpcf7-form-control .wpcf7-list-item{
  margin-right: 0;
  background: #fff;
  margin-bottom: 5px;
  border-radius: 5px;
  width: 100%;
}
.form-contact input.wpcf7-text{border-radius: 10px;}
.form-contact .wpcf7-form-control .wpcf7-list-item label{display: flex;align-items: center;}
.form-contact .wpcf7-form-control .wpcf7-list-item label input{
    width: 20px;
    margin-bottom: 0;
}
.form-contact .wpcf7-form-control .wpcf7-list-item .wpcf7-list-item-label{font-weight: 400;width: calc(100% - 20px);}
.form-contact h4{font-weight: 400;color: #fff;/* text-align: center; */line-height: 25px;margin: 10px 0;font-size: 16px;}
.form-contact .wpcf7-spinner{
  display:none;
}
.but-buy{animation-name: pulse;animation-delay: 1s;animation-duration: 1s;animation-iteration-count: infinite;font-size: 19px !important;border-radius: 25px !important;margin-right: 0;}
.col12-free >.col-inner{
  background-color: rgb(241, 243, 244);
  padding: 15px;
}
.text-free{
}
.text-free h3{
  font-size: 16px;
    font-weight: bold;
    line-height: 1.6;
    color: rgb(0, 0, 0);
    text-align: left;
}
.col12-ck >.col-inner{
  background-color: rgb(255, 252, 1);
  padding: 15px;
}
.icon-ck{align-items: center;}
.icon-ck .icon-box-text{
}
.icon-ck .icon-box-text h3{
      font-size: 16px;
    font-weight: bold;
    line-height: 1.6;
    color: rgb(0, 0, 0);
}
.col-ft1 .icon-box{align-items: center;}
.col-ft1 .icon-box .icon-box-img{
  width: 15px !important;
}
.col-ft1 .icon-box .icon-box-text{
}
.col-ft1 .icon-box .icon-box-text p{
font-weight: 500;
font-size: 14px;
line-height: 20px;
}
.col-ft1 p{margin-bottom: 0;}
.col-ft1 p img{/* margin-bottom: 0 !important; */margin-top: 0 !important;}
.col-ft1 h3{
font-weight: 700;
font-size: 16.78px;
text-align: center;
color:#ffff;
}