/*
	Theme Name: Hello Elementor
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
	Author: Elementor Team
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 3.4.5
	Stable tag: 3.4.5
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor
	Tags: accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready,
*/

/* ----- custom ----- */
:root {
	--w-btn-main: 40px;
	--bg-color-main: #f9f9f9;
	--h-img-accordion: 488px;
}
body {
	overflow-x: hidden;
	background-color: var(--e-global-color-39f1338);
	font-family: var(--e-global-typography-primary-font-family);
}

/* font-family */
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-theme-post-excerpt,
.elementor-widget-nav-menu .elementor-nav-menu .elementor-item,
.elementor-widget-button .elementor-button,
.elementor-widget-text-editor,
.elementor-widget.elementor-list-item-link-full_width a {
	font-family: var(--e-global-typography-primary-font-family), Sans-serif !important;
}

.fa-arrow-right::before {
    content: "\f061";
}

.d-none {
	display: none !important;
}

/* text */
.elementor-widget-text-editor p:last-child {
	margin-bottom: 0;
}
.btn-title {
	display: inline-flex !important;
	vertical-align: middle;
}

/* button - main */
.btn-main .elementor-button-content-wrapper {
	align-items: center;
    gap: 12px;
}
.btn-main .elementor-button-content-wrapper .elementor-button-icon {
	height: var(--w-btn-main);
    width: var(--w-btn-main);
    align-items: center;
    justify-content: center;
    background-color: #000;
    border-radius: 1000px;
    color: white;
}
.btn-main .elementor-button-content-wrapper .elementor-button-icon svg {
	fill: #fff;
}
.btn-main .elementor-button-content-wrapper .elementor-button-text {
	white-space: nowrap;
}
.btn-yellow {
	background-color: var(--e-global-color-3c646c0) !important;
	border-color: var(--e-global-color-3c646c0) !important;
	color: #000 !important;
}

/* header */
body .menu-hd-main {
	
}
body .sec-header-main {
	position: fixed;
    top: 20px;
    z-index: 9999;
}
body .sec-header-main .col-header-items {
	box-shadow: 0 3px 13px 0 rgb(0 0 0 / 15%);
}

/* title image */
.img-title {
	width: 96px;
    height: 60px !important;
    object-fit: cover;
	vertical-align: middle;
    border-radius: 3.40282e38px !important;
}

/* image marquee */
.sec-image-marquee {
	position: relative;
}
.sec-image-marquee:before,
.sec-image-marquee:after {
	content: '';
    position: absolute;
    top: 0;
    display: block;
    height: 100%;
    width: 100px;
    z-index: 1;
}
.sec-image-marquee:before {
	left: 0;
    background: linear-gradient(to right, var(--e-global-color-39f1338), transparent);
}
.sec-image-marquee:after {
	right: 0;
    background: linear-gradient(to left, var(--e-global-color-39f1338), transparent);
}

.box-hover-ct .uc_long_content_box_holder .uc_long_content_box_box .uc_box_content {
	background: linear-gradient(to top, rgb(0 0 0 / 70%) 13%, transparent 50%);
}
.box-hover-ct .uc_long_content_box_holder .uc_long_content_box_box .uc_box_content .uc_box_content_open {
	display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
	align-items: center;
}
.box-hover-ct .uc_long_content_box_holder .uc_long_content_box_box .uc_box_content .ue-icon {
	height: var(--w-btn-main);
    width: var(--w-btn-main);
	min-width: var(--w-btn-main);
}
.box-hover-ct .uc_long_content_box_holder:hover .uc_long_content_box_box .uc_box_content .ue-icon i:before {
	content: "\f068";
}

/* case study */
.img-logo-case img {
	filter: brightness(0) invert(1);
   -webkit-filter: brightness(0) invert(1);
}
@media (min-width: 767px) {
	.loop-case-home .ue-grid .ue-grid-item {
		position: sticky;
		top: 144px;
	}
}

