body {
	font-family: "Roboto" !important;
}


#header .header-column .header-extra-info li {
	margin-left: 0;
}
.cs-header-ul {
	width: 100%;
    list-style-type: none; /* Loại bỏ các dấu bullet */
    justify-content: center !important; /* Căn giữa các thẻ li theo chiều ngang */
    padding: 0; /* Loại bỏ padding mặc định */
    margin: 5px !important;
}

.cs-header-ul li {
	display: flex; /* Thiết lập li là một flex container */
    align-items: center; /* Căn giữa các mục con theo chiều dọc */
    justify-content: center; /* Căn giữa các mục con theo chiều ngang, nếu cần */
}

.cs-header-ul .active {
	background: #ccc;
}

.cs-header-ul li img{
	height: 20px;
	width: 20px;
}

.cs-header-ul li img, .cs-header-ul li label {
    margin: 0 5px; /* Tạo khoảng cách giữa hình ảnh và nhãn */
}

.cs-header-ul-callme {
	width: 100%;
    list-style-type: none; /* Loại bỏ các dấu bullet */
    justify-content: center !important; /* Căn giữa các thẻ li theo chiều ngang */
    padding: 0; /* Loại bỏ padding mặc định */
    margin: 5px !important;
}

.cs-header-ul-callme li {
	display: flex; /* Thiết lập li là một flex container */
    align-items: center; /* Căn giữa các mục con theo chiều dọc */
    justify-content: center; /* Căn giữa các mục con theo chiều ngang, nếu cần */
}

.cs-header-ul-callme li i{
    border:1px solid #ccc;
    padding: 5px;
}

.cs-header-ul-callme li a{
    color: #666;
}

.cs-header-ul-callme img{
    height: 30px;
    width: 30px;
    padding-bottom: 5px;
}

.cs-header-ul-callme li a , .cs-header-ul-callme li i{
    margin: 0 5px; /* Tạo khoảng cách giữa hình ảnh và nhãn */
}

@media (min-width: 1200px) {
    .cs-fix-menu-top {
        line-height: 30px;
    }
    .cs-header-nav-features.col-xl-6 {
        width: 40% !important;
    }

    .bg-color-light, .bg-light {
        background-color: #ededed !important;
    }
}


@media (max-width: 991px) {
	#header .header-nav-features .header-nav-features-dropdown.show {
	    top: 35px;
	    box-shadow: none;
	}
}

#footer .footer-copyright {
    background: #252074;
}

#footer {
    background: #018bd4;   
}

#footer p, #footer p i,#footer p, #footer li i, #footer .footer-copyright p, #footer a:not(.btn):not(.no-footer-css) {
    color: #ccc !important;
}

.chat-main-icon img:hover, .chat-sub-icons a img:hover {
    transform: rotate(360deg); /* Xoay icon một vòng tròn */
    transition: transform 0.6s ease; /* Thực hiện chuyển đổi trong 0.6 giây với hiệu ứng 'ease' */
}

.chat-icon-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    cursor: pointer;
    z-index: 1000; /* Đảm bảo rằng icon không bị che khuất bởi các thành phần khác */
}

.chat-main-icon img, .chat-sub-icons a img {
    width: 50px; /* Kích thước của icon */
    height: 50px; /* Kích thước của icon */
    border-radius: 50%; /* Tạo hình tròn */
    transition: transform 0.3s ease;
    padding: 1px; /* Padding xung quanh các icon */
    background-color: white; /* Màu nền cho các icon */
    box-shadow: 0 2px 4px rgba(0,0,0,0.2); /* Thêm đổ bóng nhẹ */
    display: block; /* Đảm bảo rằng icon hiển thị dạng block để padding và background-color hiệu quả */
    object-fit: cover; /* Đảm bảo rằng ảnh không bị méo */
    margin-bottom: 15px; /* Tăng khoảng cách giữa các sub-icons */
}

.chat-sub-icons {
    display: none; /* Ẩn các sub-icons khi chưa được click */
    position: absolute;
    bottom: 60px; /* Điều chỉnh vị trí dựa trên kích thước và vị trí của icon chính */
    right: 0;
    padding: 5px; /* Điều chỉnh nếu cần thêm không gian bên trong */
    background-color: transparent; /* Làm cho nền của khối submenu trong suốt */
}

/* CSS để hiển thị các sub-icons khi chat-main-icon được click */
.is-active .chat-sub-icons {
    display: flex; /* Sử dụng flex để định dạng các icon */
    flex-direction: column; /* Định hướng cột cho các sub-icons */
}

.x-captcha img{
    margin-top: 32px;
}