/*
Theme Name: cuuho
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
.pum-container.popmake{
	padding-left:50px;
	padding-right:50px;
}
.pum-content.popmake-content h3{
	margin-top:10px !important;
	margin-bottom:20px !important;
	text-transform:uppercase !important
}
.blog-wrapper.page-wrapper{
	padding-top:0px;
}
header.archive-page-header{
	padding-top:180px;
	padding-bottom:150px;
	background:url(/wp-content/uploads/2026/07/banner_n.jpg) no-repeat top center;
	background-size:cover !important;
	position:relative;
	margin-bottom:50px;
}
header.archive-page-header:after{
	content:"";
	z-index:1;
	position:absolute;
	left:0px;
	right:0px;
	top:0px;
	bottom:0px;
	background:#000000a8;
}
header.archive-page-header .large-12.text-center.col{
	padding-left:10% !important;
	padding-right:10% !important;
	z-index:5;
}
.headsub h2{
	padding-left:15px;
	padding-right:15px;
	border-left:5px solid  #034ea2 !important;
	border-right:5px solid  #034ea2 !important
}
.listinfo h4{
	margin-bottom:0px !important
}
.listinfo p{
	font-size:14px;
}
.listchoin img{
	filter: brightness(0) invert(1);
}
.imgbor img{
	border-radius:15px;
}

.text.dslink h3 a{
	color:#fff !important
}
.idichvu a.plain{
	display:block !important
}
.banner.banvideo{
	border-radius:15px;
}
.banvideo .icon-play{
	color:#034ea2 !important
}
.banvideo  .playvideo .button {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 85px;
	height: 85px;
	border-radius: 100%;
	background-color: rgba(255, 255, 255, 0.9);
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding-left: 6px;
	
}
.banvideo .fill{
	border-radius:15px !important
}
.imgbo img{
	border-radius:20px;
}
.maintit p{
	text-transform:uppercase;
	margin-bottom: 0px;
}
.maintit{
	padding-left:15px;
	border-left:3px solid #ed1c24;
	margin-bottom:25px !important
}
.header-bottom{
	border-bottom:3px solid #034ea2;
}
.maintit h1{
	    font-size: 34px;
	color:#034ea2
}
.slihome h3{
	font-size:42px;
	margin-bottom:0px;
}
.slihome p{
	font-size:18px;
}
.header-bottom .nav-spacing-xlarge>li{
	padding:0px 13px;
}
li.html.header-button-1{
	padding:0px !important;
	border-radius:0px !important;
	background:#034ea2
}
li.html.header-button-1 .button.primary{
	padding-left:45px;
	padding-right:45px;
	    background: #034ea2;
    height: 50px;
    line-height: 50px;
    border-radius: 0px !important;
}
.iclal p{
	    font-size: 11px !important;
    margin: 0px;
    text-transform: uppercase;
}
li.header-block{
	max-width:200px !important
}
.header-main .search-field{
		border:0px !important;
	background:none !important;
	color:#333 !important;
	font-size:12px !important;
	box-shadow:0px 0px #fff !important
}
.header-main .searchform{
	border:1px solid #dedede !important;
	border-radius:4px !important;
	padding:5px !important
}
.header-main .ux-search-submit{
	border:0px !important;
	background:none !important;
	color:#333 !important;
	font-size:12px !important
}
.header-main .flex-col.hide-for-medium.flex-right{
	min-width:400px;
}
li.header-search-form{
	width:120px !important
}
.iclal h3{
	color:#f00;
	font-size:18px;
	margin-top:-4px;
	margin-bottom:0px;
	letter-spacing:1px !important
}
#post-list h5.post-title{
	font-size:20px;
}
.archive-page-header h1{
	text-align:left !important; 
	color:#fff !important;
	    font-size: 32px;
	margin-bottom:0px !important
}
.absolute-footer{
	padding-top:20px !important;
	padding-bottom:20px !important;
	font-size:14px !important;
	background:rgb(0, 8, 21) !important
}
.absolute-footer{
	border-top:1px solid #dedede29 !important
}
.bfooter p{
	font-size:14px;
}
.bfooter h3{
	color:#f85c02;
	margin-bottom:20px !important
}
.khachhang .testimonial-text{
	font-style:normal !important
}
.ccuuho p{
	font-size:14px;
}
.listchonm .icon-box-text{
	padding-top:8px !important
}
.idichvu .box-image img, .idichvu .box-image{

	border-radius:8px;
}
.btquan{
	margin-bottom:5px !important;
	margin-right:0px !important;
	font-size:15px !important
}
.idichvu .boxx{
	
}
.col5chon .large-2 {
        flex-basis: 20%;
        max-width: 20%;
}
.col5chon img{
	
}
.btquan{
	padding:3px 36px;
	border-radius:4px;
	background:#f8f9fa !important;
	border:1px solid #eeeeee
}
.col5chon .col-inner:hover .is-border{
	border-bottom:3px solid #f85c02 !important
}
.boxhotro .col-inner{
	border-top:3px solid #f85c02 !important
}
.col5chon h3{
    font-size: 16px;
    font-weight: 600;
    line-height: 23px;
	
}
.col5chon .icon-inner{
	background:#f85c02 !important
}
.col5chon .icon-inner img{
	filter: brightness(0) invert(1);
}
.idichvu .icon-box .icon-box-text.last-reset:before{
	width:15px;
	height:15px;
	content:"";
	z-index:2;
	transform: rotate(45deg);
	background:#021f4e;
	display:block;
	position:absolute;
	top:-7px;
	left:14px;
}
.idichvu .icon-box .icon-box-text.last-reset{
	padding:15px 15px;
	background:#021f4e;
	border-radius:8px !important;
	position:relative;
	color:#fff;
	    min-height: 130px;
}
.idichvu .icon-box .icon-box-text h3{
	margin-bottom:10px;
	color:#fff;
}
.idichvu .icon-box .icon-box-text p{
	font-size:13px;
}
.idichvu .icon-box.featured-box{
	margin-top:-30px;
}
.idichvu .icon-inner{
	background:#f85c02 !important
}
.idichvu .icon-inner img{
	filter: brightness(0) invert(1);
}
.tmain h2{
	font-size:32px;
	    margin-bottom: 5px;
}
.boxbanggia  h2{
	padding-bottom:15px;
	margin-bottom:15px;
	border-bottom:1px dashed #dedede;
	color:#f85d02
}
.pricing-list-suaxe {
    list-style: none;
    padding: 0;
    margin: 0;
}
 .pricing-list-suaxe li {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 12px 0;
                border-bottom: 1px solid #222222;
                transition: all 0.3s ease;
            }

            .pricing-list-suaxe li:last-child {
                border-bottom: none;
            }

            .pricing-list-suaxe li:hover {
                background-color: #1a1a1a;
                padding: 12px 10px;
                border-radius: 4px;
            }

            .service-name {
                font-size: 16px;
                font-weight: 500;
                flex: 1;
                padding-right: 15px;
				    text-align: left;
            }

            .service-name small {
                display: block;
                color: #aaaaaa;
                font-size: 13px;
                margin-top: 4px;
                font-weight: 400;
            }

            .service-price {
                font-size: 16px;
                font-weight: 700;
                color: #ff7a00;
                text-align: right;
                white-space: nowrap;
            }

            /* Đáp ứng giao diện di động (Responsive) */
            @media (max-width: 480px) {
                .pricing-container-suaxe {
                    padding: 20px 15px;
                }

                .pricing-title-suaxe {
                    font-size: 18px;
                }

                .service-name, .service-price {
                    font-size: 14px;
                }
            }