/* accordion */
.accordion-items {
	height: var(--h-img-accordion);
	position: relative;
}
.accordion-items .e-n-accordion {
	width: 33%;
	height: var(--h-img-accordion);
    overflow-y: auto;
	padding-right: 10px;
}
.accordion-items.elementor-widget-n-accordion .e-n-accordion-item[open]>.e-n-accordion-item-title {
	pointer-events: none;
}
.accordion-items .e-n-accordion .e-n-accordion-item,
.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con {
	position: initial !important;
}
.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con .col-img-accordion {
	position: absolute !important;
    right: 0;
    width: 66%;
    top: 0;
    height: var(--h-img-accordion);
    overflow: hidden;
}
.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con .col-img-accordion .elementor-widget-image,
.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con .col-img-accordion .elementor-widget-image img {
	height: 100%;
	width: 100%;
}
.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con .col-img-accordion .elementor-widget-image img {
	object-fit: contain;
}

/*  */
.sec-bg-ft-decor {
	
}

/* about us */
.aspect-step,
.aspect-1 {
	aspect-ratio: 1;
}
.col-img-faq {
	aspect-ratio: 3 / 4;
}
.marquee-roles-items {
	--p-spacing: 72px;
}
.marquee-roles-items .uc-logo-wrapper {
	padding-top: var(--p-spacing);	
}
.marquee-roles-items .uc-logo-wrapper>.uc_logo_marquee_holder:nth-child(odd) {
	translate: 0 calc(var(--p-spacing) * -1);
}

/* toc */
.items_toc {
    font-family: var(--e-global-typography-primary-font-family), sans-serif;
}
.items_toc ul {
    list-style: none;
	padding: 16px;
    background-color: #fff;
}
.items_toc ul li {
	margin-bottom: 12px;
    position: relative;
    display: flex;
    align-items: center;
}
.items_toc li a {
	display: block;
    color: #000;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    line-height: 120%;
    position: relative;
    transition: .3s;
}
.items_toc li::after {
    content: '';
    height: 100%;
    width: 2px;
    background-color: var(--e-global-color-secondary);
    top: 50%;
    left: 0;
    position: absolute;
    transform: translate(-16px, -50%);
    opacity: 0;
    transition: .3s;
}
.items_toc li.active::after,
.items_toc li a:hover,
.items_toc li.active a {
    color: var(--e-global-color-secondary);
}
.items_toc li.active::after,
.items_toc li:hover::after {
    opacity: 1;
}
.items_toc .ez-toc-title-container {
	pointer-events: none;
	padding: 16px;
    display: flex;
    background-color: var(--e-global-color-3c646c0);
    align-items: center;
}
.items_toc .ez-toc-title-container .ez-toc-title {
	margin-bottom: 0;
	color: #000;
	font-size: 20px;
}
.items_toc .ez-toc-title-container .ez-toc-title-toggle {
	display: none;
}

