@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css');

:root
{
    --brand-color-theme-1:#9d180f;
}

header ::selection, .top-section-search ::selection, .top-bar ::selection, footer ::selection
{
    background-color: #000;
    color: white;
}
::selection
{
    background-color: var(--brand-color-theme-1);
    color: white;
}

a{
    text-decoration: none;
}
body
{
    padding: 0;
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
}

#upBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 15px;
    border: none;
    outline: none;
    background-color: #000;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;
    color: white;
    cursor: pointer;
    width: 50px;
    height: 50px;
    border-radius: 500px;
}


.fButton
{
    display: inline-block;
    padding: 10px 30px;
    background-color: var(--brand-color-theme-1);
    color: white!important;
    border-radius: 3px;
    font-size: 13px;
    border: 1px solid var(--brand-color-theme-1);
}




#upBtn:hover {
    background-color: var(--brand-color-theme-1);
}

img
{
    width: 100%;
}

.title
{
    font-size: 27px;
    font-weight: 600;
    letter-spacing: 1px;
    margin-bottom: 30px;
}

/* top header start here  */
.top-header 
{
    background-color: var(--brand-color-theme-1);
}

.top-header div.row
{
    padding: 15px 0px;
}
.top-header div.row div a
{
    color: white;
    font-size: 14px;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: 1px;
}

.top-header div.row div:first-child a
{
    position: relative;
    top: 5px;
}
.top-header div.row div ul
{
    display: flex;
    margin: 0;
    padding: 0;
    justify-content: end;
}
.top-header div.row div ul li
{
    list-style:none;
    margin-right: 10px;
}

.top-header div.row div ul li a
{
    display: block;
    width: 35px;
    height: 35px;
    font-size: 15px;
    border-radius: 500px;
    border: 1px solid white;
    padding-top: 10px;
    text-align: center;
    transition: all 0.1s ease;
}

.top-header div.row div ul li a:hover
{
    background-color: white;
    color: var(--brand-color-theme-1);
    box-shadow: 0px 0px 2px 5px rgba(255, 255, 255, 0.35), 0px 0px 10px 5px rgba(255, 255, 255, 0.64);
}

/* header start here */

.top-bar
{
    background-color: var(--brand-color-theme-1);
    padding: 10px 0px;
}

.top-bar .col-auction span
{
    color:white;
    font-size: 13px;
}

.top-bar .col-auction span i
{
    margin-right: 5px;
}

.top-bar .col-auction span a
{
    color: white;
}

.top-bar .col-auction span a i
{
    margin-left: 5px;
}
.top-bar .btn-top{
    text-align: end;
}
.top-bar .col-account
{
    text-align: end;
    color: white;
}

.top-bar .col-account a 
{
    font-size: 13px;
    color: white;
}
.top-section-search
{
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ededed;
    background-color: #efe0e0;
}

.top-section-search .row div img.logo-img
{
    width: 6rem;
}

.top-section-search .search-sec
{
    display: flex;
    justify-content: end;
    place-items: center;
}

.top-section-search .search-sec .input-group
{
    width: 60%;
}

.top-section-search .search-sec .input-group input
{
    border-color: white;
    border: 1px solid #dedede;
    height: 40px;
    font-size: 11px;
    box-shadow: none;
    border-radius: 3px;
}



.top-section-search .search-sec .input-group span
{
    background-color: var(--brand-color-theme-1);
    color: white;
    font-size: 11px;
    font-weight: 400;
    padding-left: 30px;
    padding-right: 30px;
    border: 1px solid var(--brand-color-theme-1);
    border-radius: 3px;
}

.top-section-search .btn-top-col
{
    display: flex;
    justify-content: start;
    place-items: center;
}

.top-section-search .btn-top-col .fButton
{
    padding: 11px 20px;
    font-size: 11px;
    font-weight: 500;
}

body.not-home header
{
    border-bottom: 0px;
}

header{
    position: sticky;
    top: 0;
    z-index: 999;
}


body.body-dashboard header {
    z-index: unset;
}

    .navbar-desktop .navbar-nav {
        width: 100%;
        justify-content: end;
        place-items: center;
    }
.navbar-toggle-main
{
    border: 3px solid #000;
    box-shadow: none!important;
    border-radius: 3px;
}
.navbar-toggle-main img
{
    width: 30px;
}
.user-drop img
{   
    width: 50px;
    border-radius: 500px;
}
.user-drop a
{
    font-size: 13px;
    font-weight: 500;
}
.user-drop .dropdown-menu
{
    padding: 0;
    border-radius: 0;
}

