/* ==========================================================
   TGG-TABLET-HEADER-FIX-V1

   Prevent the desktop search bar from colliding with
   notification, message, profile and Post Ad controls
   on tablet / iPad widths.

   Desktop and mobile remain unchanged.
   ========================================================== */


/* ----------------------------------------------------------
   TABLET / IPAD
   ---------------------------------------------------------- */

@media screen and (min-width: 769px) and (max-width: 1100px) {

    /*
     * There is not enough horizontal room for the full
     * desktop search field plus all account controls.
     *
     * Hide only the header search area on tablets.
     */
    .top-ser {
        display: none !important;
    }

}


/* ----------------------------------------------------------
   DESKTOP
   Restore normal search display explicitly.
   ---------------------------------------------------------- */

@media screen and (min-width: 1101px) {

    .top-ser {
        display: block;
    }

}

.hom-head .container{display:none}
  .hom-top{transition:all .5s ease;background:#006ebf;box-shadow:none}
  .hom-head{background:none!important;padding:0;margin:0}
  .hom-head .hom-top .container{display:block}
  .dmact .top-ser{display:block}
  .hm3-auto-ban{background:url(../img/automobile-bg.jpg) no-repeat;background-size:100%;background-position:center right;padding-top:55px}
  .h2-ban-ql{display:table}
  .hm3-auto-ban .rhs .hom-col-req .log-bor{display:block}
  .caro-home{margin-top:90px;float:left;width:100%}
  .carousel-item:before{background:none}
  .ban-tit h1{font-weight:500;color:#fff;text-shadow:none}
  .ban-tit h1 b{font-weight:700;font-size:42px;line-height:49px;padding-bottom:15px;color:#fff;text-shadow:none}
  .h2-ban-ql ul li div{border:1px solid #d9d9da;background:#fff}
  .h2-ban-ql ul li div h5{font-weight:500;color:#383942}
  .h2-ban-ql ul li div h5 span{font-weight:700}
  .home-tit h2{font-weight:400}
  .home-tit h2 span{font-weight:700}
  .h2-ban-ql ul li div:hover{background:#d3f0fb;box-shadow:0 14px 22px -13px #0b1017ba}
  .land-pack-grid-text{position:relative;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease;position:absolute;top:0;bottom:0;left:0;right:0;width:100%;height:100%;z-index:2;background:linear-gradient(to top,#000000c7,#00000008)}
  .land-pack-grid-text h4{padding:15px;font-size:20px;font-weight:400;text-align:center;bottom:0;position:absolute;width:100%;text-align:center;color:#fff}
  .land-pack-grid-text h4 .dir-ho-cat{color:#f6f7f9;font-size:11px;position:relative;width:100%;display:inline-block}
  .land-pack-grid-img{background:#333}
  .home-tit{padding-top:60px}
  .hom2-hom-ban{float:left;width:46%;background-size:cover;margin:0 2%;background:#e6f6fb;padding:30px 100px 30px 30px;border-radius:5px;position:relative}
  .hom2-hom-ban:hover a{background:#d6c607}
  .hom2-hom-ban h2{font-weight:600;font-size:22px;padding-bottom:5px}
  .hom2-hom-ban p{font-size:14px}
  .hom2-hom-ban a{background:#21d78d;color:#fff;padding:10px 20px;border-radius:5px;display:inline-block;cursor:pointer;font-size:13px;font-weight:400}
  .hom2-hom-ban p,.hom2-hom-ban h2,.hom2-hom-ban a{position:relative;color:#fff}
  .hom2-hom-ban:before{content:'';position:absolute;width:100%;height:100%;left:0;top:0;right:0;bottom:0;z-index:0;opacity:.8;background:#24C6DC;border-radius:5px}
  .hom2-hom-ban1:before{background-image:linear-gradient(140deg,#0c7ada 0%,#0761af 50%,#0f243e94 75%)}
  .hom2-hom-ban2:before{background-image:linear-gradient(140deg,#768404 0%,#768404 50%,#0f243e94 75%)}
  .hom2-hom-ban1{background-image:url(../img/home2-hand.jpg)}
  .hom2-hom-ban2{background-image:url(../img/home2-work.jpg)}
  .hom2-hom-ban-main{float:left;width:100%;padding-bottom:70px}
  .hom2-cus-sli{float:left;width:100%;padding-top:0}
  .hom2-cus-sli ul li{float:left;width:25%;padding:12px 20px}
  .testmo{width:100%;background:#fff;box-shadow:0 1px 7px -3px #161d2926;border-radius:5px;padding:30px;position:relative}
  .testmo img{width:64px;height:64px;border-radius:50px;object-fit:cover;margin:-80px 0 0}
  .testmo h4{font-size:14px;font-weight:600;margin-bottom:2px;}
  .testmo span{font-size:11px;font-weight:400;color:#727688}
  .testmo span a{font-weight:500;color:#4caf50;display:block;font-size:12px}
  .testmo p{color:#727688;font-size:12px;line-height:20px;margin:0;font-weight:400;height:58px;overflow:hidden;border-top:1px solid #f1eeee;padding-top:15px;margin-top:15px}
  .testmo p:before{content:'format_quote';font-size:21px;margin:-25px 0 0;background:#fff}
  .hom2-cus{background:#f7f8f9;padding-bottom:70px}
  .testmo .rat{padding:2px 2px 2px 10px;display:inline-block;position:absolute;right:30px;top:50px}
  .testmo .rat i{color:#FF9800;font-size:13px;width:7px}
  .hom2-cus-sli ul{position:relative;overflow:hidden;padding:20px 20px 0}
  .slick-arrow{width:50px;height:50px;border-radius:50px;background:#fff;border:1px solid #ededed;color:#ffffff03;position:absolute;z-index:9;top:38%}
  .slick-arrow:before{content:'chevron_left';font-size:27px;top:4px;left:9px}
  .slick-prev{left:14px}
  .slick-next{right:14px}
  .slick-next:before{content:'chevron_right';font-size:27px}
  .hom4-prop-box{padding:0;background:#fff;box-shadow:0 1px 14px -4px #161d2926;border:1px solid #efefef}
  .hom4-prop-box img{width:100%;border-radius:2px;margin:0;height:120px}
  .hom4-prop-box div{padding:25px}
  .hom4-prop-box .rat{position:relative;top:initial;right:initial;padding:2px 2px 2px 0;display:block;margin:0;height:17px;left:-2px}
  .hom4-fea{background:#fff;padding-bottom:40px}
  .hom4-fea .hom2-cus-sli ul li{padding:12px 20px}
  .hom4-fea .home-tit{margin-bottom:0;padding-top:70px}

/* TGG-TABLET-HEADER-CONSOLIDATED-V1-20261003 */
    /* Effective final state of former tablet patches V2.2–V2.5 and notification badge patch. */
    @media screen and (min-width: 768px) and (max-width: 1100px) {
        #userNotification {
            margin-left: 2px !important;
            margin-right: 2px !important;
        }
        #userMessages {
            margin-left: 2px !important;
            margin-right: 2px !important;
        }
        #userNotification > a {
            overflow: visible !important;
        }
        #userMessages > a {
            overflow: visible !important;
        }
        #userNotification .badge {
            display: inline-block !important;
        }
        #userMessages .badge {
            display: inline-block !important;
        }
        .hom-nav {
            width: 100% !important;
            min-width: 0 !important;
            box-sizing: border-box !important;
        }
        .hom-nav > .top-log {
            flex: 0 0 auto !important;
            margin-left: 0 !important;
            margin-right: 10px !important;
        }
        .hom-nav > .top-log .ic-logo {
            width: 125px !important;
            max-width: 125px !important;
            height: auto !important;
        }
        .hom-nav > .menu {
            flex: 0 0 auto !important;
            margin-left: 0 !important;
            margin-right: 8px !important;
        }
        #userNotification {
            display: block !important;
            flex: 0 0 38px !important;
            width: 38px !important;
            min-width: 38px !important;
            max-width: 38px !important;
            height: 40px !important;
            margin: 0 3px !important;
        }
        #userMessages {
            display: block !important;
            flex: 0 0 38px !important;
            width: 38px !important;
            min-width: 38px !important;
            max-width: 38px !important;
            height: 40px !important;
            margin: 0 3px !important;
            overflow: visible !important;
        }
        #userNotification > a {
            display: block !important;
            width: 38px !important;
            height: 40px !important;
            position: relative !important;
        }
        #userMessages > a {
            display: block !important;
            width: 38px !important;
            height: 40px !important;
            position: relative !important;
        }
        #userNotification img {
            display: block !important;
            visibility: visible !important;
            opacity: 1 !important;
            max-width: 100% !important;
        }
        #userMessages img {
            display: block !important;
            visibility: visible !important;
            opacity: 1 !important;
            max-width: 100% !important;
        }
        #userNotification .badge {
            visibility: visible !important;
            opacity: 1 !important;
        }
        #userMessages .badge {
            visibility: visible !important;
            opacity: 1 !important;
            z-index: 20 !important;
        }
        .hom-nav > .al .head-pro h4 {
            vertical-align: middle !important;
        }
        .hom-nav > ul.bl > li > a {
            padding-left: 9px !important;
            padding-right: 9px !important;
        }
        .hom-nav > .mob-menu > .mob-me-all {
            display: none;
        }
        .hom-nav > .al {
            flex: 0 0 100px !important;
            width: 100px !important;
            min-width: 100px !important;
            max-width: 100px !important;
            margin-left: 4px !important;
            margin-right: 6px !important;
            padding: 0 !important;
            overflow: hidden !important;
            box-sizing: border-box !important;
        }
        .hom-nav > .al .head-pro {
            display: flex !important;
            align-items: center !important;
            width: 100% !important;
            max-width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: hidden !important;
            white-space: nowrap !important;
            box-sizing: border-box !important;
        }
        .hom-nav > .al .head-pro > img {
            flex: 0 0 28px !important;
            width: 28px !important;
            height: 28px !important;
            min-width: 28px !important;
            margin-right: 5px !important;
            object-fit: cover !important;
        }
        .hom-nav > .al .head-pro h4 {
            display: block !important;
            flex: 1 1 auto !important;
            width: auto !important;
            min-width: 0 !important;
            max-width: 62px !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            white-space: nowrap !important;
            font-size: 11px !important;
            line-height: 28px !important;
            box-sizing: border-box !important;
        }
        .hom-nav > ul.bl {
            flex: 0 0 auto !important;
            width: auto !important;
            min-width: 0 !important;
            margin-right: 8px !important;
            padding: 0 !important;
            white-space: nowrap !important;
            box-sizing: border-box !important;
        }
        .hom-nav > ul.bl > li {
            float: none !important;
            width: auto !important;
            margin: 0 !important;
            padding: 0 !important;
        }
        .hom-nav > ul.bl > li > a {
            display: block !important;
            width: auto !important;
            padding: 9px 9px !important;
            font-size: 10px !important;
            line-height: 16px !important;
            white-space: nowrap !important;
            box-sizing: border-box !important;
        }
        .hom-nav > .mob-menu {
            flex: 0 0 40px !important;
            width: 40px !important;
            min-width: 40px !important;
            margin-right: 0 !important;
        }
        .hom-nav {
            display: flex !important;
            align-items: center !important;
            flex-wrap: nowrap !important;
        }
        .hom-nav > .top-log {
            order: 10 !important;
            float: none !important;
            flex-shrink: 0 !important;
            position: relative !important;
            z-index: 2 !important;
        }
        .hom-nav > .menu {
            order: 20 !important;
            float: none !important;
            flex-shrink: 0 !important;
        }
        .hom-nav > .top-ser {
            display: none !important;
        }
        .top-ser {
            display: none !important;
        }
        #userNotification {
            order: 30 !important;
            float: none !important;
            left: auto !important;
            right: auto !important;
            top: auto !important;
            transform: none !important;
            flex-shrink: 0 !important;
        }
        #userMessages {
            order: 40 !important;
            float: none !important;
            position: relative !important;
            left: auto !important;
            right: auto !important;
            top: auto !important;
            transform: none !important;
            flex-shrink: 0 !important;
        }
        .hom-nav > ul.bl {
            order: 50 !important;
            float: none !important;
            flex-shrink: 0 !important;
            margin-left: 5px !important;
        }
        .hom-nav > .al {
            order: 60 !important;
            float: none !important;
            flex-shrink: 0 !important;
        }
        .hom-nav > .mob-menu {
            order: 70 !important;
            float: none !important;
            flex-shrink: 0 !important;
            margin-left: auto !important;
        }
        #userNotification {
            position: relative !important;
            overflow: visible !important;
        }
        #userNotification .badge {
            position: absolute !important;
            top: 1px !important;
            right: -1px !important;
            bottom: auto !important;
            left: auto !important;
            margin: 0 !important;
            z-index: 50 !important;
            transform: none !important;
        }
        #userNotification [class*="badge"] {
            position: absolute !important;
            top: 1px !important;
            right: -1px !important;
            bottom: auto !important;
            left: auto !important;
            margin: 0 !important;
            z-index: 50 !important;
            transform: none !important;
        }
    }

/*
 * TGG-MOBILE-MESSAGE-BADGE-20260923
 * Visual notification for newly received chat messages.
 */

#userMessages {
    overflow: visible !important;
}

#userMessages > a {
    overflow: visible !important;
}

#userMessages .tgg-message-unread-badge {
    position: absolute !important;
    top: -5px !important;
    right: -5px !important;

    min-width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;

    padding: 0 5px !important;
    border-radius: 10px !important;

    font-size: 11px !important;
    font-weight: 700 !important;
    text-align: center !important;

    z-index: 100 !important;

    box-shadow: 0 0 0 2px #fff !important;
}

#userMessages.tgg-new-message-arrived {
    animation: tggMessageNotify 0.55s ease-in-out 3;
}

@keyframes tggMessageNotify {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.18);
    }

    100% {
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    #userMessages.tgg-new-message-arrived {
        animation: none !important;
    }
}