/* blog */
.pagi-items .prev.page-numbers,
.pagi-items .next.page-numbers {
	gap: 12px;
	padding: 0 20px;
}
.pagi-items .page-numbers .archive_pagination-prev-icon,
.pagi-items .page-numbers .archive_pagination-next-icon {
	padding: 0 !important;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    color: #fff;
    border-radius: 1000px;
}
.main-content-blog p,
.main-content-blog h2,
.main-content-blog ul li,
.main-content-blog ol li {
	color: #000;
}
.main-content-blog p,
.main-content-blog ul li,
.main-content-blog ol li {
	font-size: 16px;
}
.main-content-blog p {
	margin: 24px 0;
}
.main-content-blog h2 {
	margin: 40px 0 24px;
	font-size: 30px;
}
.sidebar-blog {
	position: sticky;
	top: 120px;
}
.col-related-items .img-related-blog {
	width: var(--w-img-related) !important;
    min-width: var(--w-img-related) !important;
    height: var(--h-img-related) !important;
	border-radius: 10px;
	overflow: hidden;
}
.col-related-items {
	--w-img-related: 96px;
	--h-img-related: 72px;
	display: flex;
    flex-direction: row !important;
    align-items: center;
	flex-wrap: nowrap;
	padding: 0;
}
.col-related-items .elementor-heading-title {
	font-size: 20px;
    font-weight: 700;
}
.img-related-blog a,
.img-related-blog img {
	height: 100% !important;
	width: 100% !important;
}
.img-related-blog img {
	object-fit: cover;
	margin: 0 !important;
}
.loop-blog-archive {
	--p-spacing: 40px;
}
.loop-blog-archive.loop-blog-home,
.loop-blog-archive.loop-blog-home {
	position: relative;
}
.loop-blog-archive.loop-blog-home:before,
.loop-blog-archive.loop-blog-home:after {
	content: '';
	display: block;
	width: var(--p-spacing);
	height: calc(100% + 2px);
	background-color: #fff;
	position: absolute;
	top: -1px;
	z-index: 1;
}
.loop-blog-archive.loop-blog-home:before {
	left: 0;
}
.loop-blog-archive.loop-blog-home:after {
	right: 0;
}
.loop-blog-archive.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item {
	margin-bottom: var(--p-spacing);
}
@media (min-width: 1025px) {
	.loop-blog-archive.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item:not(:last-child):before {
		top: var(--p-spacing);
	}
}
@media (min-width: 768px) {
	.col-container-blog {
		width: 67% !important;
	}
	.col-sidebar-blog {
		width: 33% !important;
	}
}
.col-list-cate-blog .all-cate-items {
	list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.col-list-cate-blog .all-cate-items a {
	padding: 8px 12px;
    background-color: var(--e-global-color-39f1338);
    border-radius: 1000px;
    font-size: 14px;
    line-height: 1;
    color: #000;
	display: flex;
    width: fit-content;
}
.img-card-post {
	aspect-ratio: 16 / 9;
}
.img-card-post a,
.img-card-post img {
	height: 100% !important;
	width: 100% !important;
}
.img-card-post img {
	object-fit: cover;
}
.card-post-main {
	
}
.sc-time-read-blog .elementor-shortcode {
	font-size: 12px;
	color: var(--e-global-color-primary);
}
.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item {
	position: relative;
}
.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item:not(:last-child):before {
	content: '' !important;
	display: block;
	width: 1px;
	height: 100%;
	position: absolute;
	top: 0px;
	right: 1px;
	background-color: var(--e-global-color-3e2ee26);
}
.sc-form-blog {
	--w-btn: 44px;
	--h-input: 50px;
}
.sc-form-blog .form-contact-blog p {
	margin-bottom: 0;
	display: flex;
}
.sc-form-blog .form-contact-blog .wpcf7-form-control-wrap {
	width: 100%;
}
.sc-form-blog .form-contact-blog .wpcf7-email {
	height: var(--h-input);
	padding-right: calc(var(--w-btn) + 10px);
}
.sc-form-blog .btn-submit {
	width: var(--w-btn);
    height: var(--w-btn);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 1000px;
    background-color: #000;
    color: #fff;
    border: none;
    position: absolute;
    right: calc((var(--h-input) - var(--w-btn)) / 2);
    top: calc((var(--h-input) - var(--w-btn)) / 2);
}

/* case study */
.loop-case-archive .e-loop-item,
.card-case-study,
.col-case-study-items {
	height: 100%;
}

/* bảng giá */
.icon-results-price {
	--w-ic: 48px;
	width: var(--w-ic) !important;
    min-width: var(--w-ic) !important;
    height: var(--w-ic) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1000px;
}
.icon-results-price .elementor-icon-wrapper {
	display: flex;
}

/* contact */
.form-contact-items {
	font-size: 14px;
}
.form-contact-items .form-contact-main .form-columns-2 {
	display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.wpcf7-form-control-wrap {
	display: block;
}
.form-contact-items .form-contact-main .field-input p {
	display: flex;
    flex-direction: column;
    gap: 8px;
}
.form-contact-items .form-contact-main .btn-submit-footer {
	width: fit-content;
}

/* footer */
.ft-logo-img a {
	width: 100%;
}
.sc-form-footer {
	--h-ip-ft: 48px;
}
.sc-form-footer .form-footer-items p {
	margin-bottom: 0;
	display: flex;
	gap: 16px;
}
.sc-form-footer .form-footer-items .wpcf7-form-control-wrap {
	display: block;
	flex: 1;
}
.sc-form-footer .form-footer-items .wpcf7-email,
.btn-submit-footer {
	height: var(--h-ip-ft);
}
.sc-form-footer .form-footer-items .wpcf7-email {
	border-color: var(--e-global-color-3e2ee26);
}
.sc-form-footer .form-footer-items .wpcf7-email,
.sc-form-footer .form-footer-items .wpcf7-email::placeholder {
	font-size: 12px;
}
.wpcf7-not-valid-tip {
    font-size: 10px;
    line-height: 20px;
    font-weight: bold;
    background: var(--wp--preset--color--vivid-red);
    color: white;
    margin-top: 8px;
    position: absolute;
    bottom: -20px;
    padding: 2px 8px;
    border-radius: 3px;
    width: fit-content;
    max-width: unset;
    z-index: 1;
    box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.15);
}
.wpcf7-not-valid-tip:before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 10%;
    transform: translate(-50%);
    border-style: solid;
    border-width: 0 8px 8px;
    border-color: transparent transparent var(--wp--preset--color--vivid-red);
}
.btn-submit-footer {
	border-radius: 1000px;
    padding: 4px 4px 4px 20px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}