.user-drop .dropdown-menu a
{
    font-size: 13px;
    padding: 10px;
}
.user-drop .dropdown-menu a:hover
{
    background-color: var(--brand-color-theme-1);
    color: white;
}
.user-drop .dropdown-menu a i
{
    margin-right: 10px;
}
.navbar-desktop .navbar-nav .user-drop .dropdown-menu
{
    padding: 0;
    border-radius: 0;
    width: 100%;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.navbar-desktop .navbar-nav .nav-link
{
    font-size: 13px;
    padding-right: 20px;
    color: #000;
    font-weight: 500;
}

.navbar-desktop .browse-category
{
    background-color: transparent;
    border: 0;
    font-size: 13px;
    font-weight: 500;
}

.navbar-desktop .browse-category-dropdown .dropdown-menu
{
    min-width: 230px!important;
    width: 230px!important; 
}

.navbar-desktop .browse-category-dropdown .dropdown-menu a
{
    font-size: 13px;
}
/* header ends here */

.sg-brother .carousel-item .carousel-caption
{
    width: 100%;
    height: 100%;
    background-color: transparent;
    left:0;
    right: 0;
    bottom: 0;
}

.sg-brother .carousel-item .carousel-caption .view-auction-btn
{
    width: 100%;
    position: absolute;
    bottom: 0;
    text-align: start;
}

.sg-brother .carousel-item .carousel-caption .view-auction-btn img
{
    width: 15%;
    margin-bottom: 5%;
    margin-left: 4%;
}
.sg-brother .carousel-item .carousel-caption .bid-now
{
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: start;
}

    .sg-brother .carousel-item .carousel-caption .bid-now img {
        width: 15%;
        margin-left: 75%;
        margin-bottom: 10%;
    }

.sg-brother .carousel-indicators [data-bs-target]
{
    width: 15px;
    height: 15px;
    border-radius: 500px;
    border: 0;
}

.home-first
{
    background: url(../img/home-section-1.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
section.home-first
{
    padding-top: 100px;
    padding-bottom: 100px;
}

section.home-first div.card
{
    border: 0;
}

section.home-first .type div.card .card-img-overlay
{
    display: flex;
    place-items: center;
    justify-content: center;
    width: 100%;
}

section.home-first .type div.card
{
    margin-top: 20px;
}
section.home-first .type div.card .card-img-overlay h3
{
    font-weight: 600;
    font-size: 20px;
    line-height: 39px;
    color: #FFFFFF;
    text-shadow: 0px 4px 10px #000000;
}

.featured-auction
{
    margin-top: 100px;
}
.featured-auction .col-12 div.card
{
    border: 1px solid #dedede;
    padding: 12px;
    margin-bottom: 15px;
}

    .featured-auction .col-12 div.card>a.d-block img
    {
        height:15rem;
        object-fit:cover;
        object-position:center;
    }

    .featured-auction .col-12 div.card div.card-body {
        padding: 7px;
    }

.featured-auction .col-12 div.card div.card-body p
{
    color: #000;
    font-weight: 500;
    font-size: 13px;
    line-height: 19px;
}

.featured-auction .col-12 div.card div.card-body h3
{
    color: #000;
    font-size: 17px;
    font-weight: 600;
}

.featured-auction .col-12 div.card div.card-body span
{
    display: block;
    font-size: 12px;
    line-height: 23px;
    color: #000;
}

.featured-auction .col-12 div.card div.card-body .inventory-btn-div
{
    margin-top: 20px;
    border-top: 0.8px solid #C5BCBC;
    padding-top: 20px;
}



.upcoming-auction {
    background-image: url(/Content/images/background/upcoming-auction.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 2rem 0;
    margin-top: 0px;
}

div.benifits
{
    margin-top: 90px;
}

div.benifits .main-benifits
{
    background-color: rgb(0, 0, 0,0.6);
    width: 80%;
    border-radius: 10px;
    margin: 0px auto 0px auto;
    padding: 70px 20px;
}

div.benifits .item-benifits
{
    text-align: center;
    height: 100%;
}

div.benifits .item-benifits img
{
    width: 80px;
}

div.benifits .item-benifits h5
{
    color: white;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    margin-top: 20px;
    margin-bottom: 20px;
}

div.benifits div.col-12.btn-div
{
    text-align: center;
    margin-top: 40px;

}

div.benifits div.col-12.btn-div img
{
    width: 170px;
}
/* equipment start here */

.looking-equipment .row div.col-12
{
    margin-top: 20px;
}

.looking-equipment .row div.col-12 .card 
{
    border: 0;
}
.looking-equipment .row div.col-12 .card  img
{
    width: 100%;
}


.looking-equipment .row div.col-12 .card  .card-img-overlay
{
    width: 100%;
    height: 100%;
    padding:20px;
}

.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp
{
    border: 2px solid rgba(255, 255, 255, 0.564);
    height: 100%;
    border-radius: 5px;
}

.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp .text-icon-1
{
    padding: 20px;
}
.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp .text-icon-1 img
{   
   margin-top: 15px;
    width: 90px;
}

.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp .text-icon-1 h5
{
    color: white;
    font-weight: 600;
    font-size: 20px;
    text-transform: capitalize;
}

.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp.border-card-eup-sell img
{
    width: 80px;
    margin-bottom: 20px;
    position: absolute;
    bottom: 50px;
    right: 0px;
}

.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp.border-card-eup-sell h5
{
    color: white;
    font-weight: 600;
    font-size: 20px;
    text-align: end;
    text-transform: capitalize;
}

.looking-equipment .row div.col-12 .card  .card-img-overlay .border-card-eqp.border-card-eup-sell .text-icon-2
{
    position: absolute;
    bottom:30px;
    right: 40px;
}
/* equipment ends here */

/* bid online start here */

.home-2-second
{
    background: url("../img/section-second-home.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 100px;
}

.how-does-it-work
{
    padding-top: 80px;
}
.how-does
{
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.25);
    border-radius: 5px;
    padding: 17px;
    margin: 0 auto;
    margin-bottom: 70px;
    background-color: white;
    width: 750px;
    max-width:100%;
    
}
.bid_online_main 
{
    background: url(../img/bid_onine.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 50px;
    padding-bottom: 50px;
    padding-left: 25px;
    border-radius: 5px;
}

.bid_online_main h4
{
    font-size: 27px;
    color: #000;
    border-left: 4px solid var(--brand-color-theme-1);
    padding-left: 10px;
    font-weight: bold;
}

.bid_online_main ul
{
    list-style: none;
    line-height: 40px;
    color: #000;
    font-weight: 500;
    font-size: 20px;
    margin-left: 0;
    padding-left: 0;
}
.bid_online_main .button-my
{
    padding-left: 0px;
    padding-top: 40px;
}
.bid_online_main .button-my img
{
    width: 200px;
    
}

/* bid online ends here */


/* flexible financing start here */

.flexible-financing
{
    background: url(../img/flexible_financing.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-top: 10px;
    text-align: end;
    padding-right: 25px;
    border-radius: 5px;
}


.flexible-financing h4
{
    font-size: 27px;
    color: #000;
    border-right: 4px solid var(--brand-color-theme-1);
    padding-right: 10px;
    font-weight: bold;
}


.flexible-financing ul
{
    line-height: 40px;
    color: #000;
    font-weight: 500;
    font-size: 20px;
}

.flexible-financing ul li
{
    list-style-type: none;
}
.flexible-financing .button-my img
{
    width: 200px;
}

.flexible-financing .button-my
{
    padding-right: 0;
    padding-top: 40px;
}

.f-footer
{
    background-color: var(--brand-color-theme-1);
    background: url("../img/footer-bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 200px;
}

.f-footer .row
{
    padding-top: 70px;
    padding-bottom: 10px;
}
.f-footer .row div.col-12
{
    margin-bottom: 20px;
}
.f-footer .row div.col-12 h5
{
    color: white;
    font-weight: 600;
}

.f-footer .row div.col-12 ul li
{
    color: white;
    font-size: 13px;
    line-height: 30px;
    list-style: none;
}

.f-footer .row div.col-12 ul
{
    margin: 0;
    padding: 0;
}

.f-footer .row div.col-12 ul li a
{
    color: white;
}

.f-footer .row div.col-input-button-footer .input-group
{
    width: 230px;
}

.f-footer .row div.col-input-button-footer .input-group input
{
    height: 40px;
    border-radius: 5px;
    font-size: 13px;
    border: 1px solid #dddddd;
    box-shadow: none;
}

.f-footer .row div.col-input-button-footer .input-group .input-group-text
{
    background-color: #000;
    border: 1px solid #000;
    color: white;
    font-size: 13px;
}
.f-footer .row div.col-input-button-footer p
{
    font-size: 13px;
    color: white;
    margin-top: 10px;
}

.f-footer .row div.col-social ul
{
    display: flex;
    justify-content: end;
    padding-right: 28%;
    width: 100%;
}

.f-footer .row div.col-social ul li
{
    margin-right: 15px;
}

.f-footer .row div.col-social ul li a
{
    font-size: 20px;
}
.f-footer .copyright-text
{
    text-align: center;
    color: white;
    background-color: #000;
    padding: 15px 10px;
    font-size: 13px;
}

.f-footer .col-links-footer
{
    padding-left: 60px;
}
/* flexible financing ends here */


/* sell page start here */

.section-sell-page
{   
    
    border-radius: 0;
}
.section-sell-page img
{
    width: 100%;
    height: 700px;
    object-fit: cover;
}
.sell_container 
{
    display: flex;
    justify-content: center;
    place-items: center;
}
.sell_container .row div.form-col
{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    place-items: center;
    height: 650px;
}
.sell_container .row div.sell-text-col
{
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    place-items: center;
    height: 650px;
}
.sell_container .row div.form-col .title
{
    padding-left: 15.5%;
}
.sell_container .row div.form-col form
{
    width: 70%;
    background-color: rgb(154, 153, 154,70%);
    padding: 20px;
    border-radius: 5px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.sell_container .row div.form-col form label
{
    font-size: 13px;
    color: #000;
    font-weight: 400;
}

.sell_container .row div.form-col form input,.sell_container .row div.form-col form select
{
    box-shadow: none;
    border-radius: 5px;
    font-size: 13px;
    padding: 10px;
    border: 1px solid white;
}

.sell_container .row div.form-col form .first-name-div,
.sell_container .row div.form-col form .last-name-div,
.sell_container .row div.form-col form .phone-div,
.sell_container .row div.form-col form .company-div
{
    width: 48%;
}


.sell_container .row div.sell-text-col h5
{
    font-weight: 500;
    line-height: 35px;
}

.sell_container .row div.sell-text-col a.sell_learn_more
{
    color: white;
    font-size: 13px;
    padding: 10px 30px;
    border-radius: 6px;
    border: 1px solid white;
    display: inline-block;
    margin-top: 30px;
}

.benifits-of-sel-sec
{
    background: url('../img/bg-benifits.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.benifits-of-sel-sec .benfits-para-sel
{
    width: 80%;
    text-align: center;
    margin: 0 auto;
    font-size: 15px;
    font-weight: 500;
    line-height: 30px;
    
}

.benifits-of-sel-sec .row-benifits-sel
{
    margin-top: 50px;
    justify-content: center;
}

.benifits-of-sel-sec .row-benifits-sel div.col-12
{
    text-align: center;
}

.benifits-of-sel-sec .row-benifits-sel div.col-12 img
{
    width: 80px;
    margin-bottom: 20px;
}

.benifits-of-sel-sec .row-benifits-sel div.col-12 p
{
    font-size: 13px;
    font-weight: 500;
}
/* sell page ends here */

/* contact page start here */

.contact-page-sec
{
    background: url('../img/contac-pagebg.png');
    background-position: top;
    background-repeat: no-repeat;
    background-size: 100%;
}
.contact-page-sec .row-contact-page
{
    padding: 10% 40px 0px 40px;
}
.contact-page-sec .contact-details
{
    background: url('../img/contac-details-bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 450px;
    margin-top: 15px;
    border-radius: 6px;
}

.contact-page-sec .contact-details .address
{
    padding: 10% 15%;
    height: 225px;
}
.contact-page-sec .contact-details .address ul
{
    margin: 0;
    padding: 0;
}

.contact-page-sec .contact-details .address ul li
{
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: 20px;
    margin-top: 20px;
    display: flex;
    place-items: center;
    color: white;
    font-weight: 300;
    font-size: 14px;
}

.contact-page-sec .contact-details .address ul li img
{
    width: 20px;
    margin-right: 10px;
    
}

.contact-page-sec .contact-details .opening-hours
{
    height: 225px;
    padding: 15%;
}

.contact-page-sec .contact-details .opening-hours h6
{
    color: white;
    text-transform: uppercase;
}

.contact-page-sec .contact-details .opening-hours p
{
    color: white;
    font-size: 14px;
}

.contact-page-sec .contact-text
{
    padding-left: 10px;
}
.contact-page-sec .contact-text .title
{
    border-left: 4px solid var(--brand-color-theme-1);
    padding-left: 5px;
    color: white;
    margin-bottom: 15px;
}

.contact-page-sec .contact-text span
{
    color: white;
    font-size: 14px;
}


.contact-page-sec .col-contact-form
{
    padding: 300px 15px 0px 15px;
}

.contact-page-sec .col-contact-form form
{
    padding: 10px;
}

.contact-page-sec .col-contact-form form input,.contact-page-sec .col-contact-form form textarea{
    border: 1px solid #aaaaaa;
    border-radius: 5px;
    color: #000;
    box-shadow: none;
    font-size: 13px;
    padding: 10px;
}


/* contact page ends here */

/* page title start here */

.page-title-2nd 
{
    background-color: #000;
    padding-top: 20px;
    padding-bottom: 20px;
}

.page-title-2nd div.row{
    padding: 10px;
}

.page-title-2nd div.row div.col-12
{
    display: flex;
    place-items: center;
}

.page-title-2nd div.row div.col-12:nth-child(2)
{
    justify-content: end;
}
.page-title-2nd div.row div.col-12 h3{
    font-size: 27px;
    font-weight: 600;
    letter-spacing: 1px;
    color: white;
}

.page-title-2nd div.row div.col-12 span
{
    color: white;
}

.page-title-2nd div.row div.col-12 a
{
    color: white;
}
.bid-details-row
{
    background-color: #ededed;
    border-radius: 5px;
    padding: 10px;
}
.bid-details-row .col-bid
{
    margin-top: 10px;
}
.bid-details-row .col-bid-details
{
    margin-top: 10px;
}   
.bid-details-row .col-bid span
{
    font-size: 15px;
    font-weight: 600;
    color: var(--brand-color-theme-1);
}

.bid-details-row .col-bid-details span
{
    color: #666;
    font-size: 13px;
}
.time-left
{
    margin-top: 20px;
    margin-bottom: 20px;
    justify-content: center;
}
.time-left div.col-6
{   
    padding: 10px;
    display: flex;
    justify-content: center;
    place-items: center;
    margin-top: 10px;
}

.time-left div.col-6 div
{
    text-align: center;
}

.bid-details-row .col-bid-details span.span-stock
{
    color: #000;
    font-weight: 600;
}

.ftable-bid
{
    width: 100%;
}

.ftable-bid table
{
    width: 100%;
    text-align: center;
}

.ftable-bid table thead th
{
    background-color: var(--brand-color-theme-1);
    border: 1px solid #000;
    color: white;
    padding: 10px;
}

.ftable-bid table tr:nth-child(odd)
{
    background-color: #ededed;
}

.ftable-bid table tr td
{
    border: 1px solid #000;
    padding: 10px;
    font-size: 14px;
}
/* page title ends here */


/* inventory page start here */

.view-inventory-row .card
{
    padding: 10px;
}

.view-inventory-row .card img
{
    width: 100%;
    height: 400px;
    object-fit: cover;
}

.view-inventory-row .card img.play-btn
{
    width: 120px;
    height: auto;
    position: absolute;
    right: 20px;
    bottom: 20px;
}
.item-caousel-services
{
    margin-top: 20px;
}
.item-caousel-services .item
{
    padding: 5px;
    border: 1px solid #dddddd;
}

.item-caousel-services .owl-nav button
{
    background-color: var(--brand-color-theme-1)!important;
    color: white!important;
    font-size: 13px!important;
    width: 25px;
    height: 25px;
    border-radius: 200px!important;
    position: absolute;
    top: 35%;
    transform: translate(-50%,0);
}

.item-caousel-services .owl-nav .owl-next
{
    right: -30px;
}

.item-caousel-services .owl-nav .owl-prev
{
    left: -5px;
}


.after-carousel-col h3
{
    font-size: 27px;
    font-weight: 600;
    letter-spacing: 1px; 
}

.after-carousel-col div.date-time
{
    margin-top: 10px;
    margin-bottom: 10px;
    color: #666;
}

.after-carousel-col div.date-time span
{
    font-size: 22px;
    font-weight: 600;
}

.after-carousel-col h5.price
{
    font-size: 18px;
    font-weight: 600;
    color: var(--brand-color-theme-1);
    margin-bottom: 20px;
    margin-top: 30px;
}

.after-carousel-col h5.price span
{
    color: #666;
    font-weight: 400;
    font-size: 15px;
}
.after-carousel-col .bid_amount
{
    display: flex;
    place-items: center;
}
.after-carousel-col .bid_amount input
{
    width: 150px;
    font-size: 13px;
    padding: 10px;
    border: 1px solid #dddddd;
    border-radius: 6px;
    box-shadow: none;
    margin-right: 10px;
    font-size: 13px;
}

.after-carousel-col .bid_amount span
{
    font-size: 14px;
    color: #666;
}

.after-carousel-col .bid_amount span i
{
    color: var(--brand-color-theme-1);
    margin-right: 5px;
}


.after-carousel-col .service-item-buttons .service-btn
{
    display: block;
    margin-top: 20px;
    width: 250px;
    border: 0;
    outline: none;
    padding: 15px 10px;
    text-transform: capitalize;
    border-radius: 6px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: transparent;
    border: 1px solid white;
    color: white;
}

.after-carousel-col .service-item-buttons .service-btn.place-bid-btn, .after-carousel-col .service-item-buttons .service-btn.add-wishlist-btn
{
    background-color: var(--brand-color-theme-1);
    border: 1px solid var(--brand-color-theme-1);
}

.after-carousel-col .service-item-buttons .service-btn.contact-seller-btn, .after-carousel-col .service-item-buttons .service-btn.bid-history-btn
{
    background-color: #000;
    border: 1px solid #000;
}  

.about-item-shiping
{
    justify-content: center;
    margin-top: 30px;
}
.about-item-shiping li
{
    padding: 10px;
}
.about-item-shiping li button
{
    border-bottom: 3px solid white!important;
    border-radius: 0!important;
    color: #000!important;
    font-weight: 600;
}

.about-item-shiping li button.active
{
    border-color: var(--brand-color-theme-1)!important;
    background-color: transparent!important;
    color: var(--brand-color-theme-1)!important;
}

.about-item-shiping-tab-content .row .col-12
{
    display: flex;
    justify-content: center;
    place-items: center;
}

.about-item-shiping-tab-content .row .col-12 img
{
    width: 35px;
    margin-right: 10px;
}

.about-item-shiping-tab-content .row .col-12 .about-item-text
{
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    display: flex;
    place-items: center;
    justify-content: start;
    width: 100%;
    padding: 20px;
    border-radius: 6px;
    margin-bottom: 10px;
}

.about-item-shiping-tab-content .row .col-12 .about-item-text span
{
    font-size: 15px;
    font-weight: 600;
    color: var(--brand-color-theme-1);
    
}

.second-title-service
{
    font-weight: 700;
    color: var(--brand-color-theme-1);
}
/* inventory ends here */

/* all listing page start here */

.all-listing-row .listing-form
{
    background-color: #dddddd;
    padding: 20px;
    border-radius: 6px;
}

.all-listing-row .listing-form input
{
    width: 100%;
    height: 45px;
    border-radius: 5px;
    border: 1px solid #dddddd;
    padding: 10px;
    font-size: 14px;
    margin-bottom: 20px;
    box-shadow: none;
}

.all-listing-row .listing-form .dropdown
{
    width: 100%;
}

.all-listing-row .listing-form .dropdown button
{
    width: 100%;
    margin-bottom: 20px;
    background-color: white;
    color: #666;
    text-align: start;
    height: 45px;
    border: 1px solid #dddddd;
    font-size: 14px;
}

.all-listing-row .listing-form .dropdown-menu
{
    width: 100%;
    padding: 0;
    border-radius: 0;
}
.all-listing-row .listing-form .dropdown-toggle::after
{
    position: absolute;
    right: 10px;
    top: 20px;
}

.all-listing-row .listing-form .dropdown-menu .dropdown-item
{
    font-size: 14px;
    color: #666;
    background-color: white;
    padding: 10px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}
.all-listing-row .listing-form .dropdown-menu.year-drop
{
    height: 250px!important;
    overflow-y: scroll;
}

.col-filters-sort-by div.dropdown
{
    text-align: end;
    width: 100%;
    font-size: 14px;
    color: var(--brand-color-theme-1);
    font-weight: 600;
}

.col-filters-sort-by div.dropdown button
{
    width: 200px;
    text-align: start;
    font-size: 14px;
    background-color: white!important;
    color: #666!important;
    height: 45px;
    border: 1px solid #dddddd!important;
    border-radius: 5px;
}

.col-filters-sort-by div.dropdown ul
{
    padding: 0;
    border-radius: 0;
    font-size: 14px;
    width: 200px;
}

.col-filters-sort-by div.dropdown ul li .dropdown-item
{
    background-color: white;
    color: #666;
    padding: 10px;
}

.col-filters-sort-by .dropdown-toggle::after
{
    position: absolute;
    right: 10px;
    top: 20px;
}

.mbp_pagination .new_line_pagination button
{
    border: 0;
    outline: none;
    border-radius: 500px;
    width: 40px;
    height: 40px;
    background-color: var(--brand-color-theme-1);
    color: white;
    font-weight: 600;
    font-size: 15px;
    margin-left: 10px;
    margin-right: 10px;
}

.mbp_pagination .new_line_pagination label
{
    color: #000;
    font-size: 15px;
    font-weight: 600;
}
.tab-and-mobile-filter button.navbar-toggler
{
    box-shadow: none;
    color: var(--brand-color-theme-1);
    font-weight: 600;
    border: 1px solid var(--brand-color-theme-1);
}

.tab-and-mobile-filter button.navbar-toggler span
{
    margin-left: 10px;
}


.tab-and-mobile-filter .offcanvas-header button
{
    color: #000;
    background-color: white;
    border: 0;
    outline: none;
    font-size: 25px;
    position: absolute;
    left: 5px;
}
/* all listing page ends here */

/* calender code start here */
.calender
{
    padding: 3px;
}
.table-calender
{
    background-color: white;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.table-calender label{
    background-color: #000;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    padding: 10px;
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.table-calender label select{
    background-color: transparent;
    border: none;
    color: white;
    outline: none;
    text-align: center;
}

.table-calender label select option
{
    color: var(--brand-color-theme-1);
    font-size: 13px;
    height: 150px;
}

.table-calender table
{
    width: 100%;
}

.table-calender table tr th
{
    text-align: center;
    background-color: var(--brand-color-theme-1);
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 13px;
    color: white;
}
.table-calender table tr td
{
    padding: 5px;
    text-align: center;
    font-size: 13px;
    font-weight: 500;
}

.table-calender table tr td:last-child
{
    color: var(--brand-color-theme-1);
}

.table-calender table tr td.selected-date span
{
    background-color: var(--brand-color-theme-1);
    border: 1px solid var(--brand-color-theme-1);
    color: white;
}
.table-calender table tr td span
{   
    display: block;
    height: 100%;
    width: 100%;
    padding-top: 5px;
    border: 1px solid white;
    padding-bottom: 5px;
    border-radius: 50%;
}
.table-calender table tr td:hover span
{   
    cursor: pointer;
    border: 1px solid var(--brand-color-theme-1);
}

/* calender code ends here */

/* modal popup sign in sign up start here */

.modal
{
    z-index: 99999;
}
.signin-modal .close-popup,.signup-modal .close-popup
{
    position: absolute;
    right: 10px;
    top: 10px;
    background-color: transparent;
    border: 0;
    outline: none;
    color: #000;
    font-size: 20px;
}

.signin-modal .modal-content,.signup-modal .modal-content
{
    border-radius: 0;
    background-color: transparent;
    border: 0;
    padding: 40px 60px 40px 60px;
}

.signin-modal .modal-content .modal-body,.signup-modal .modal-content .modal-body
{
    background-color: white;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border-radius: 10px;
    padding: 0;
}
.signin-modal .row
{
    padding: 0;
}
.signin-modal .image-signup-in
{
    width: 40%;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    background: url('../img/signin-image.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: center;
    place-items: center;
}

.signin-modal .image-signup-in h3
{
    color: white;
    font-size: 20px;
}

.signin-modal .image-signup-in span.under-line
{
    display: block;
    width: 100px;
    height: 4px;
    border-radius: 5px;
    background-color: #ffffff51;
    margin-bottom: 10px;
}

.signin-modal .image-signup-in p
{
    font-size: 12px;
    color: white;
    font-weight: normal;
}

.signin-modal .details-signup-in
{
    width: 58.3%;
    padding: 0;
}

.signin-modal .details-signup-in h4
{
    font-size: 17px;
    font-weight: normal;
    text-align: center;
    color: var(--brand-color-theme-1);
    margin-top: 50px;
}
.signin-modal .details-signup-in div.f-signin-form 
{
    padding: 55px 40px 15px 40px;
}

.signin-modal .details-signup-in div.f-signin-form input
{
    border: 1px solid #525252;
    border-radius: 6px;
    box-shadow: none;
    font-size: 13px;
    padding: 10px 8px;
    margin-top: 15px;
}

.signin-modal .details-signup-in div.f-signin-form a.forgot-pass
{
    display: block;
    text-align: right;
    font-size: 12px;
    margin-top: 10px;
    color: var(--brand-color-theme-1);
    font-weight: 500;
}

.signin-modal .details-signup-in div.f-signin-form div.btn-form
{
    text-align: center;
    margin-top: 30px;
}

.signin-modal .details-signup-in div.f-signin-form div.btn-form button
{
    width: 200px;
}

.signin-modal .details-signup-in div.f-signin-form .signup-account
{
    text-align: center;
    font-size: 12px;
    margin-top: 30px;
    font-weight: 500;
}

.signin-modal .details-signup-in div.f-signin-form .signup-account span
{
    color: var(--brand-color-theme-1);
    cursor: pointer;
    text-decoration: underline;
}

.signin-modal .details-signup-in div.f-signin-form .eye
{
    position: absolute;
    right: 8%;
    bottom: 43.3%;
}

#hide-pass-sign
{
    display: none;
    cursor: pointer;
}

#show-pass-sign
{
    cursor: pointer;
}
/* ------- */


.signup-modal .modal-body .signup-image
{
    width: 50%;
    height: 450px;
    background: url('../img/signup-bg-image.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    display: flex;
    justify-content: center;
    place-items: center;
}
.signup-modal .modal-body .signup-image div
{
    text-align: center;
}
.signup-modal .modal-body .signup-image h4
{
    font-size: 20px;
    text-align: center;
    color: white;
    margin-bottom: 40px;
}

.signup-modal .modal-body .signup-image img
{
    width: 80%;
}

.signup-modal .modal-body .signup-form-sec
{
    width: 48.5%;
    height: 450px;
    padding: 0;
}

.signup-modal .modal-body .signup-form-sec h3
{
    font-size: 17px;
    font-weight: normal;
    text-align: center;
    color: var(--brand-color-theme-1);
    margin-top: 30px;
}

.signup-modal.modal-enquiry .modal-body .signup-form-sec h3 {
    margin-top:15px;
}

    .signup-modal .modal-body .signup-form-sec .fform-signup {
        display: flex;
        justify-content: center;
        padding: 50px 20px 35px 20px;
        place-items: center;
    }

.signup-modal.modal-enquiry .modal-body .signup-form-sec .fform-signup {
    padding-top:0;
}

    .signup-modal .modal-body .signup-form-sec .fform-signup form {
        width: 100%;
    }
.signup-modal .modal-body .signup-form-sec .fform-signup form input,
.signup-modal .modal-body .signup-form-sec .fform-signup form select{
    border: 1px solid #525252;
    border-radius: 6px;
    box-shadow: none;
    font-size: 13px;
    padding: 10px 8px;
    margin-top: 15px;
}

.signup-modal.modal-enquiry .modal-body .signup-form-sec .fform-signup form select {
    padding:5px 8px;
    margin-top:0;
    margin-bottom:5px;
}

.signup-modal.modal-enquiry .modal-body .signup-form-sec .fform-signup form label{

}


.signup-modal .modal-body .signup-form-sec .fform-signup form .btn-form {
    text-align: center;
}
.signup-modal .modal-body .signup-form-sec .fform-signup form .fButton
{
    width: 80%;
    margin-top: 30px;
}

.signup-modal.modal-enquiry .modal-body .signup-form-sec .fform-signup form .fButton {
    margin-top:7px;
}

    .signup-modal .modal-body .signup-form-sec .fform-signup form .signup-account {
        text-align: center;
        font-size: 12px;
        margin-top: 120px;
        font-weight: 500;
    }

.signup-modal .modal-body .signup-form-sec .fform-signup form .signup-account span
{
    color: var(--brand-color-theme-1);
    text-decoration: underline;
    cursor: pointer;
}

.forgot-pass-para
{
    text-align: center;
    padding: 0px 10px;
    font-size: 11px;
}

.forgot-back
{
    margin-top: 30px!important;
}

.eye-new-pass
{
    position: absolute;
    right: 5%;
    top: 36.5%;
}

.eye-create-new-pass
{
    position: absolute;
    right: 5%;
    top: 44%;
}
.eye-conf-pass
{
    position: absolute;
    right: 5%;
    bottom: 47.5%;
}

.eye-conf-create-pass
{
    position: absolute;
    right: 5%;
    bottom: 40%;
}
.eye-conf-pass #hide-pass-conf,#hide-pass-new-create
{
    display: none;
}
.eye-new-pass #hide-pass-new,#hide-pass-conf-create
{
    display: none;
}

.verification-sec .f-form-verification
{
    padding: 0px 35px 20px 35px!important;
}

.message-popup
{
    display: block;
    text-align: start;
    padding: 5px 5px 5px 33px;
    width: 99.5%;
    margin-top: -12px;
    font-size: 11px;
    color: #000;
    background-color: #f6e7e6;
}

.signup-modal .modal-body .signup-form-sec .fform-signup.address-form
{
    padding: 0px 15px 10px 15px;
}
.signup-modal .modal-body .signup-form-sec .fform-signup.address-form form
{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.signup-modal .modal-body .signup-form-sec .fform-signup.address-form .address-label
{
    display: block;
    width: 100%;
    color: #000;
    font-weight: 500;
    font-size: 12px;
    margin-top: 17px;
}

.signup-modal .modal-body .signup-form-sec .fform-signup.address-form input
{
    margin-top: 5px;
    padding: 7px 10px;
    border-radius: 4px;
}

.signup-modal .modal-body .signup-form-sec .fform-signup.address-form input.first-name,.signup-modal .modal-body .signup-form-sec .fform-signup.address-form input.last-name,
.signup-modal .modal-body .signup-form-sec .fform-signup.address-form input.country,.signup-modal .modal-body .signup-form-sec .fform-signup.address-form input.postal-code
{
    width: 49%;
}
/* modal popup sign in sign up ends here */


/* contact seller popup start here */

.contact-seller .btn-close
{
    box-shadow: none;
    font-size: 15px;
}
.contact-seller .modal-body input,.contact-seller .modal-body textarea
{
    border: 1px solid #525252;
    border-radius: 6px;
    box-shadow: none;
    font-size: 13px;
    padding: 10px 8px;
    margin-top: 15px;
}

/* contact seller popup ends here */


.sell_container .row div.form-col .title
{
    margin-bottom: 20px;
}

/* new view inventory */

.view-inventory.new_view_inventory {
    padding-top: 20px;
}

    .view-inventory.new_view_inventory .container {
        background-color: #F8F8F8;
        padding: 22px;
        border-radius: 8px;
        border: 1px solid #e9e9e9;
    }

    .view-inventory.new_view_inventory .view-inventory-row .card {
        padding: 0;
        border-radius: 8px;
    }

        .view-inventory.new_view_inventory .view-inventory-row .card img.card-img {
            height: 450px;
            border-radius: 8px;
        }

    .view-inventory.new_view_inventory .after-carousel-col {
        padding-left: 20px;
    }

        .view-inventory.new_view_inventory .after-carousel-col .bookmark {
            width: 100%;
            text-align: end;
        }

            .view-inventory.new_view_inventory .after-carousel-col .bookmark a {
                font-size: 24px;
                position: relative;
                top: 28px;
                color: black;
            }

        .view-inventory.new_view_inventory .after-carousel-col .new-title {
            font-size: 25px;
            font-weight: 700;
            width: 350px;
            color: #000;
        }

        .view-inventory.new_view_inventory .after-carousel-col .new-sub-title {
            font-weight: 500;
            color: var(--brand-color-theme-1);
            font-size: 17px;
        }

        .view-inventory.new_view_inventory .after-carousel-col p.description-new {
            padding-right: 35px;
            font-size: 14px;
            margin-top: 20px;
            line-height: 23px;
        }

        .view-inventory.new_view_inventory .after-carousel-col .current-bid {
            color: var(--brand-color-theme-1);
            font-size: 19px;
            font-weight: 600;
            letter-spacing: .5px;
            margin-top: 40px;
        }

            .view-inventory.new_view_inventory .after-carousel-col .current-bid span {
                color: #666;
                font-weight: normal;
                font-size: 13px;
            }

        .view-inventory.new_view_inventory .after-carousel-col .bid-section {
            width: 380px;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            margin-top: 35px;
        }

            .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-input {
                width: 47%;
                height: 40px;
            }

                .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-input input {
                    height: 100%;
                    width: 100%;
                    border-radius: 3px;
                    border: 1px solid #666;
                    padding: 10px;
                    font-size: 14px;
                    outline: none;
                }

            .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-button {
                width: 47%;
                height: 40px;
            }

            .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-label {
                width: 100%;
            }

                .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-label label {
                    font-size: 11px;
                    margin-top: 5px;
                }

                    .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-label label span {
                        font-weight: 600;
                    }

            .view-inventory.new_view_inventory .after-carousel-col .bid-section .bid-button a.fButton {
                width: 100%;
                height: 100%;
            }

        .view-inventory.new_view_inventory .after-carousel-col .contact-seller {
            margin-top: 20px;
            width: 100%;
            height: 45px;
        }

            .view-inventory.new_view_inventory .after-carousel-col .contact-seller a.fButton {
                height: 100%;
                padding-top: 12px;
            }

.new_view_inventory .about-item-shiping {
    margin-top: 0;
    justify-content: start;
    background-color: #ffecec;
    padding: 30px 0px 0px 0px;
}

.new_view_inventory .nav-pills .nav-link {
    font-weight: 400 !important;
}

    .new_view_inventory .nav-pills .nav-link.active {
        font-weight: 600 !important;
    }

.new_view_inventory .about-item-shiping li {
    padding: 0;
}

    .new_view_inventory .about-item-shiping li button {
        width: 190px;
    }

    .new_view_inventory .about-item-shiping li:nth-child(2) button {
        width: 120px;
    }

.about-item-shiping li button {
    border-bottom: 3px solid #ffecec !important;
}

.new_view_inventory .about-item-shiping-tab-content {
    padding: 30px 20px;
}

    .new_view_inventory .about-item-shiping-tab-content table {
        width: 95%;
        font-size: 13px;
        margin: 0 auto;
    }

        .new_view_inventory .about-item-shiping-tab-content table tr {
            border-bottom: 1px solid #C1C1C1;
        }

            .new_view_inventory .about-item-shiping-tab-content table tr td {
                padding: 15px;
            }

                .new_view_inventory .about-item-shiping-tab-content table tr td:nth-child(1) {
                    width: 200px;
                    font-weight: 500;
                }

                .new_view_inventory .about-item-shiping-tab-content table tr td:nth-child(2) {
                    font-weight: 600;
                    font-size: 15.5px;
                }

.new-inv-row .side-col {
    padding: 3rem 12px 3rem 12px;
    position: relative;
}

    .new-inv-row .side-col .side-bar {
        position: sticky;
        top: 1rem;
        padding: 0 10px;
    }

.card-ta {
    padding: 0;
}

    .card-ta .item {
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        border-radius: 10px;
        overflow: hidden;
    }

        .card-ta .item .img-tag {
            position: relative;
        }

            .card-ta .item .img-tag img{
                height:13rem;
                object-fit:cover;
            }

            .wish-list {
                position: absolute;
                right: 1rem;
                top: 1rem;
                width: 3rem;
                height: 3rem;
                text-align: center;
                align-content: center;
                background-color: #ffffff59;
                display: inline-block;
                font-size: 2rem;
                color: #000 !important;
            }

    .wish-list.solid {
        color: red !important;
    }

.card-ta .item > .text-tag {
    padding: 1.2rem 1rem;
    position: relative;
}

    .card-ta .item > .text-tag .label-card {
        position: absolute;
        border: 2px solid white;
        background-color: #dedede;
        padding: .4rem 1rem;
        font-size: 1rem;
        font-weight: 500;
        border-radius: 50px;
        right: 1rem;
        top: -1.2rem;
    }

    .card-ta .item > .text-tag h4 {
        font-size: 1.4rem;
        font-weight: 600;
    }

    .card-ta .item > .text-tag label.price {
        font-size: 1.1rem;
    }

        .card-ta .item > .text-tag label.price span {
            position: relative;
            color: #666;
            font-size: .85rem;
        }

            .card-ta .item > .text-tag label.price span::after {
                content: ") ";
            }

            .card-ta .item > .text-tag label.price span::before {
                content: " (";
            }

    .card-ta .item > .text-tag hr {
        margin-top: .7rem;
        margin-bottom: .7rem;
    }


/* new view inventory */
/* start - Add account for invoice and credit card popup */

.pre, .next, .submit {
    display: inline-block;
    margin-top: 15px;
    padding: 8px 30px;
    border: 1px solid;
    color: white;
    margin-right: 10px;
    cursor: pointer;
    border-radius: 5px;
}

.pre {
    background-color: var(--brand-color-theme-1);
    border-color: var(--brand-color-theme-1);
}

.next {
    background-color: #000;
    border-color: #000;
}

.submit {
    background-color: darkgreen;
    border-color: darkgreen;
}

.modal-new-pop button.btn-close {
    box-shadow: none;
    border-radius: 0;
    position: absolute;
    right: 20px;
    top: 20px;
}

.modal-new-pop p {
    color: #000;
}

.modal-new-pop {
    color: #000;
}

    .modal-new-pop .modal-body {
        padding-left: 0;
        padding-right: 0;
        text-align: start;
    }

        .modal-new-pop .modal-body p {
            text-align: start;
        }

    .modal-new-pop .modal-header {
        margin-bottom: 30px;
    }

        .modal-new-pop .modal-header a {
            color: #000;
            text-decoration: underline;
            font-weight: 600;
        }

    .modal-new-pop .modal-body .modal-title {
        text-align: start;
        margin-bottom: 40px;
    }

    .modal-new-pop .modal-header .modal-title {
        margin-bottom: 15px;
    }

    .modal-new-pop .modal-title {
        font-size: 1.2rem;
        font-weight: 600;
        color: #000;
    }


        .modal-new-pop .modal-title i {
            width: 30px;
            height: 30px;
            border: 2px solid #000;
            display: inline-flex;
            justify-content: center;
            place-items: center;
            border-radius: 50px;
            color: #000;
            margin-right: 10px;
        }

    .modal-new-pop .col-12 {
        margin-bottom: 10px;
    }

.floating-select-new > label {
    top: -16px;
    height: fit-content;
    padding-bottom: 0;
    width: fit-content;
    background-color: white !important;
    opacity: unset !important;
}

.floating-select-new > .form-select {
    padding: 10px 12px;
    font-size: .8rem !important;
}

.floating-select-new > .form-select,
.form-floating-new > .form-control {
    height: 50px;
    box-shadow: none;
    border: 1px solid #dedede;
}

    .floating-select-new > .form-select option {
        font-size: .8rem !important;
    }

.form-floating-new > .form-control {
    font-size: .8rem !important;
}

.form-floating-new > label {
    font-size: .8rem !important;
}

.modal-new-pop .form-check {
    text-align: start;
}
/* end - Add account for invoice and credit card popup */


/* user profile starts here */


.user-profile-form .col-form .profile-card {
    box-shadow: none !important;
    width: 120px;
    margin: 10px auto;
    text-align: center;
    border-radius: 500px;
    border: 4px solid var(--brand-color-theme-1);
}

    .user-profile-form .col-form .profile-card img {
        border-radius: 500px;
    }

    .user-profile-form .col-form .profile-card .card-img-overlay {
        width: 100%;
        padding: 0;
        border-radius: 500px;
        transition: all 0.5s ease;
        top: 0px;
    }

    .user-profile-form .col-form .profile-card:hover .card-img-overlay {
        background-color: #000000b8;
        cursor: pointer;
    }

    .user-profile-form .col-form .profile-card .card-img-overlay label {
        visibility: hidden;
        font-size: 30px;
        transition: all 0.5s ease;
        color: var(--brand-color-theme-3);
        display: inline-block;
        width: 100%;
        height: 100%;
    }

    .user-profile-form .col-form .profile-card:hover .card-img-overlay label {
        visibility: visible;
        padding-top: 40px;
        cursor: pointer;
    }

#profile-pic {
    display: none;
}
/* user profile ends here*/
/* road maps starts here */

.map-raods {
    position: relative;
}

    .map-raods .icons-div {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }

        .map-raods .icons-div img {
            border-radius: 50%;
            border: 1px solid #9d180f;
        }

        .map-raods .icons-div > div {
            position: absolute;
            width: fit-content;
        }

            .map-raods .icons-div > div label {
                color: #9d180f;
                font-weight: 600;
                font-size: .85rem;
            }

            .map-raods .icons-div > div.icon-1 {
                left: 6%;
                top: 33%;
                .text-and-img

{
    display: inline-flex;
    place-items: center;
    img

{
    width: 25%;
}

}

label {
    margin-left: 5%;
}

}

.map-raods .icons-div > div.icon-2 {
    left: 21%;
    top: 1%;
    .text-and-img

{
    display: block;
    img

{
    width: 37%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}

.map-raods .icons-div > div.icon-3 {
    left: 43%;
    top: 21%;
    text-align: center;
    .text-and-img

{
    display: block;
    img

{
    width: 39%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}

.map-raods .icons-div > div.icon-4 {
    right: 12%;
    top: 25%;
    text-align: center;
    .text-and-img

{
    display: block;
    img

{
    width: 40%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}

.map-raods .icons-div > div.icon-5 {
    right: -10%;
    top: 55%;
    .text-and-img

{
    display: inline-flex;
    place-items: center;
    img

{
    width: 21%;
}

}

label {
    margin-right: 5%;
}

}

.map-raods .icons-div > div.icon-6 {
    right: 10%;
    bottom: 7.5%;
    text-align: center;
    .text-and-img

{
    display: block;
    img

{
    width: 40%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}

.map-raods .icons-div > div.icon-7 {
    right: 28%;
    bottom: 19%;
    .text-and-img

{
    display: block;
    img

{
    width: 38%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}

.map-raods .icons-div > div.icon-8 {
    right: 54%;
    bottom: 7.5%;
    text-align: center;
    .text-and-img

{
    display: block;
    img

{
    width: 40%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}


.map-raods .icons-div > div.icon-9 {
    left: 7%;
    bottom: 7%;
    .text-and-img

{
    display: block;
    img

{
    width: 40%;
}

}

label {
    margin-bottom: 5%;
    display: block;
}

}




.new-page-title {
    background-image: url(/Content/images/about/about-page-title.avif);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 4rem;
    padding-bottom: 4rem;
    position: relative;
}

    .new-page-title::after {
        content: "";
        background-color: #0000008e;
        width: 700px;
        max-width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
    }

    .new-page-title > .container {
        position: relative;
        z-index: 2;
    }


        .new-page-title > .container h1 {
            color: white;
            font-weight: 700;
            letter-spacing: 1px;
            font-size: 3.5rem;
            text-transform: uppercase;
            width: fit-content;
            display: inline-block;
            position: relative;
            padding-bottom: 1rem;
            margin-bottom: 1rem;
        }

        .new-page-title > .container p {
            color: white;
        }

        .new-page-title > .container h1::after {
            content: "";
            width: 100px;
            height: 8px;
            background-color: var(--brand-color-theme-1);
            position: absolute;
            left: 0;
            bottom: 0;
        }

.about .image {
    height: 400px;
    object-fit: cover;
    border: 10px solid #dedede;
}

.about .col-12 {
    padding: 1rem 12px;
}

.about iframe.video {
    width: 100%;
    height: 334px;
}

.about .item h3 {
    font-size: 3rem;
    font-weight: 700;
}

/* truck-andtrailer-construction starts here */

.read-more-truck-construck .inr-main-item {
    padding: 10px;
    border-radius: 4px;
    width: 900px;
    max-width: 100%;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    margin: 1rem auto;
    position: relative;
    max-width: 100%;
}

    .read-more-truck-construck .inr-main-item img {
        height: 288px;
        object-fit: cover;
    }

    .read-more-truck-construck .inr-main-item .truck-and-trailers-text {
        position: absolute;
        left: 2rem;
        top: 2rem;
    }

    .read-more-truck-construck .inr-main-item .construction-equipment-text {
        position: absolute;
        right: 2rem;
        bottom: 2rem;
        text-align: end;
    }

    .read-more-truck-construck .inr-main-item .text-main h3 {
        font-size: 1.4rem;
        font-weight: 600;
        text-shadow: 1px 3px 2px rgba(0, 0, 0, 0.6);
        color: white;
        margin-bottom: 7px;
    }

    .read-more-truck-construck .inr-main-item .text-main a {
        position: relative;
        font-size: .7rem;
        text-transform: uppercase;
        font-weight: 600;
        background-color: #d8d9db;
        display: inline-block;
        color: var(--brand-color-theme-1);
        padding: .4rem .5rem .4rem 2.5rem;
        border-radius: 50px;
        position: relative;
        margin-top: .5rem;
    }

        .read-more-truck-construck .inr-main-item .text-main a::before {
            content: "\f101";
            font-family: "FontAwesome";
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 2.1rem;
            font-size: 1rem;
            display: flex;
            justify-content: center;
            place-items: center;
            background-color: var(--brand-color-theme-1);
            border-radius: 50px;
            height: 2.1rem;
            color: white;
        }

    .read-more-truck-construck .inr-main-item .text-main.construction-equipment-text a::before {
        background-color: #000;
    }


.bnr-btn-new {
    font-size: .9rem;
    text-transform: uppercase;
    font-weight: 600;
    background-color: #d8d9db;
    display: inline-block;
    color: var(--brand-color-theme-1) !important;
    padding: .6rem 1rem .6rem 4rem;
    border-radius: 50px;
    margin-top: .5rem;
    position: absolute;
    left: 3%;
    bottom: 20%;
}


    .bnr-btn-new.bnr-btn-new-1 {
        left: 18% !important;
    }

    .bnr-btn-new::before {
        content: "\f101";
        font-family: "FontAwesome";
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 3rem;
        font-size: 1rem;
        display: flex;
        justify-content: center;
        place-items: center;
        background-color: #000;
        border-radius: 50px;
        height: 3rem;
        color: white;
    }

/* truck-andtrailer-construction starts here */

/*live button css starts here*/

.span-live {
    position: absolute;
    border: 2px solid white;
    background-color: green;
    padding: .4rem 1rem;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 50px;
    left: 1rem;
    top: 1rem;
    color: white;
}


.span-live-blinking {
    animation: spanliveblinking 1s ease-in-out infinite;
    transition: all 1s linear;
}

@keyframes spanliveblinking {
    0% {
        opacity:1;
    }
     25% {
        opacity:.5;
    }

    50% {
       opacity:1;
    }

    100% {
        opacity:.5;
    }
}
/*live button css ends here*/
@media(max-width:1399.9px) {
    .how-does{
        /*width:93%;*/
    }
    .card-ta .item > .text-tag h4 {
        font-size: 1.2rem;
    }

    .card-ta .item > .text-tag label.price {
        font-size: 1rem;
    }

    .card-ta .item location {
        font-size: .9rem;
    }

    .card-ta .item .fButton {
        font-size: 13px !important;
    }
}
@media(max-width:1299.9px)
{
    .how-does{
        /*width:99%;*/
    }
    .card-ta .item > .text-tag h4{
        font-size:1.2rem;
    }
    .card-ta .item > .text-tag label.price {
        font-size: 1rem;
    }

    .card-ta .item location {
        font-size:.9rem;
    }
    .card-ta .item  .fButton {
        font-size: 13px !important;
    }
}

/* filter starts here */

.filter-section {
    position: relative;
}

    .filter-section .form-items {
        margin-bottom: 1rem;
    }

    .filter-section .nav-tabs#myTab {
        border-radius: 100px;
        overflow: hidden;
        margin-top: 1rem;
        background-color: #e0e0e0;
    }

        .filter-section .nav-tabs#myTab .nav-item {
            width: 50%;
            border-radius: 100px;
        }

            .filter-section .nav-tabs#myTab .nav-item button {
                width: 100%;
                border: 0;
                background-color: #e0e0e0;
                color: #757575;
                border-radius: 100px;
            }

                .filter-section .nav-tabs#myTab .nav-item button.active {
                    background-color: #333;
                    color: white;
                }

    .filter-section .navbar > .form-select {
        font-size: .9rem;
        width: 150px;
        box-shadow: none;
        border: 1px solid #dedede;
    }

    .filter-section .navbar .navbar-brand {
        font-size: 1rem;
    }

    .filter-section .f-new-filter .form-item {
        padding: .3rem;
    }

    .filter-section .f-new-filter {
        padding-top: 1rem;
    }

        .filter-section .f-new-filter select,
        .filter-section .f-new-filter input {
            box-shadow: none !important;
            border: 1px solid #dedede !important;
            font-size: .9rem;
            border-radius: 0;
        }

        .filter-section .f-new-filter .dropdown button {
            width: 100%;
            box-shadow: none;
            text-align: start;
            padding-top: 1rem;
            padding-bottom: 1rem;
            border: 0;
            border-top: 1px solid #dedede;
            font-size: 1.2rem;
            border-radius: 0;
            position: relative;
        }

            .filter-section .f-new-filter .dropdown button::after {
                position: absolute;
                right: 1rem;
                top: 50%;
                transform: translateY(-50%);
            }

        .filter-section .f-new-filter .dropdown ul.dropdown-menu {
            position: relative !important;
            top: 0 !important;
            inset: unset !important;
            transform: unset !important;
            border: 0;
        }

            .filter-section .f-new-filter .dropdown ul.dropdown-menu li {
                padding: 0 10px;
                *

{
    font-size: 1rem;
}

}

.filter-section .f-new-filter .dropdown .use input {
    width: 100%;
}

.filter-section .f-new-filter .dropdown .use {
    padding-top: 1.4rem;
}

    .filter-section .f-new-filter .dropdown .use span {
        position: absolute;
        left: 1rem;
        top: 0;
    }

    .filter-section .f-new-filter .dropdown .use output {
        position: absolute;
        right: 1rem;
        top: 0;
    }

.switches-container {
    margin-top: 2rem;
    width: 100%;
    position: relative;
    display: flex;
    padding: 0;
    position: relative;
    background: #dedede;
    line-height: 3rem;
    border-radius: 3rem;
    margin-left: auto;
    margin-right: auto;
}

    /* input (radio) for toggling. hidden - use labels for clicking on */
    .switches-container input {
        visibility: hidden;
        position: absolute;
        top: 0;
    }

    /* labels for the input (radio) boxes - something to click on */
    .switches-container label {
        width: 50%;
        padding: 0;
        margin: 0;
        text-align: center;
        cursor: pointer;
        color: #000;
    }

/* switch highlighters wrapper (sliding left / right) 
    - need wrapper to enable the even margins around the highlight box
*/
.switch-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 33%;
    padding: 0.15rem;
    z-index: 3;
    transition: transform .5s cubic-bezier(.77, 0, .175, 1);
    /* transition: transform 1s; */
}

/* switch box highlighter */
.switch {
    border-radius: 3rem;
    background: #000;
    height: 100%;
}

    /* switch box labels
    - default setup
    - toggle afterwards based on radio:checked status 
*/
    .switch div {
        width: 100%;
        text-align: center;
        opacity: 0;
        display: block;
        color: white;
        transition: opacity .2s cubic-bezier(.77, 0, .175, 1) .125s;
        will-change: opacity;
        position: absolute;
        top: 0;
        left: 0;
    }

/* slide the switch box from right to left */
.switches-container input:nth-of-type(1):checked ~ .switch-wrapper {
    transform: translateX(0%);
}

/* slide the switch box from left to right */
.switches-container input:nth-of-type(2):checked ~ .switch-wrapper {
    transform: translateX(100%);
}
/* slide the switch box from left to right */

.switches-container input:nth-of-type(3):checked ~ .switch-wrapper {
    transform: translateX(200%);
}

/* toggle the switch box labels - first checkbox:checked - show first switch div */
.switches-container input:nth-of-type(1):checked ~ .switch-wrapper .switch div:nth-of-type(1) {
    opacity: 1;
}

/* toggle the switch box labels - second checkbox:checked - show second switch div */
.switches-container input:nth-of-type(2):checked ~ .switch-wrapper .switch div:nth-of-type(2) {
    opacity: 1;
}
.switches-container input:nth-of-type(3):checked ~ .switch-wrapper .switch div:nth-of-type(3) {
    opacity: 1;
}

/* filter ends here */