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

/*************** ADD CUSTOM CSS HERE.   ***************/
input[type='email'], input[type='search'], input[type='number'], input[type='url'], input[type='tel'], input[type='text']{
    min-height: 45px;
}
.div-ho-so p{
    margin-bottom: 5px;
}
.post-list-tai-lieu h5.post-title {
    font-weight: normal;
    padding-left: 15px;
    padding-top: 4px;
}
.post-list-tai-lieu h5.post-title:before{
        content: "\f1c1";
    color: #e71d2b;
    font-size: 1.875rem;
    position: absolute;
 top: 24px;
    left: 0;
    -webkit-transform: translateY(-50%);
    -khtml-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
 font-family: fontawesome;
}
.widget_product_categories{
    margin-bottom: 5px;
}
.current-category-children{
    text-align: center;
}
.current-category-children li a{
       padding: 6px 15px !important;
    font-weight: 500;
    border: 1px solid #007ec3;
    color: #007ec3; 
    margin-bottom: 7px;
}
.current-category-children li{
    margin-right: 10px !important;
    border: unset;
    display: inline-block;
}
.category-page-row {
    padding-top: 0px;
}
.widget .current-cat>a{
    color: var(--primary-color);
}
.nav-spacing-xlarge>li {
    margin: 0 25px;
}
.div-hinh-anh .col:before,.div-hinh-anh .col:after{
    display: none !important;
}
.div-hinh-anh .col .col-inner{
    padding: 7px !important;
}
.div-lien-he{
    padding: 30px;
    background: url(https://khangdien.com.vn/wp-content/uploads/2022/12/bg1.jpg) no-repeat center center;
    background-size: cover;
    border-radius: 8px;
}
.gtranslate_wrapper a{
    margin-right: 10px;
}
ul.product-categories  ul.children{
    border-left: unset;
    margin-left: unset;
}
ul.product-categories  ul.children li ul.children{
    display: none;
}

ul.product-categories > li > ul.children{
    text-align: center;
    background: #EDEDED;
        padding: 10px;
}
ul.product-categories > li > ul.children > li  > a{
font-weight: bold;
padding: 5px 15px;
font-size: 16px;
}
ul.product-categories ul.children ul.children{
display: none !important;
}
ul.product-categories  >li > ul.children > li{
    display: inline-block !important;
        position: relative;
}
ul.product-categories  ul.children ul.children li{
    display: inline-block !important;
        position: relative;
}
.title-bg{
        background-position: bottom;
    background-size: cover !important;

}
.category-page-row .product-small .box-text:after{
    content: '';
    background: url(https://www.khangdien.com.vn/wp-content/themes/khangdien/images/project-arrow.png);
    font-size: 1.5rem;
    width: 52px;
    height: 50px;
    text-align: right;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 2;
}
.category-page-row .product-small .box-text {
        position: absolute;
    bottom: 0px;
    background: rgba(0, 84, 130, 0.7);
    padding: 9px 20px;
}
.category-page-row .product-small .box-text a{
    color: white;
    font-size: 18px;
    font-weight: 500;
}
.title-home .section-title-main{
    font-size: 24px;
    padding-left: 24px;
        padding-bottom: 0px;
    border-bottom: 4px solid var(--primary-color);
}
.title-home .section-title-normal{
    border-bottom: 2px solid var(--primary-color);
}
.title-home  .section-title-main:before {
    content: '';
    background: url(https://khangdien.com.vn/wp-content/uploads/2022/12/icon-newslist.jpg);
    width: 18px;
    height: 18px;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -khtml-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.row-form .col{
    padding-bottom: 0px;
}
.wpcf7-list-item{
    margin-top: 15px;
}
.wpcf7-list-item input{
    margin-bottom: 0px;
}
.wpcf7-list-item .wpcf7-list-item-label{
    font-weight: normal;
    font-size: 14px;
}
.woocommerce-tabs li a {
    font-size: 25px;
    color: var(--primary-color) !important;
    font-weight: bold !important;
}
.woocommerce-tabs li a:before{
    display: none;
}
ul.ul-menu{
    z-index: 15;
    background: #EDEDED;
    text-align: center;
        list-style: none;
    display: block;
}
.section-menu{
    z-index: 15;
}
ul.ul-menu li{
   display: inline-block;
   margin-bottom: 0px;
   padding: 10px 20px;
}
ul.ul-menu li br{
    display: none;
}
ul.ul-menu li a{
    font-weight: bold;
}
.woocommerce-tabs {
        box-shadow: 7px 5px 30px 0px rgb(72 73 121 / 15%);
    padding: 10px 20px !important;
}
.tin-tuc-section .post-item .post-title{
    text-transform: uppercase;
}
.tin-tuc-section .post-item .post-title a{
        min-height: 42px;
    overflow: hidden;
    text-overflow: ellipsis;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
}
#footer .section-title-container{
    margin-bottom: 10px;
}
#footer .section-title-normal{
    color: var(--primary-color);
    border-bottom: unset;
}
#footer .section-title-normal span{
    border-color: var(--primary-color);
}
h2.pagetitle{
    color: var(--primary-color);
}
.row-doi-tac .div-logo{
        background: #EEEEEE;
    padding: 10px !important;
}
.row-doi-tac .div-ten p{
    margin-bottom: 0px;
    color: white;
}
.row-doi-tac .gallery-col {
    padding-bottom: 0px !important;
}
.row-doi-tac .col{
    padding-bottom: 0px;
}
.row-doi-tac{
        background-color: #1267b0;
      margin-bottom: 7px !important;
}
.tab-triet-ly  .content-left {
    background: #f2f2f2;
    margin-top: 3%;
}
.tab-triet-ly a span {
    padding: 7px 18px 0px 17px;
    font-size: 0.8125rem;
    color: #fff;
    font-weight: 600;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: 0;
}
.tab-triet-ly  .active a {
    background: #70be44;
}
.tab-triet-ly .nav {
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    background: #1268b1;
    z-index: 999;
}
.tab-triet-ly .tab-panels {
    padding-top: 0;
}
.tab-qua-trinh .large-5 {
    background: url(https://khangdien.com.vn/wp-content/uploads/2022/12/history-bg.jpg) no-repeat top left;
}

.tab-qua-trinh .nav-vertical .active a {
    background: #70be44;
    color: #fff !important;
        
}
.tab-qua-trinh .nav-vertical  a {
    color: white;
    margin-bottom: 5px;
    margin-top: 5px;
}
.tab-qua-trinh{
    position: relative;
}
.tab-qua-trinh .nav.nav-vertical {
  
    background: rgba(0, 84, 130, 0.85);
}
.tab-qua-trinh  .nav-vertical+.tab-panels {
    border-left: none;
    padding: 0;
}

#post-list .row .post-item:nth-child(1) .box-text,#post-list .row .post-item:nth-child(1) .box-text  a{
    color: white;
} 
#post-list .row .post-item:nth-child(1) .box-text{
          padding: 25px 20px;
    min-height: 195px;
background: var(--primary-color);
}    
#post-list .row .post-item:nth-child(2) .box .box-image .image-cover,#post-list .row .post-item:nth-child(4) .box .box-image .image-cover,#post-list .row .post-item:nth-child(3) .box .box-image .image-cover{
padding-top: 75% !important;
}
#post-list .row .post-item:nth-child(2) .box .box-text .from_the_blog_excerpt ,#post-list .row .post-item:nth-child(3) .box .box-text .from_the_blog_excerpt ,#post-list .row .post-item:nth-child(4) .box .box-text .from_the_blog_excerpt {
display: none;
}
#post-list .row .post-item:nth-child(2) .box .box-image,#post-list .row .post-item:nth-child(4) .box .box-image,#post-list .row .post-item:nth-child(3) .box .box-image{
width: 62%;
}
#post-list .row .post-item:nth-child(2) .box,#post-list .row .post-item:nth-child(3) .box,#post-list .row .post-item:nth-child(4) .box{
    display: flex;
}
#post-list .row .post-item .box-text{
        background: #ebebeb;
    padding: 20px;
}
#post-list .row .post-item .box-text h5{
    text-transform: uppercase;