.btn-submit-footer,
.btn-submit-footer:hover {
	border-color: var(--e-global-color-472d462);
    background-color: var(--e-global-color-472d462);
}
.btn-submit-footer i {
	height: var(--w-btn-main);
    width: var(--w-btn-main);
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
	color: #fff;
    border-radius: 1000px;
}

/* tablet */
@media (max-width: 1024px) {
	/* blog */
	.loop-blog-archive {
		--p-spacing: 20px;
	}
	.col-list-cate-blog .all-cate-items {
		flex-direction: row;
		flex-wrap: wrap;
	}
	
	/* case study */
	.loop-case-archive.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item:not(:last-child):before {
		top: var(--p-spacing);
	}
}

/* mobile */
@media (max-width: 767px) {
	:root {
		--h-img-accordion: 228px;
	}
	
	/* button - primary */
	.btn-main .elementor-button-content-wrapper .elementor-button-text {
		font-size: 14px;
	}
	
	/*  */
	.p-relative-mb {
		position: relative !important;
	}
	
	/* about us */
	.aspect-step {
		aspect-ratio: 16 / 9;
	}
	
	/* blog */
	.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item:not(:last-child):before {
		width: calc(100% - 40px);
        height: 1px;
        position: absolute;
        top: auto;
        bottom: 0px;
        right: auto;
        left: 20px;
	}
	.col-related-items .elementor-heading-title {
		font-size: 16px;
	}
	
	/* case study */
	.loop-case-archive.loop-blog-home .ue-grid.uc-items-wrapper>.ue-grid-item:not(:last-child):before {
		top: auto;
		bottom: 0;
	}
	
	/* accordion */
	.accordion-items {
		padding-right: 0;
		padding-top: calc(var(--h-img-accordion) + 20px) !important;
	}
	.accordion-items,
	.accordion-items .e-n-accordion {
		height: unset;
		padding-right: 0;
	}
	.accordion-items .e-n-accordion,
	.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con .col-img-accordion {
		width: 100%;
	}
	.accordion-items .e-n-accordion .elementor-element.e-con-full.e-con .col-img-accordion {
		width: 100%;
		height: var(--h-img-accordion);
	}
}
/* ----- end custom ----- */

body::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

body::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

body::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: #000;
}