﻿body {
    font-family: Arial Narrow;

}
.footer {
    background-color: #D9D9D9;
    margin:0.01rem;
}
.font-bannerduoi-1 {
    font-size:24px;
    font-weight:bold;
}
.font-bannerduoi-2 {
    font-size: 20px;
}
.btn-primary {
    --bs-btn-color: Black;
    --bs-btn-bg: #ADDD43;
    --bs-btn-border-color: none;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #99CC00;
    --bs-btn-hover-border-color: #0a58ca;
    font-weight: bold;
}
.btn-primary-trongsuot {
    --bs-btn-color: Black;
    --bs-btn-bg: #ADDD43;
    --bs-btn-border-color: none;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #99CC00;
    --bs-btn-hover-border-color: #0a58ca;
    opacity:0.2;
    font-weight: bold;
}
.more:hover {
    font-weight: bold !important;
    color: white !important;
    background-color: #ade13b;
    text-decoration:none !important;
}
a {
    text-decoration:none !important;
}
:root {
    --color-kc: rgb(173 221 67 / 65%);
    --color-bright-kc: rgb(167 226 0 / 75%);
    --bs-gutter-x: 0 !important;
    --bs-gutter-x: 0 !important;
}

.fs-7 {
    font-size: 0.75rem;
}
.color-xam {
    color: #EEEEEE;
}

    .flex-container {
        display: flex;
        /*background-color: DodgerBlue;*/
    }

    .flex-container > div {
        /*background-color: #f1f1f1;*/
        /*margin: 10px;
        padding: 20px;
        font-size: 30px;*/
    }
    .bg-kc {
        background-color: var(--color-kc);
    }
.bg-bright-kc {
    background-color: var(--color-bright-kc);
}
    .color-kc {
        color: var(--color-kc) !important;
    }
    .color-bright-kc {
        color: var(--color-bright-kc) !important;
    }

    .input-kc {
        border-color:var(--color-kc) !important;
        border-style:solid !important;
        height:35px;
        border-radius:0;
        border-width:2px;
    }
    .input-kc:focus {
            border-width: 2px !important;
            border-style: solid !important;
            box-shadow: 0 0 5px 0.25rem #e2efba !important;
        }
.button-kc {
    background-color: var(--color-kc);
    border-color: var(--color-kc) ;
    border-radius: 0;
    color: white;
    height: 35px;
    border-style:solid;
}
    .button-kc:hover {
        background-color: #9ddb5c;
    }
    .button-kc:active {
        background-color: var(--color-kc) !important;
        color: white !important;
        box-shadow: 0 0 5px 0.15rem #e2efba;
    }


.font-brand {
    font-family: VNI-Helve-Condense;
    font-weight: bold;
    color: #595959;
    font-size:13pt;
}
.logobrand {
    height: 16px;

}
.navbar-brand {
    margin-right:0px !important;
}
.navbar-nav {
    padding:10px;
}
.navbar-toggler {
    border: none;
}
.dropdown-divider {
    /*border:0.5px solid gray;*/
}

@media(max-width: 500px) {
            
    
}

    @media(max-width: 576px) {
        .font-bannerduoi-1 {
            font-size: 18px;
            font-weight:bold;
            width:160px;
        }

        .font-bannerduoi-2 {
            font-size: 16px;
        }
        .more:hover {
        
            color: white !important;
            background-color: #ade13b;
            text-decoration: none !important;
        }
        .searchbox-2 {
            width: 150px;
            height: 30px !important;
            font-size: 9pt;
            padding-top: 3px;
            padding: 0;
            margin-left: 5px;
        }
        .searchbutton-2 {
            width: 150px;
            height: 30px !important;
            font-size: 9pt;
            padding: 0;
        }
        .subscr-button {
            height: 30px;
        }
        .subscr-input {
            width: 150px !important;
            height: 30px;
            font-size: 9pt;
            border: none;
            box-shadow: none;
            border-radius: 0;
        }
        .searchbutton {
            width: 130px;
            height: 30px !important;
            font-size: 9pt;
            padding: 0;
        }

        .searchbox {
            font-size: 9pt;
            height: 30px;
        }

        .canhle-header {
            padding-left: 1rem;
            padding-right: 1rem
        }
    }

    @media(min-width: 576px) {
        
        .subscr-button {
            height: 30px;
        }
        .subscr-input {
            width: 250px !important;
            height: 30px;
            border: none !important;
            box-shadow: none !important;
            border-radius: 0;
        }
        .searchbox {
            width: 250px !important;
        }

        .row {
            margin-right: 0px;
            margin-left: 0px;
        }

        .container-fluid {
            padding: 0 !important;
        }

        .canhle-header {
            padding-left: 1.5rem;
            padding-right: 1.5rem
        }

        .canhle-header-2 {
            padding-left: 1.5rem;
            padding-right: 1.5rem
        }
    }

    @media(min-width: 768px) {
        .border-footer {
            border-left: 1px solid black;
        }
    }

    @media(max-width: 768px) {
        .nav-item{
            font-weight:normal;
        }
        .col-footer {
            padding: 10px;
        }

        .container-fluid {
            padding: 0;
        }
    }



    @media (max-width: 991px) {

        .dropdown-menu .dropdown-menu {
            margin-left: 0.7rem;
            margin-right: 0.7rem;
            margin-bottom: .5rem;
        }
    }

    @media all and (min-width: 300px) {

        .dropdown-menu li {
            position: relative;
        }

        .dropdown-menu .submenu {
            display: none;
            position: absolute;
            left: 100%;
            top: -7px;
        }

        .dropdown-menu .submenu-left {
            right: 100%;
            left: auto;
        }

        .dropdown-menu > li:hover {
            background-color: #f1f1f1
        }

            .dropdown-menu > li:hover > .submenu {
                display: block;
            }
    }
    /*css cho navbar*/
    .navbar-toggler {
        /*border-width:1px;*/
        box-shadow: none !important;
    }

    .navbar {
        font-weight: bold;
        font-size: 0.8rem;
        padding-top: 0;
        padding-bottom: 0;
    }

    .nav-link {
        color: black;
    }
    /*ket thuc css cho navbar*/

    .background-doimau:hover {
        background-image: linear-gradient(to left, #92d050 0%, #3bb939 51%, #92d050 100%);
        color: #fff !important;
        background-position: right center;
    }

    .background-doimau {
        font-size: 14px;
        -o-transition: all .4s ease-in-out;
        -webkit-transition: all .4s ease-in-out;
        transition: all .3s ease-in-out;
        text-transform: capitalize;
        background-size: 200% auto;
    }

    /*luon de menutop*/
    #div1 {
        transition: opacity 0.3s ease; /* Smooth hiding effect */
    }

    .sticky-top {
        background-color: white; /* To distinguish div2 */
    }
    /*END luon de menutop*/


    /*hieu ung mau chay link*/
    .link-animate {
        cursor: pointer;
        color: black;
        position: relative;
        text-decoration: none;
    }

        .link-animate::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 1px;
            border-radius: 4px;
            background-color: #483829ad;
            bottom: 0;
            left: 0;
            transform-origin: right;
            transform: scaleX(0);
            transition: transform .2s ease-in-out;
        }

        .link-animate:hover::before {
            transform-origin: left;
            transform: scaleX(1);
        }
    /*END hieu ung mau chay link*/



    .property-item img {
        transition: .5s;
    }

    .property-item:hover img {
        transform: scale(1.1);
    }