color: var(--primary-color)
}
#post-list .row .post-item .box-text h5 a{
    min-height: 42px;
    overflow: hidden;
    text-overflow: ellipsis;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
}
#post-list .row .post-item .box-text .from_the_blog_excerpt {
  overflow: hidden;
    text-overflow: ellipsis;

    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    margin: 0;
}
.absolute-footer{
    display: none;
}
div.post-meta:before {
      content: "\f073"; 
font-family: fontawesome;
padding-right: 6px;
}
.box-push .box-text {
 padding-bottom: 8px;
    max-width: 100%;
        position: absolute;
    bottom: -5px;
    margin-bottom: 5px;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .5);
    background-color: rgba(0, 84, 130, 0.7);
}
.box-push .box-text .product-title a,.box-push .box-text h3,.box-push .box-text h4{
	text-transform: uppercase;

	color: white;
}
.box-push .box-text .product-title a{
	font-size: 20px;
}
.product-small.box{
	margin-bottom: 5px;
}
.gioi-thieu-section .col{
	    padding: 2px !important;
}
#header-contact li a span{color: #50b948;text-transform: none;font-size:14px}
#top-bar{margin-bottom: -20px;
    background: transparent !important;
    padding-top: 10px;}
#header-contact .icon-envelop:before, #header-contact .icon-phone:before{color:#50b948}
#header-contact .icon-search:before {
    color: #989898;
}

