/*** Import *****/

@import url("404.css");
@import url("loading-btn.css");
@import url("loading-group.css");

/*** End ****/

.alert {
  background: #ffdb9b;
  padding: 20px 40px;
  min-width: 420px;
  position: fixed;
  right: 2rem;
  top: 10rem;
  border-radius: 4px;
  border-left: 8px solid #ffa502;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  z-index: 9999999999999;
  border: 1px rgba(236, 236, 236, 0.849) solid;
}

.alert.showAlert {
  opacity: 1;
  pointer-events: auto;
}

.alert.show {
  animation: show_slide 1s ease forwards;
}

@keyframes show_slide {
  0% {
    transform: translateX(100%);
  }

  40% {
    transform: translateX(-10%);
  }

  80% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-10px);
  }
}

.alert.hide {
  animation: hide_slide 1s ease forwards;
}

@keyframes hide_slide {
  0% {
    transform: translateX(-10px);
  }

  40% {
    transform: translateX(0%);
  }

  80% {
    transform: translateX(-10%);
  }

  100% {
    transform: translateX(100%);
  }
}

.alert .m-bold-text {
  font-weight: 700;
}

.alert .m-css-icon {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  color: #ce8500;
  font-size: 30px;
}

.alert .msg {
  padding: 0 20px;
  font-size: 18px;
  color: #ce8500;
}

.alert span.msg {
  display: flex;
  flex-direction: column;
  margin-left: 2rem;
}

.alert .close-btn {
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
  background: #ffd080;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
  display: flex;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}

.alert .close-btn:hover {
  background: #ffc766;
}

.alert .close-btn .fas {
  color: #ce8500;
  font-size: 22px;
  line-height: 40px;
}

/* Success */
.alert.success {
  background: #d4ffc1;
  border-left: 8px solid #0eff42;
}

.alert.success .m-css-icon {
  color: #2cc518;
}

.alert.success .close-btn .fas {
  color: #2bc217;
}

.alert.success .close-btn {
  background: #a6fd9b98;
  transition: 0.3s;
}

.alert.success .msg {
  padding: 0 20px;
  font-size: 18px;
  color: #10b60b;
  font-weight: 500;
}

