
     @media(max-width:991px){
    .wt-bnr-inr {
        height: 233px!important;
        padding-top: 98px!important
    }
}
.phonesizesearch{
    display:none;
}
 @media(max-width:900px)
    {
       .phonesizesearch{
    display:block;
    margin-top:10px;
} 
    }


    @media(max-width:500px)
    {
        .top-bar{
            display:none !important;
        }
        .list-item-container{
            /*background: antiquewhite;*/
            padding: 13px;
            border: 1px solid gray;
            margin-bottom: 20px;
             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }
    }
    .listing-cat-text {
    margin-top: 42px !important;

}

.list-group-item:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
 .results {
            width: 100%;
            list-style-type: none;
            padding-left: 0;
            margin-left: 0;
        }

        .results li {
            width: 100%;
        }
        .results li a span{
           font-size:15px!important;
           color:#337ab7;
               padding: 6px 12px!important;
        }
        
        @media only screen and (max-width: 900px) {
.addlisting-btn {
           padding: 4px 9px;
    background-color: #f96b39;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    color: #fff;
    font-size:13px;
}
}

    @media only screen and (max-width: 350px) {
.addlisting-btn {
           padding: 4px 5px;
    background-color: #f96b39;
    border-radius: 6px;
    font-size:8px;

    -webkit-border-radius: 6px;
    color: #fff;
}

    .phonesizesearch{
    display:block;
    margin-top:13px;
} 

}


.BorderColorChangeElement {
  	animation: BorderColorChange 1s ease-out 0s infinite alternate none running;
}
@keyframes BorderColorChange{
  	0%  { border: 10px solid #ffc0cb;}
  	100%  { border: 10px solid #ff69b4;}
}

        /* Position the button at the bottom left */
        .side-blinking-button {
            position: fixed;
            left: 20px;
            bottom: 20px;
            padding: 10px 20px; /* Thinner button */
            background-color: #f96b39;
            color: white;
            font-size: 18px;
            font-weight: 900; /* Bold font */
            border: none;
            border-radius: 5px;
            cursor: pointer;
            text-decoration: none;
            animation: blinking 2s infinite; /* Slow blink speed */
            writing-mode: horizontal-tb; /* Horizontal text */
        }

        /* Blinking effect */
        @keyframes blinking {
            0% { opacity: 1; }
            50% { opacity: 0.5; }
            100% { opacity: 1; }
        }

        /* Hover effect */
        .side-blinking-button:hover {
            background-color: #e35f32;
        }
        
           
        .custom-opacity {
            opacity: 0.8
        }

.banner-content-area {
    padding: 80px 0 80px;
}
.pagination-bx.clearfix {
    overflow: auto;
}

    /* General Section Styles */
.city-list {
    background-color: #f9f9f9;
    padding: 50px 0;
    border-top: 2px solid #007bff;
}

.city-list h2 {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 30px;
    color: #333;
}

/* Search Bar */
.search-bar {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}

#city-search {
    padding: 10px 15px;
    font-size: 16px;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

#city-suggestions {
    margin-top: 5px;
    padding: 0;
    list-style: none;
    background: white;
    border: 1px solid #ddd;
    border-radius: 5px;
    display: none;
}

#city-suggestions li {
    padding: 10px;
    cursor: pointer;
}

#city-suggestions li:hover {
    background-color: #f1f1f1;
}

/* City Boxes */
.city-box {
    background-color: #fff;
    padding: 20px 15px;
    border: 1px solid #ddd;
    border-radius: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.city-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.city-box h4 {
    font-size: 1.25rem;
    font-weight: bold;
    color: #007bff;
    margin: 0;
}

.city-link {
    text-decoration: none;
    color: inherit;
}

.city-link:hover {
    text-decoration: underline;
}

@media(max-width:500px){
    .phonesizesearch{
        display:none;
    }
    .banner-content-area {
        padding: 26px 0px 24px;
    }
}

                  
@media (forced-colors: active) {
    /* Styles for forced colors mode */
    body {
        background-color: black !important;
        color: white !important;
    }
}
