.sticky{
    position : sticky;
    top : 0;
}
body{
-webkit-user-select: none; /* Safari 3.1+ */
-moz-user-select: none; /* Firefox 2+ */
-ms-user-select: none; /* IE 10+ */
user-select: none; /* Standard syntax */
}
::-webkit-scrollbar {
width: 9px;
}
/* Track */
::-webkit-scrollbar-track {
box-shadow: inset 0 0 6px green; 
border-radius: 5px;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: #013F03; 
border-radius: 5px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #384; 
}

:root {
	--nova : 'Nova Mono', monospace;
	--zen: 'Zen Kurenaido', sans-serif;
    --ubuntu : 'Ubuntu Mono', monospace;
    --crimson : 'Crimson Pro', serif;
    --sansita : 'Sansita Swashed', cursive;
    --figtree : 'Figtree', sans-serif;
    --bebas : 'Bebas Neue', cursive;

	--ajwa-primary: #384;
	--ajwa-primary-plus: #1a703c;
	--ajwa-secondary :#65AFFF; 
	--ajwa-secondary-plus: #001E3D;
    --ajwa-info : #37B2E6;
    --ajwa-info-plus : #1686B6;
    --ajwa-dark : #063c1c;
    --ajwa-dark-plus : #0b2315;
    --ajwa-light : #CFFFEC;
    --ajwa-light-plus : #CFFFFF;

    
    --ajwa-list : #fffffff3; 
    --ajwa-list-hover : #75f3c15f;


    --ajwa-hf-bg : #FFFFFF;  /* Header Foot Color Scheme */
    --ajwa-hf-bgc :  #FFFFFF;
    --ajwa-h-t : #006737;

    --ajwa-h-bg : #17b87a;   /* Heading bg - centeral bg - heading text */
    --ajwa-hc-bg : #006737;
    --ajwa-h-text : #fffbfa;
}

.ajwa-h-bg{ background-color: var(--ajwa-h-bg);}
.ajwa-hc-bg{ background: var(--ajwa-hc-bg);}
.ajwa-h-text{ color: var(--ajwa-h-text);}



.ajwa-f1{ font-family: var(--ubuntu);  }
.ajwa-f2{ font-family: var(--zen);  }
.ajwa-f3{ font-family: var(--nova);  }
.ajwa-f4{ font-family: var(--crimson);  }
.ajwa-f5{ font-family: var(--sansita);  }
.ajwa-f10{ font-family: var(--figtree);  }
.ajwa-f11{ font-family: var(--bebas);  }




body.dark {
	--light: #0C0C1E;
	--grey: #060714;
	--dark: #FBFBFB;
}

.ajwa-bg-hf { background-color: var(--ajwa-hf-bg);}
.ajwa-bg-hfc { background-color: var(--ajwa-hf-bgc);}
.ajwa-bg-h-t{ background-color:  var(--ajwa-h-t);}

.ajwa-bg-light { background-color: var(--ajwa-light); }
.ajwa-bg-dark { background-color: var(--ajwa-dark); }
.ajwa-bg-primary { background-color: var(--ajwa-primary); }
.ajwa-bg-info { background-color: var(--ajwa-info); }
.ajwa-bg-secondary { background-color: var(--ajwa-secondary); }

.ajwa-text-light { color: var(--ajwa-light); }
.ajwa-text-dark { color: var(--ajwa-dark); }
.ajwa-text-primary { color: var(--ajwa-primary); }
.ajwa-text-info { color: var(--ajwa-info); }
.ajwa-text-secondary { color: var(--ajwa-secondary); }



#button-addon1 {
    color: #35a531;
  }
  
  .itag {
    color: #35a531;
    /* color: #ffc371; */
  }
  
  .form-control::placeholder {
    font-size: 0.95rem;
    color: rgb(136, 136, 136);
    font-style: italic;
  }
  
  .form-control.shadow-0:focus {
    box-shadow: none;
  }

.ajwa-ad-bg{
    background :rgba(51, 169, 242, 0.5);
}

.ajwa-icons a{
    padding : 3px;
    transition:   0.25s padding ease-in;
}
.ajwa-icons a:hover{
    background :rgba(20, 139, 39, 0.1);
    padding : 1px;
}

/* // latest design for 2025 product view // */

/* // top views / near to you / headings */
.web-heading{
    transition : 1s all;
    text-decoration : none;
    margin-bottom : 5px;
    text-decoration: underline;
    line-height: 30px;
    font-size: 21px
}
.web-heading:hover {
    text-decoration : none;
    color : #026b3f;
}
.refresh-btn {
    outline: 0px;
    border : 0px;
}
.refresh-btn > i{
    background : #FFF;
    font-size : 14px;
}

/*  product card  */


.product-card {
    position: relative;
    box-shadow: 1px 2px 4px #a4e2c8;
    transition: 0.25s all;
}
.product-card:hover{
    background : #f1fff4;
    box-shadow : 3px 4px 5px #4b856d;
    }
.badge {
    position: absolute;
    left: 0;
    top: 20px;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    background: #fb2c7b;
    color: #fff;
    padding: 3px 10px;
}

.product-tumb {
    padding: 10px;
    background: #f0f0f0;
    overflow: hidden;
    height : 150px;
}


.product-tumb img {
    width: 100%;
    
}

.product-details {
    padding: 5px;
}

.product-catagory {
    display: block;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: #879;
    margin-bottom: 3px;
}

