/*
Theme Name: HR Toàn Cầu
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


.absolute-footer{
	display:none
}
p {
    margin-top: 0;
    margin-bottom: 1rem;
}
footer iframe {
    width: 100%;
    border-radius: 8px;
}
.box-duhoc .box {
	border-radius: 16px;
	background: #FFF;
	box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.10), 16px 10px 41px 0px rgba(0, 0, 0, 0.10), 64px 38px 75px 0px rgba(0, 0, 0, 0.09), 145px 86px 101px 0px rgba(0, 0, 0, 0.05), 258px 152px 120px 0px rgba(0, 0, 0, 0.01), 403px 238px 131px 0px rgba(0, 0, 0, 0.00);
}
.button.secondary:not(.ux-search-submit) {
    background: linear-gradient(to right, #EAB208, #D97706); /* vàng gold → cam gold */
    border: 1px solid #D97706;

    box-shadow:
        32px 57px 26px rgba(233, 178, 8, 0.01),
        18px 32px 22px rgba(233, 178, 8, 0.05),
        8px 14px 16px rgba(233, 178, 8, 0.09),
        2px 4px 9px rgba(233, 178, 8, 0.10),
        0px 0px 0px rgba(233, 178, 8, 0.10);

    font-weight: 500;
    font-size: 16px;
    color: #FFFFFF;      /* chữ trắng trên nền vàng/cam */
    padding: 6px 38px;
    display: inline-block;
}
header .button.secondary:not(.ux-search-submit){
    padding: 0px 30px;
}
.button.secondary:hover{
	background-color:#fff;
	color:var(--fs-color-secondary)
	
}
.zek_home_why .img {
    background-image: url(https://hrtoancau.docaweb.com/wp-content/uploads/2025/09/bg4.svg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.box-shadow-3, .box-shadow-3-hover:hover, .row-box-shadow-3 .col-inner, .row-box-shadow-3-hover .col-inner:hover {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.10), 0px 3px 6px 0px rgba(0, 0, 0, 0.10), 0px 11px 11px 0px rgba(0, 0, 0, 0.09), 0px 25px 15px 0px rgba(0, 0, 0, 0.05), 0px 44px 17px 0px rgba(0, 0, 0, 0.01), 0px 68px 19px 0px rgba(0, 0, 0, 0.00);
}
.box-khachhang .info p{
	margin-bottom:0px
}
.box-khachhang  .box_cmt  {
	    background: linear-gradient(to right, #EAB208, #D97706);
    color: #fff;
    height: max-content;
    border-radius: 13px;
    padding: 32px;
    font-weight: 500;
    min-height: calc(100% - 127px);
    font-size: 18px;
}
.box-khachhang .img img {
    height: 100%;
    border-radius: 16px;
}
.icon-box-img img, .icon-box-img svg {
    padding-top: 0px;
    width: 100%;
}
.slider-nav-circle .flickity-prev-next-button .arrow, .slider-nav-circle .flickity-prev-next-button svg {
    background: #fff;
}
.slider-nav-light .flickity-prev-next-button .arrow, .slider-nav-light .flickity-prev-next-button svg {
    fill: #0e0e0e;
}
.post-item > .col-inner{
	border-radius:16px;
	overflow:hidden
}
.post-item .post-title a{
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 8px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
	min-height:56px
}
.post-item .post-title a{
	color: #463524;
}
.from_the_blog_excerpt {
	font-size: 18px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.box-blog-post .is-divider{
	display:none
}
.box-dangky .wpcf7-form {
    background: #FFFFFF;
    border: 1px solid #67a0a74d;
    position: relative;
    box-shadow: 0px 293px 117px #ababab03, 0px 165px 99px #ababab0d, 0px 73px 73px #ababab17, 0px 18px 40px #ababab1a, 0px 0px 0px #ababab1a;
    padding: 48px;
    max-width: 732px;
    margin: 0 auto;
    border-radius: 16px;
}
.wpcf7-form-control:not(.wpcf7-submit){
	background: #F1F1F1 !important;
	border: 1px solid #DFDFDF !important;
	border-radius: 8px !important;
	height: 52px !important;
	font-size: 16px;
    margin: 0;
    padding: 12px;
	margin-bottom:30px;
	box-shadow:none
}
.primary, input[type=submit], input[type=submit].button{
	border-radius:40px;
	
}
.wpcf7-spinner{
	display:none
}
input[type=submit].secondary {
    background: #E64D4E;
    box-shadow: 32px 57px 26px #E64D4E03, 18px 32px 22px #E64D4E0d, 8px 14px 16px #E64D4E17, 2px 4px 9px #E64D4E1a, 0px 0px 0px #E64D4E1a;
    font-weight: bold;
    font-size: 20px;
    color: #FFFFFF;
    padding: 18px 60px;
    line-height: normal;
    text-transform: uppercase;
    height: auto;
    border-radius: 40px;
}
.box-dangky .section-bg img {
    object-fit:contain
}
.list-icon ul li{
    list-style: none;
    margin-bottom: 16px;
    position: relative;
    display: flex;
	margin-left:0px
}
.list-icon ul li:before {
    content: '';
    width: 30px;
    height: 30px;
    background-image: url(https://hrtoancau.docaweb.com/wp-content/uploads/2025/09/iconlist.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    display: block;
    margin-right: 16px;
    flex-shrink: 0;
}
.xanh ul li:before {
    background-image: url(https://hrtoancau.docaweb.com/wp-content/uploads/2025/09/listicon.svg);
}
.bgcontain .section-bg img {
   object-fit:contain
}
.box-lotrinh .icon-box-img {
    background: #FFFFFF;
    box-shadow: 19px 20px 17px rgba(0, 0, 0, 0.01), 5px 6px 15px rgba(0, 0, 0, 0.05), 8px 8px 9px rgba(0, 0, 0, 0.09), 19px 20px 13px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
    border-radius: 16px;
    margin: 0 auto 60px;
    transform: rotate(45deg);
    width: 93px;
    height: 93px;
    display: flex;
    padding: 15px;
	z-index:9
}
.box-lotrinh .icon-box-img .icon{
    border-radius: 8px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
	background-color: rgba(36, 55, 131, 0.1);
}
.box-lotrinh .icon-box-img .icon img {
    height: 45px;
    transform: rotate(-45deg);
}
.box-lotrinh .line-wp{
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 48%;
    width: 80%;
}
.box-lotrinh .line {
    display: flex;
    transform: translate(-50%, -50%);
}

.box-lotrinh .line span {
    flex: 1;
    height: 18px;
    transform-origin: center;
    text-align: center;
    color: #333333;
    font-weight: 500;
    position: relative;
    font-size: 18px;
}
.box-lotrinh .line span:nth-child(odd) {
    transform: rotate(35deg) translate(-20px, -40px);
}
.box-lotrinh .line span p {
    transform: translateY(-30px);
    margin-bottom: 0;
}
.box-lotrinh .line span i {
    background: #E64D4E4d;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.box-lotrinh .line span:nth-child(even) {
    transform: rotate(-35deg) translate(20px, -40px);
}
.radius20 img{
	border-radius:20px
}
.text.label {
    background: rgba(89, 118, 123, 0.1);
    border-radius: 16px;
    font-weight: 700;
    font-size: 32px;
    color: #463524;
    margin-bottom: 32px;
    text-align: center;
    padding: 4px;
}
.text.label p{
	margin-bottom:0px
}
.relative{
	position:relative
}
.box-khachhang.dark .box_cmt {
    background: #fff;
}
.accordion-title {
    background-color: #fff !important;
    border-radius: 10px;
    border: 1px solid #D7E8EA !important;
    padding-left: 20px;
    color: #000 !important;
    font-weight: normal !important;
}
.accordion-item{
	margin-bottom:20px;
	
}
.accordion .toggle {
    right: 0px;
    left: auto;
    font-size: 14px;
}
.accordion-item {
    border-radius: 8px;
    background: #67a0a733;
}
@media screen and (min-width: 850px) {
   .box-lotrinh  .large-2 {
        flex-basis: 20%;
        max-width: 20%;
    }
}
.bg-gi-top .section-bg-overlay{
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.70) 0%, rgba(0, 0, 0, 0.00) 100%);
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.bg-gi  .section-bg-overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.60) 100%);
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.item:before {
    content: '';
    background: linear-gradient(180deg, rgba(7, 11, 26, 0.00) 40.63%, rgba(7, 11, 26, 0.70) 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
}
.overlay.fill{
    background: linear-gradient(180deg, rgba(7, 11, 26, 0.00) 40.63%, rgba(7, 11, 26, 0.70) 100%);
    width: 100%;
    height: 100%;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
}
.box-overlay .box-text, .box-shade .box-text{
	font-size: 20px;
    font-weight: 800;
    color: #fff;
    text-align: center;
    position: absolute;
    z-index: 2;
    left: 0;
    width: 100%;
    bottom: 0;
    text-transform: uppercase;
}
.blog-single .article-inner {
	padding: 32px 24px 24px;
    border-radius: 16px;
    background: #FFF;
}
.article-inner  h1.entry-title {
    font-weight: 800;
    margin-bottom: 10px;
    color: #463524;
}
.header-block {
    min-height: 0px;
}
.entry-divider{
	display:none
}
span.widget-title{
	border-radius: 16px;
    background: #463524;
    font-size: 28px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    padding: 19px;
    margin-bottom: 16px;
	display:block
}
.widget .is-divider {
    display:none
}
.entry-meta{
    text-transform: none;
}
.zek_single_breadcrums {
    padding: 60px 0;
    position: relative;
    overflow: hidden;
    color: #fff;
}
.zek_single_breadcrums .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.zek_single_breadcrums .bg img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
    object-position: top;
}
.zek_single_breadcrums .separator, .zek_single_breadcrums a {
    color: #ffffff4d;
}
.nav-dropdown {
    min-width: 400px;
}
.off-canvas-left .mfp-content, .off-canvas-right .mfp-content{
	background-color:var(--fs-color-primary) !important;
}
.off-canvas .nav-vertical>li>a{
	padding: 8px 24px !important;
	color: #fff;
	font-size: 16px;
	font-weight: normal;
}
.nav-sidebar.nav-vertical>li+li{
	border:0px
}
#dangky{
	border-radius:20px 
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	.nopad-mb > .col{
		padding:0px
	}
	.cmtq .icon-box-img{
		width:50px !important
	}
	.box-dangky .wpcf7-form{
		padding:30px
	}
	.ml-half {
		margin-left: 0px;
	}
	.box-lotrinh .time:after {
		content: '';
		width: 50px;
		border-top: 50px solid #E64D4E4d;
		border-right: 50px solid transparent;
		border-left: 50px solid transparent;
		display: block;
		margin: 0 auto;
		animation-duration: 1s;
		animation-fill-mode: both;
		-webkit-animation-duration: 1s;
		transform-origin: top right;
		animation-iteration-count: infinite;
		animation-direction: alternate;
		-webkit-animation-fill-mode: both;
		animation-name: arrowbottom;
	}
	.text.label{
		font-size:17px
	}
	.page-title-inner {
		min-height: 100px !important;
	}
	.title-breadcrumbs{
		display:none !important
	}
}
@keyframes arrowbottom {
from{transform: translateY(0) ;}
to{transform: translateY(10px)}
}