.font-40{
    font-size: 40px;
    margin-bottom: 33px;
}
.font-24{
    font-size: 24px;
}
.font-20{
    font-size: 20px;
}
.font-22{
    font-size: 22px;
}
.font-18{
    font-size: 18px !important;
}
.font-16{
    font-size: 16px !important;
}
.font-14{
    font-size: 14px !important;
}
.font-13{
    font-size: 13px !important;
}
.font-12{
    font-size: 12px !important;
}
.font-11{
    font-size: 11px !important;
}
.font-30 {
    font-size: 30px;
    /*color: #ffcd08 !important;*/
    margin-top: 8px;
    margin-bottom: 25px !important;
}

.font-40w{
    font-size: 40px; font-weight:bold;
}
.font-24w{
    font-size: 24px;; font-weight:bold;
}
.font-20w{
    font-size: 20px;; font-weight:bold;
}
.font-22w{
    font-size: 22px;; font-weight:bold;
}
.font-18w{
    font-size: 18px !important;; font-weight:bold;
}
.font-16w{
    font-size: 16px !important;; font-weight:bold;
}
.font-14w{
    font-size: 14px !important;; font-weight:bold;
}
.font-13w{
    font-size: 13px !important;; font-weight:bold;
}
.font-12w{
    font-size: 12px !important;; font-weight:bold;
}
.font-11w{
    font-size: 11px !important;; font-weight:bold;
}
.font-30w{
    font-size: 30px;; font-weight:bold;
}

.parsley-errors-list {
  margin: 0;
  padding: 0; }
.parsley-errors-list > li {
list-style: none;
color: #ff5b5b;
margin-top: 5px;
padding-left: 20px;
position: relative; }
.parsley-errors-list > li:before {
  content: "*";
  font-family: "Material Design Icons";
  position: absolute;
  left: 2px;
  top: -1px; }
.parsley-error {
  border-color: #ff5b5b; }

.parsley-success {
  border-color: #10c469; }
  
#commentForm .error {
  color: #ff5b5b;
  font-size: 12px;
  font-weight: 500; }
  
#chatbotcsi {
padding: 5px 3px; 
color: #fff;
position: fixed;
bottom: 50px;
right: 16px;
display: none;
width: 80px;
height: 80px;
}
.icon-wrapper {
  display: flex;
  flex-direction: column; 
}

.icon img {
  width: 70px;
  height: 70px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  box-shadow: 0 8px 20px rgba(62, 172, 45, 1);
  border-radius: 50%;
}

.icon img {
  /* Đặt transition ở đây để hiệu ứng mượt mà cả khi hover và khi không hover */
  transition: transform 1s ease, box-shadow 0.3s ease; /* Thay đổi 0.3s thành 1s hoặc lớn hơn cho transform */
}

.icon:hover img {
  /* Các hiệu ứng khi hover */ 
  transform: translateY(-5px) scale(1.2) rotate(360deg);
  box-shadow: 0 16px 30px rgba(0, 0, 128, 1);
  cursor: pointer;
}