.product-details h5 a {
    display: block;
    margin-bottom: 2px;
    text-transform: uppercase;
    color: #363636;
    text-decoration: none;
    transition: 0.3s;
    font-size : 15px;

/* for hidding extra text */

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.product-details h5 a:hover {
    color :rgb(13, 101, 184);
    text-decoration : none;
}
.product-details p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 13px;
    line-height: 17px;
    margin-bottom: 5px;
    color: #555;
}

.product-bottom-details {
    overflow: hidden;
    border-top: 1px solid #eee;
    padding-top: 3px;
}

.product-bottom-details div {
    float: left;
    width: 50%;
}

.product-price {
    font-size: 16px;
    color :rgb(13, 104, 189);
    font-weight: 600;
}

.product-price small {
    font-size: 80%;
    font-weight: 400;
    display: inline-block;
    margin-right: 5px;
}

.product-links {
    text-align: right;
}
.like-btn:hover {
    color: #fb2c7b;
}
.like-btn {
    display: inline-block;
    margin-left: 5px;
    color: #aca0a0;
    transition: 1s all;
    font-size: 15px;
    border : 0px;
    outline : 0px;
}

@media only screen and (max-width: 600px) {
    .floating-button{
        border-radius: 10px;
        padding : 8px;
        font-family : var(--nova);
        color : rgb(13, 104, 189);
        transition: 0.5s;

    }
  }
  @media only screen and (min-width: 600px) {
    .floating-button{
        border-radius: 15px;
        padding : 12px;
        font-family : var(--figtree);
        color : rgb(13, 104, 189);
        transition: 0.5s;
    }
  }
  
.floating-button:hover {
    outline-color: transparent;
    border-color: transparent;
    outline-style:solid;
    box-shadow: 0 0 0 5px rgb(13, 104, 189);
    color : #2d7758;
    background-color:  #fefefe;
}

/* // NEW STYLE IN FAVOURITE AND ADS SECTION  */
    .search-box{
        font-family : Roboto, Helvetica, sans-serif;
        background: #FEFEFE;
        font-size: 16px;
        color: #07074D;
        line-height : 22px;
        width : 100%;
        max-width : 480px;
        padding : 7px 0px;
        transition : all 0.5s;
        border: 1px solid rgba(12, 212, 135, 0.51);
    }
    .search-box:hover {
        box-shadow: 0px 3px 8px rgba(12, 212, 135, 0.51);
    }
    .search-input{
        width: calc(100% - 54px);
        max-width : 480px;
        padding-left : 10px;
        outline: none;
        resize: none;
        border  : 0;
        box-shadow: 0;
    }
    
    .search-icon{
        width : 50px;
    }
    .product-div{
        font-family : Roboto, Helvetica, sans-serif;
        width : 100%;
        display : flex;
        flex-direction : row;
        overflow : block;
        border : 1px solid #07074D;
        outline : none;
        resize : none;
        background : #FEFEFF;
        box-shadow : 0px 3px 9px #000;
        padding : 5px 5px;
        margin-bottom : 10px;
        transition : 2s all;
    }
    .img-div{
        display : flex;
        justify-content : center;
        align-items : center;
    }
    .img-cover{
        border : 1px double #444;
        border-radius : 4px;
        overflow : hidden;
        padding : auto;
        width : 150px;
        height : 150px;
        
    }
    .img-cover > img {
        width : 100%;
        height : 100%;
        margin  : auto;
    }

    .detail-box{
        position : relative;
        width: calc(100% - 150px);
        padding : 15px;
        /* font-family : "YouTube Sans", "Roboto", sans-serif; */
        font-family : Roboto, Helvetica, sans-serif;
    }
    @media only screen and (max-width : 550px){
        .detail-box{
            width : calc(100% - 100px);
            padding : 5px;
        }
        .img-cover{
            width : 100px;
            height : 100px;
        }
    }
    .id-daytime {
        width : 100%;
        position : relative;
        display : flex;
        font-size : 14px;
        justify-content : space-between;
    }
    .con {
        color :rgb(13, 104, 189);

    }
    
    @media only screen and (max-width : 400px) {
        .id-daytime {
            flex-direction : column;
        }
        .daytime {
            display : none;
        }
    }
    .ad-title {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height : 16px;
        font-size : 16px;
        font-weight : 600;
    }
    .ad-location{
        font-size : 13px;
    }
    .ad-price{
        font-size : 16px;
        font-weight : 700;
        color :rgb(13, 104, 189);
    }
    .button-box{
        width : 100%;
        display : flex;
        justify-content : flex-end;
        display : inline-block;
        gap : 5px;
    }
    .detail-box-btn , .load-more-btn{
        background: #FFFFFF;
        border: 0.5px solid #DDE3EC;
        border-radius: 5px;
        font-size: 14px;
        line-height : 24px;
        font-family : Roboto, Helvetica, sans-serif;
        display : inline-block;
        color: #02234f;
        cursor: pointer;
        padding: 0px 18px;
        transition: all .3s ease-in-out;
        margin : 5px;
    }
    @media only screen and (max-width : 767px) {
        .detail-box-btn > span {
            display : none;
        }
        .detail-box-btn {
            padding : 12px;
            margin : 5px;
        }
    }
    .detail-box-btn:hover {
        text-decoration : none;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.12);
        color :rgb(9, 98, 121);
    }

    .load-more-btn:hover{
        text-decoration : none;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.12);
        color :rgb(9, 98, 121);
        box-shadow : 3px 3px 6px  #000;
    }
    .load-more-btn{
        transition : 1s all;
        text-align : center;
        width : 100%;
    }