.chat-facebook{margin:0; background:gray; font-weight:normal; font-size:14px}
.tuyen-dung-section .cot7 .col-inner{    background: #ffffffcc;
    padding: 20px;
    border-radius: 5px;}
.tuyen-dung-section .cot5 .img-inner{overflow: visible;}
.tuyen-dung-section .cot5 img{    max-width: 140%;
    width: 140%;
    margin-left: -130px;}
p{margin-bottom:13px}
.gioi-thieu-section .col, .tuyen-dung-section .col{padding-bottom:0}

.doi-tac-section{background: #ecf6fb;}
.doi-tac-section .ux-logo-link{padding:7px !important}
.doi-tac-section .ux-logo-link img{border-radius: 5px;
        width: 100%;
    height: auto !important;
    box-shadow: 2px 2px 2px #0000000f;}
.khach-hang-section .icon-box-img img{border-radius: 99%;    padding-top: 0;
    width: 100%; margin-top:50px;
    border: 3px solid #50ba46;}
.khach-hang-section .icon-box .icon-box-text{margin-left: -20px;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 3px 4px 7px #00000040;
    padding-left: 24px;
    border-bottom: 2px solid #76c770;
    background: white;}
.list-post .post-item .box-text p{font-size:14px}
.box-blog-post .is-divider{display:none}
.list-post .post-item .post-title{margin-bottom:10px}
.list-post .post-item .post-title:hover{color:#50b948}
.list-post .post-item .post-title{color:#003463}
.tin-tuc-section .col{    padding-bottom: 10px;}
.du-an-section .col{    padding-bottom: 0px;}
.post-item .box-image:hover::before, .du-an-section .image-cover:hover::before{
-webkit-animation:shine .75s;
animation:shine .75s}
@-webkit-keyframes shine{
100%{left:125%}
}
@keyframes shine{
100%{left:125%}
}
.post-item .box-image::before, .du-an-section .image-cover::before{
position:absolute;
top:0;
left:-75%;
z-index:2;
display:block;
content:'';
width:50%;
height:100%;
background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
-webkit-transform:skewX(-25deg);transform:skewX(-25deg)
}
input[type='email'], input[type='search'], input[type='number'], input[type='url'], input[type='tel'], input[type='text'], textarea{    font-size: 14px;
    border-radius: 4px;
    box-shadow: none;}
input[type='submit']{margin: 0;
    border-radius: 5px;

    text-transform: none;
    font-weight: normal;
    letter-spacing: 0;
 }
.footer-section .col{padding-bottom:0}
.footer-secondary {
    padding: 0;
}


a.back-to-top{background: #50b948 !important; border: none !important; color:white}

.nav-dropdown>li.nav-dropdown-col{display:block}
.nav-dropdown{padding:0; background: #003463; border: none}
.nav-dropdown li a:hover{color: #4fba47 !important;}
.nav-dropdown>li{border-right: none !important}
.nav-dropdown>li>a{font-size: 16px !important;padding:10px 15px; color:#dadada  !important}
.nav-dropdown .nav-dropdown-col>a, .nav-dropdown li a{font-weight:normal !important; text-transform:none !important; font-weight:500}
.nav-dropdown .nav-dropdown-col>ul li:hover, .nav-dropdown .nav-dropdown-col>ul li a:hover{background:#0d3e69 !important}
.nav-dropdown-default>li:hover>a, .nav-dropdown .nav-dropdown-col>ul li:hover>a{color:white}#breadcrumbs {
    margin-top: 20px;
    color: #51b948;
    background: #f7f7f7;
    margin-bottom: 20px;
    padding: 6px 15px;
    display: block;
    width: 100%;
    font-size: 15px;
    font-family: "roboto condensed",sans-serif;
    border: 1px solid #e8e8e8;
}
.nav-dropdown-default>li:hover{background:#fbae3c}
.nav-dropdown-default>li>a{border-bottom:0 !important}.nav-dropdown-has-arrow li.has-dropdown:before{border-width: 10px;
    margin-left: -10px;}
.nav-dropdown .nav-dropdown-col>ul li a{color:white !important}

.nav-dropdown .nav-dropdown-col>ul{border:none;margin-top:-39px;box-shadow: none;display:none;position: absolute;
    left: 100%;z-index: 9;background: #51b948;min-width: 240px;}
.nav-dropdown>li.nav-dropdown-col{width:100%;border-right:0}
.nav-dropdown .nav-dropdown-col>ul li a{padding:10px;  text-transform: none;color:black}
.header-nav li.nav-dropdown-col:hover >ul{display:block !important}
.stuck .header-main .nav-dropdown{margin-top:0px !important} 

.absolute-footer{font-size:14px}.page-wrapper {
    padding-top: 0;
    padding-bottom: 0;
}.entry-content {
    padding-top: 0;
    padding-bottom: 0;
}.is-divider{display:none}
.widget .menu{border: 1px solid #ececec;}
.widget .menu li a:hover{background-color:#f3f3f3}
.widget .menu li a{font-size: 15px;
    display: block;
    padding: 8px 10px;
    background-image: url(/wp-content/uploads/2019/05/check@2x.png);
    background-repeat: no-repeat;
    background-size: 11px;
    background-position-y: 14px;
    background-position-x: 9px;
    padding-left: 30px;}
span.widget-title{display: block;
    background: #003463;
    padding: 12px;
    letter-spacing: 0;
    color: white;}
.blog-archive .page-header-wrapper{
        margin-bottom: 20px;
}
.blog-archive .large-3{padding-right:0}
.blog-archive h1.page-title{    margin-bottom: 15px;
    text-transform: none;
    font-size: 25px;
    letter-spacing: 0;
    color: #3fb846;}
.blog-archive .post-item .post-title{font-size: 16px;
    margin-bottom: 7px;}
.blog-archive .chu-dau-tu{    background: #000000bf;
    padding: 4px 10px;
    border-radius: 4px;
    margin-bottom: 10px;
    display: block;
    position: absolute;
    margin-top: -76px;
    margin-left: 6px;
        color: #cccccc;
    font-size: 14px;}
.blog-archive .loai-hinh-du-an{color:#50b948}
.blog-single .danh-muc{margin-bottom:5px}
.blog-single .the-tim-kiem a:hover{background: #50b948; color:white}
.blog-single .the-tim-kiem a{background: #e4e4e4;
    padding: 2px 10px;
    border-radius: 3px;}
.blog-archive .post-item .from_the_blog_excerpt {font-size:14px}
.blog-single .entry-meta{    text-transform: none;
    letter-spacing: 0;
    font-size: 14px;
    color: gray;}
.blog-single .blog-share{text-align:left; margin-top:15px}
.blog-single .blog-share a{border:none}
.blog-single .article-inner p,.blog-single .article-inner ul {font-size:16px; margin-bottom:15px}
.blog-single .article-inner ul{margin-left:20px}
.blog-single h1.entry-title {
    text-align: left;
    font-size: 27px;
	font-weight: 500;color: #003463;}
.blog-single .entry-category {display:none}
.thong-tin-du-an h2{font-size: 22px;
    color: #50b949;
    font-weight: normal;
}
.thong-tin-du-an table td{    color: black;
    font-size: 15px;
    line-height: 26px;}
.box-thong-tin{border: 1px solid white;
    padding: 20px;
    border-radius: 4px;
    background: white;
    box-shadow: 2px 2px 16px #0000001f; margin-bottom:20px}
.thong-tin-du-an ul
.thong-tin-du-an table p, .thong-tin-du-an p, .thong-tin-du-an ul{line-height:26px; font-size:15px !important; color:black}
.blog-single .entry-header-text {
    padding-bottom: 15px;
   
}
.blog-archive .post-item{
	    padding: 0 10px 10px !important;
}
.thong-tin-du-an .anh-dai-dien img{width:100%; object-fit: cover; object-position:center; border-top-left-radius:10px; border-top-right-radius:10px}
.blog-single .large-3{padding-right:0}
.blog-single{padding-top:20px}
.blog-archive .post-item .post-title:hover{color:#3fb846}
.page-template-page-blank-title-center #content{ padding-bottom: 20px;}
.duong-dan{margin-left: 15px;
    margin-right: 15px;}
.blog-archive .large-9 .badge{display:none}
.blog-single .article-inner h2{font-size:22px}
.blog-single .article-inner h3{font-size:20px}
.blog-single .article-inner h4{font-size:18px}
.blog-single .article-inner h5{font-size:16px}

.nav-dropdown .group-menu ul{min-width:500px !important}
.nav-dropdown .cot-menu{width:33.33%; float:left; display:inline-block}


@media(max-width: 855px){
    .current-category-children li a {
    padding: 3px 9px !important;
  
    font-size: 12px;
}
    .tin-tuc-section .post-item .post-title a {
    line-height: 23px;
    min-height: 37px;}
    .title-home .section-title-main {
    font-size: 20px;}
    .tab-triet-ly .nav li{
            display: block;
    width: 100%;
    margin-right: 0px;
    text-align: center;
    }
    .tab-triet-ly .nav li > a{
        width: 100%;
         text-align: center;
    }
    .mfp-content button.toggle{
        color: white !important;
    }
        .nav-vertical>li>ul li a {
        color: #fff;
    }
        .nav-sidebar.nav-vertical>li+li {
        border-top: none;
    }
        .off-canvas .nav-vertical>li>a {
        color: #fff;
    }
    .off-canvas-right .mfp-content, .off-canvas-left .mfp-content {
    --drawer-width: 300px;
}
        .off-canvas-left .mfp-content, .off-canvas-right .mfp-content {
        width: 100% !important;
    }
        .off-canvas-left.mfp-ready .mfp-content, .off-canvas-right.mfp-ready .mfp-content {
        background: rgb(0 84 130 / 78%);
    }
    .section-lanh-dao .box-image{
        width: 80% !important;
    }
    .tab-triet-ly .nav {
    position: relative;
  
    width: 100%;}
    .div-ten .col-inner{
        padding: 10px;
    }
    #post-list .row .post-item .box-text h5 a{
        min-height: unset !important;
    }
    #post-list .row .post-item .box-text {
 
    padding: 10px 20px;
}
	
.gioi-thieu-section .col, .tuyen-dung-section .col {
    padding-bottom: 15px;
}

.ux-logo{width:50% !important}
.doi-tac-section .cot8{display:none}

.list-post .post-item .from_the_blog_excerpt {display:none}
.list-post .post-item .post-title {
    margin-bottom: 10px;
    font-size: 15px;
}.footer-section .col {
    padding-bottom: 10px;
}.blog-archive .large-3 {
    padding-right: 15px;
}.bai-viet-lien-quan ul li{width:50%}
.bai-viet-lien-quan .tieu-de{font-size:14px; line-height:20px}
.thong-tin-du-an ul{margin-left:0 !important}
}

@media(min-width: 1023px){
ul.product-categories > li > a,ul.product-categories > li button{
    display: none;
}
    .tab-qua-trinh .active a:after {
    opacity: 1;
    border-width: 22px;
    margin-top: -22px;
}
.tab-qua-trinh ul li a:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136, 183, 213, 0);
    border-left-color: #70be44;
    border-width: 0;
    margin-top: 0;
    opacity: 0;
    -webkit-transition: all 0.4s;
    -khtml-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}
    .tab-qua-trinh .nav.nav-vertical {
    flex-flow: column;
    width: 80px;
    padding-top: 26px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 52.5%;
    z-index: 9;
   
}
    #post-list .row .post-item:nth-child(1){
        flex-basis: 50%;
    max-width: 50%;
}
#post-list .row .post-item:nth-child(2){
    flex-basis: 50%;
    max-width: 59%;
}


#post-list .row .post-item:nth-child(3){
      position: absolute;
    flex-basis: 50%;
    max-width: 50%;
    right: 0px;
    top: 175px;
}

#post-list .row .post-item:nth-child(2) .box .box-text,#post-list .row .post-item:nth-child(3) .box .box-text,#post-list .row .post-item:nth-child(4) .box .box-text{
    background: #EBEBEB;
    padding: 20px;
}

#post-list .row .post-item:nth-child(2) .box .box-text .post-title  ,#post-list .row .post-item:nth-child(3) .box .box-text .post-title  ,#post-list .row .post-item:nth-child(4) .box .box-text .post-title  {

text-transform: uppercase;
color: var(--primary-color);
}
#post-list .row .post-item:nth-child(4){
      position: absolute;
    flex-basis: 50%;
    max-width: 50%;
    right: 0px;
    top: 350px;
}
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

.custom-athomes {
    padding: 30px 20px !important;
    background-image: url(https://athomes.com.vn/wp-content/uploads/2025/05/tien-ich-tecco-felice-tower.jpg);
    color: #000000;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.custom-athomes.dxmd {
    color: #fff;
    border-radius: 10px;
    margin-bottom: 20px;
}


.custom-athomes div.relative>.row {
    background-color: rgba(255, 255, 255, 0.459);
    padding: 40px 10px;
    border-radius: 10px;
    border: 2px solid #FF9800;
}

.custom-athomes .detail {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.custom-athomes h3.title {
    font-size: xxx-large;
    color: #FF9800;
}

.custom-athomes label {
    color: #000;
}

.custom-athomes.dxmd label {
    color: #fff;
}

.custom-athomes .wpcf7-submit {
    display: block;
    width: 100%;
    background: #FF9800 !important;
    height: 50px;
}

.custom-athomes .col-inner:has(.detail) {
    height: 100%;
}


.modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.modal {
  background: white;
  padding: 20px;
  width: 100%;
  max-width: 600px;
  margin: 100px auto;
  border-radius: 8px;
  position: relative;
  animation: fadeIn 0.3s ease-in-out;
}
.modal input[type='submit'] {
    width: 100%;
}

.close-btn {
  position: absolute;
  right: 15px;
  top: 10px;
  font-size: 24px;
  cursor: pointer;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-30px); }
  to { opacity: 1; transform: translateY(0); }
}

.fix-social {
    display: block;
    bottom: 28px;
    left: 16px;
    position: fixed;
    z-index: 100;
}

.icon-at {
    width: 36px;
    height: 36px;
}

.icon-fill-color {
    fill: #face08;
}

.wapper-icon {
    padding: 8px;
    border-radius: 100%;
    background-color: #FCE4EC;
}

.wapper-flex-icon {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.phonering {
    animation: phonering 2s ease-in-out infinite;
}

@keyframes phonering {
    0% {
        -webkit-transform: rotate(0) 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(0) scale(1) skew(1deg);
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg);
    }
}


<ul class="product-categories"><li class="cat-item cat-item-54 current-cat cat-parent active has-child" aria-expanded="false"><a href="http://localhost/khangdien/du-an/">Dự án</a>
</ul>
</li>
</ul>