.vhtoa .button::before{
    content: '';
    top: -15px;
    left: -15px;
    right: -15px;
    bottom: -15px;
    position: absolute;
    background-color: transparent;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    border: 20px solid #fff;
    opacity: 0.5;
    -webkit-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -moz-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -ms-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -o-animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    animation: quick-alo-circle-anim 1.2s infinite ease-in-out;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
.vhrung{
    display: inline-block;
    -webkit-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -moz-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -ms-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -o-animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    animation: quick-alo-circle-img-anim 1s infinite ease-in-out;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
@-moz-keyframes quick-alo-circle-img-anim {
    0% {
        transform: rotate(0deg) scale(1) skew(1deg)
    }
    10% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -moz-transform: rotate(0deg) scale(1) skew(1deg)
    }
    100% {
        -moz-transform: rotate(0deg) scale(1) skew(1deg)
    }
}
@-webkit-keyframes quick-alo-circle-img-anim {
    0% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg)
    }
    10% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -webkit-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -webkit-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg)
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg)
    }
}
@-o-keyframes quick-alo-circle-img-anim {
    0% {
        -o-transform: rotate(0deg) scale(1) skew(1deg)
    }
    10% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        -o-transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        -o-transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        -o-transform: rotate(0deg) scale(1) skew(1deg)
    }
    100% {
        -o-transform: rotate(0deg) scale(1) skew(1deg)
    }
}
@keyframes quick-alo-circle-img-anim {
    0% {
        transform: rotate(0deg) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0deg) scale(1) skew(1deg)
    }
}
@-moz-keyframes quick-alo-circle-fill-anim {
    0% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
}
@-webkit-keyframes quick-alo-circle-fill-anim {
    0% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
} 
@-o-keyframes quick-alo-circle-fill-anim {
    0% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
}
@keyframes quick-alo-circle-fill-anim {
    0% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0deg) scale(.7) skew(1deg);
        opacity: .2
    }
}
/*  */
@-moz-keyframes quick-alo-circle-anim {
    0% {
		transform: rotate(0deg) scale(1) skew(1deg);
		opacity: .1
	}
	30% {
		transform: rotate(0deg) scale(1.1) skew(1deg);
		opacity: .3
	}
	100% {
		transform: rotate(0deg) scale(1.2) skew(1deg);
		opacity: .1
	}
}
@-webkit-keyframes quick-alo-circle-anim {
    0% {
		transform: rotate(0deg) scale(1) skew(1deg);
		opacity: .1
	}
	30% {
		transform: rotate(0deg) scale(1.1) skew(1deg);
		opacity: .3
	}
	100% {
		transform: rotate(0deg) scale(1.2) skew(1deg);
		opacity: .1
	}
}
@-o-keyframes quick-alo-circle-anim {
	0% {
		transform: rotate(0deg) scale(1) skew(1deg);
		opacity: .1
	}
	30% {
		transform: rotate(0deg) scale(1.1) skew(1deg);
		opacity: .3
	}
	100% {
		transform: rotate(0deg) scale(1.2) skew(1deg);
		opacity: .1
	}
}
@keyframes quick-alo-circle-anim {
	0% {
		transform: rotate(0deg) scale(1) skew(1deg);
		opacity: .1
	}
	30% {
		transform: rotate(0deg) scale(1.1) skew(1deg);
		opacity: .3
	}
	100% {
		transform: rotate(0deg) scale(1.2) skew(1deg);
		opacity: .1
	}
}
/*  */
.vhzoom{
    animation-iteration-count: infinite;
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-name: tada;
}
@keyframes tada {
    0% { transform: scale3d(1,1,1);}
    10%, 20% { transform: scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);}
    30%, 50%, 70%, 90% { transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);}
    40%, 60%, 80% { transform: scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);}
    100% { transform: scale3d(1,1,1);}
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
.col5chon .large-2 {
    flex-basis: 50%;
    max-width: 50%;
}
li.html.header-button-1 .button.primary {
    padding-left: 15px;
    padding-right: 15px;

    height: 40px;
    line-height: 40px;

}
	.slihome h3 {
		font-size: 28px;}
	.slihome p {
		font-size: 14px;}
.maintit h1 {
    font-size: 24px;
    color: #034ea2;
}
	.tmain h2 {
		font-size: 24px;}
}