.alert.success .close-btn:hover {
  background: #d7fbc7;
  transition: 0.3s;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.alert.success .close-btn .fas {
  color: #19d600;
  font-size: 22px;
  line-height: 40px;
}

/* Error */
.alert.error {
  background: #ffa6a6;
  border-left: 8px solid #ff0202;
}

.alert.error .m-css-icon {
  color: #c00a0a;
}

.alert.error .close-btn .fas {
  color: #c00a0a;
}

.alert.error .close-btn {
  background: #ff8484;
  transition: 0.3s;
}

.alert.error .msg {
  padding: 0 20px;
  font-size: 18px;
  color: #b80101;
  font-weight: 500;
}

.alert.error .close-btn:hover {
  background: #ff7575;
  transition: 0.3s;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.alert.error .close-btn .fas {
  color: #ce0000;
  font-size: 22px;
  line-height: 40px;
}

.alert {
  scale: 75%;
  right: -4rem;
  background-color: white !important;
}

.alert .close-btn .fas {
  color: #000000 !important;
}

.alert .m-bold-text {
  font-weight: 700 !important;
}

.alert .close-btn {
  background: unset !important;
}

.alert .msg {
  color: #000000 !important;
}

@media screen and (max-width: 421px) {
  .alert {
    min-width: 350px;
  }
  .alert .m-bold-text {
    display: none;
  }
}

.blog-info-tag span:before {
  content: ",";
  position: absolute;
  bottom: 6px;
  right: 0;
  height: 100%;
  font-size: 16px;
  width: auto;
  padding-right: 5px;
}

.blog-info-tag span {
  position: relative;
  display: inline-block;
  padding-right: 10px;
}

.blog-info-tag span:last-child:before {
  display: none;
}

.wpcf7 form .wpcf7-response-output {
  border: 0;
  margin: 15px 0;
  padding: 0;
  font-weight: bold;
  font-size: 1.6rem;
}

.wpcf7 form.sent .wpcf7-response-output {
  color: #46b450;
}

.wpcf7 form.invalid .wpcf7-response-output {
  color: red;
}

.img-copyright img {
  height: 1.3rem;
  margin-left: 0.5rem;
}

/* form tuyển dụng */
.recruit-popup-wrap input.wpcf7-form-control.form-input {
  width: 100%;
}

.recruit-popup-wrap textarea.wpcf7-form-control.form-text {
  width: 100%;
}

.recruit-popup-wrap span.wpcf7-spinner {
  position: absolute;
  top: 0.7rem;
  left: 4rem;
  z-index: 1;
}

.recruit-popup-wrap span.wpcf7-not-valid-tip {
  left: 2rem;
  top: 3rem;
  font-size: 1.1rem;
  position: absolute;
  font-weight: 600;
}

.form-upload .name-file {
  margin-top: 0;
}

div.name-file {
  display: flex;
  justify-content: center;
}

.form-upload span.wpcf7-not-valid-tip {
  left: 35rem;
  top: 12rem;
  width: 30rem;
}

.wpcf7-response-output {
  position: absolute;
}

.textarea span.wpcf7-not-valid-tip {
  position: absolute;
  top: 12rem;
}

.input-hidden {
  display: none;
}

/* page tuyển dụng */
.recruit-item.d-item.d-4 {
  margin: 1rem 0;
}

/* page liên hệ  */
.crform-form
  input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.form-input {
  width: 100%;
}

.crform-form .form-control.full-w.textarea {
  width: 100%;
}

.crform-form
  .full-w.textarea
  textarea.wpcf7-form-control.wpcf7-textarea.wpcf7-validates-as-required.form-text {
  width: 100%;
}

.crform-form span.wpcf7-spinner {
  position: absolute;
  top: 0.8rem;
  left: 3rem;
  z-index: 1;
}
.crform .crform-form .wpcf7-response-output {
  position: absolute;
  /* left: 16%; */
}
.crform-form span.wpcf7-not-valid-tip {
  position: absolute;
  font-size: 1.1rem;
  top: 2.7rem;
  left: 1.7rem;
}
.crform-form .textarea span.wpcf7-not-valid-tip {
  top: 12.5rem;
}
@media screen and (max-width: 400px) {
  .wpcf7 form.invalid .wpcf7-response-output {
    color: red;
    position: inherit;
  }
  .crform-form span.wpcf7-spinner {
    position: absolute;
    top: 0.2rem;
    left: 1rem;
    z-index: 1;
  }
}
.dont-know-container {
  display: flex;
  flex-wrap: nowrap;
  align-content: flex-end;
  justify-content: center;
  margin: 4rem;
}
.product_info-sensor
  .sensor-content-list
  .sensor-item-1
  .sensor-img-inner.infor {
  width: auto;
}
.textarea-input
  textarea.wpcf7-form-control.wpcf7-textarea.wpcf7-validates-as-required.form-text {
  width: 100%;
}
.textarea-input span.wpcf7-not-valid-tip {
  top: 12.5rem;
}

.page-numbers.gallery-page li {
  width: 4rem;
  height: 4rem;
}

.page-numbers.gallery-page li.disabled {
  background: #444444;
  color: white;
  cursor: pointer;
  line-height: 1.4rem;
  display: flex;
  justify-content: center;
  /* transition: 0.3s ease-in-out; */
  align-items: center;
}
.page-numbers.gallery-page li.active {
  background: rgba(68, 68, 68, 0.16);
  transition: 0.3s ease-in-out;
}
.page-numbers.gallery-page li {
  /* transition: 0.2s ease-in-out; */
  background: white;
  color: black;
  cursor: pointer;
  line-height: 1.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 4rem;
  height: 4rem;
  border-radius: 0.4rem;
}
.page-numbers.gallery-page li:hover {
  color: white;
  background: #37a76b;
}
.post-info-item .icon {
  filter: unset;
  -webkit-filter: unset;
}
.newsct .mona-content img {
  width: auto;
}

.lg-toolbar {
  top: calc(var(--headerHeightbot) + 2.4rem);
}

@media screen and (max-width: 1201px) {
  .lg-toolbar {
    top: calc(var(--headerHeighttop) + 2.4rem);
  }
}

.captcha span.wpcf7-form-control-wrap.input-captcha-cf7 {
  background-color: rgba(55, 167, 107, 0.1);
  display: block;
}

.lg-toolbar .lg-icon {
  color: white;
}

/* .form-control.captcha {
    display: inline;
    padding: 0;
}

.form-control.captcha .main-cf7-captcha {
    padding-bottom: 1rem;
} */

/* contact form trang chủ */
.form-control.bnnn {
  row-gap: 2.4rem;
}
.form-control.bnnn input {
  width: 100%;
}
.form-control.bnnn img {
  width: 30%;
  padding: 0;
}

.form-control.bnnn .form-control {
  margin: 0;
}
textarea.wpcf7-form-control.wpcf7-textarea.wpcf7-validates-as-required.form-text {
  height: 8rem;
}

/* page contact trang home */
.textarea-input span.wpcf7-not-valid-tip {
  top: 6.5rem;
}
.crform-form .textarea span.wpcf7-not-valid-tip {
  top: 8.5rem;
}
.wpcf7-response-output {
  position: static;
  top: 64rem;
}
.crform .crform-form .wpcf7-response-output {
  position: static;
}
.news-item-wrap::before {
  pointer-events: none;
}
li.lang-item a {
  display: flex;
  align-items: center;
}
h1.input-hidden.be {
    display: none;
}