/**********PART IMAGE ZOOM************/

/*Part Detail Slider*/
@import url(https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css);
.col-item
{
    border: 1px solid #E1E1E1;
    border-radius: 5px;
    background: #FFF;
}
.col-item .photo img
{
    margin: 0 auto;
    width: 100%;
}

.col-item .info
{
    padding: 10px;
    border-radius: 0 0 5px 5px;
    margin-top: 1px;
}

.col-item:hover .info {
    background-color: #F5F5DC;
}
.col-item .price
{
    /*width: 50%;*/
    float: left;
    margin-top: 5px;
}

.col-item .price h5
{
    line-height: 20px;
    margin: 0;
}

.price-text-color
{
    color: #219FD1;
}

.col-item .info .rating
{
    color: #777;
}

.col-item .rating
{
    /*width: 50%;*/
    float: left;
    font-size: 17px;
    text-align: right;
    line-height: 52px;
    margin-bottom: 10px;
    height: 52px;
}

.col-item .separator
{
    border-top: 1px solid #E1E1E1;
}

.clear-left
{
    clear: left;
}

.col-item .separator p
{
    line-height: 20px;
    margin-bottom: 0;
    margin-top: 10px;
    text-align: center;
}

.col-item .separator p i
{
    margin-right: 5px;
}
.col-item .btn-add
{
    width: 50%;
    float: left;
}

.col-item .btn-add
{
    border-right: 1px solid #E1E1E1;
}

.col-item .btn-details
{
    width: 50%;
    float: left;
    padding-left: 10px;
}
.controls
{
    margin-top: 0px;
}
[data-slide="prev"]
{
    margin-right: 10px;
}

/*Part Detail SLider End*/
#part-images img {
    width: 25%;
    float: left;
    margin-right: 5px;
}

.featured-ribbon {
    position: absolute;
    top: -11px;
    left: 3px;
    z-index: 30;
    color: #fff;
    line-height: 18px;
    font-size: 11px;
    font-weight: 700;
    padding-right: 5px;
    font-family: calibri;
}

.featured-ribbon-pg-desc {
    position: absolute;
    top: -14px;
    left: 0px;
    z-index: 30;
    color: #fff;
    line-height: 18px;
    font-size: 11px;
    font-weight: 700;
    padding-right: 5px;
    font-family: calibri;
}

.featured-ribbon-pg-store {
    position: absolute;
    top: -9px;
    left: 5px;
    z-index: 30;
    color: #fff;
    line-height: 18px;
    font-size: 11px;
    font-weight: 700;
    padding-right: 5px;
    font-family: calibri;
}

.featured-ribbon-bundle {
    position: absolute;
    top: -3px;
    left: 6px;
    z-index: 30;
    color: #fff;
    line-height: 18px;
    font-size: 11px;
    font-weight: 700;
    padding-right: 5px;
    font-family: calibri;
}

.featured-ribbon i {
    background-color: #f66500;
    display: inline-block;
    width: 20px;
    line-height: 18px;
    float: left;
    margin: 0;
    margin-right: 5px;
    text-align: center;
}

/*********FRONT PAGE PANELS***********/
.front-panels {
    /*width: 350px;*/
}

.front-panels .panel-body {
    padding: 0;
}
.front-panels .panel-image {
    background-color: #EEE;
    padding-top: 5px;
}

.front-panels .panel-text {
    padding-top: 10px;
    line-height: 1.6em;;
}

/*****SELECTED VEHICLE*****/
.selected-vehicle {
    border-radius: 5px;
    border: 1px solid #BBB;
    height: 50px;
}

.select-v-title {
    background-color: #FF7719;
    height: 48px;
    color: #FFF;
    line-height:48px;
    text-align: center;
    font-size: 20px;
}

.select-v-desc {
    height: 48px;
    line-height: 48px;
}

.select-v-desc a {
    color: #FF7719;
}

#track-order{
    min-height: 300px;
}

.no-padding{
    padding: 0 !important;
}

.required-field{
    color: red;
}

/*******Main Slider****************/
#main-slider .item img{
    display: block;
    margin: auto;
    width: 100%;
    height: 345px; /*345px to be set */
    border-top: 3px solid #444;
    border-bottom: 3px solid #444;
}

/*********Select Car Box**************/

.autopart-finder {
    border: 1px solid #AAA;
    border-radius: 5px;
}

.autopart-finder a {
    color: darkslategray;
    font-size: 12px;

}

.header {
    padding: 10px 0;
}

.header em {
    background-color: #FF7719;
    color: #FFF;
    padding: 3px 10px;
}

.header  p {
    border-left: 3px solid #FF7719;
    background: #EEE;
    padding: 6px;
}

.selected {
    padding: 2px 10px;
    position: relative;
    margin-bottom: 3px;
}

.close {
    color: #000;
    position: absolute;
    top: 2px;
    font-weight: 500;
    right: 10px;
    cursor: pointer;
}

.finder-form {
    display: none;
}

.finder-form option  {
    outline: none !important;
}

/************************************/
.more-info-btn{
    background-color: black !important;
}
.list-product{
    height: auto;
}
#related-product-section img{
    width: 200px !important;
    height: 150px !important;
}
#related-product-section p{
    text-align: center;
}
.logo{
    width: 155px !important;
    padding-top: 13px !important;
}

.logo-abb-text {
    font-size: 46px;
    color: #fff;
    font-weight: 900;
    vertical-align: middle !important;
    text-align: center;
    font-family: "Lato Black";
    padding-top: 45px;
}

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    color: #f5f5f5 !important;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
    background-color: #5c5c5c;
    color: #fff;
}

.user_name{
    font-size:14px;
    font-weight: bold;
}
.comments-list .media{
    margin-top: 20px;
}

.btn-warning, .list-group-item.active{
    background-color: #ff8800 !important;
    border-color: transparent !important;
    color: white !important;
}

.panel-heading{
    background-color: #ff6600 !important;
    border-color: transparent !important;
    color: white !important;
    font-size: 14px;
    font-family: Helvetica;
    text-align: center;
}

.orderdetail-panel-heading{
    background-color: #444 !important;
    border-color: transparent !important;
    color: #fff !important;
    font-size: 14px;
    font-family: Helvetica;
    text-align: left;
}

.col-xxs-1 {
    width: 70px;
    float: left;
}


/*!* Main nav styling *!*/
/*.navbar-default .navbar-nav > li.dropdown:hover > a,*/
/*.navbar-default .navbar-nav > li.dropdown:hover > a:hover,*/
/*.navbar-default .navbar-nav > li.dropdown:hover > a:focus {*/
/*background-color: rgb(231, 231, 231);*/
/*color: rgb(85, 85, 85);*/
/*}*/
/*li.dropdown:hover > .dropdown-menu {*/
/*display: block;*/
/*}*/
/*!* End main nav styling *!*/

.order-status{
    font-size: 20px;
    color: #ff6800;
}

.order-status-detail{
    color: #ff6800;
    font-weight: 900;
}

.content-wrapper{
    margin-top: 20px !important;
    min-height: 400px !important;
}
.in-stock{
    color: #00dd00;
}

.out-stock{
    color: red;
}

#alert-message{
    margin-top: 20px;
}

#register-form{
    margin-top: 20px;
}

#login-form{
    margin-top: 20px;
}

body {
    font-family:KasseFLF ;
}
/* --- Top ---*/
#top-bar {
}

.sticky {
    position: fixed;
    right: 5px;
    top: 5px;
    color: #000;
    font-family: calibri;
    width: 250px;
    background-color: #fff;
    border-radius: 1px;
    z-index: 999999 !important;
    border: 1px solid grey;
    cursor: pointer;

}

#stickyShowHide {
    padding: 5px;
}

/* --- Sticky style ----*/

.close-sticky {
    position: absolute;
    top: 10px;
    right: 5px;
    width: 25px;
    text-align: center;
    height: 25px;
    line-height: 25px;
    transition: all .3s;
    border-radius: 50px;
}

.close-sticky:hover {
    background-color: #34495e;
    color: #FFF;
}

.sticky .table {
    background-color: #FFF;
}

#tab {
    display: none;
}

/* --- Sticky end style ----*/


.right-menu {
    font-weight: bold;
    color: #444;
    padding-top: 50px;
}

.right-menu a {
    color: #444;
    position: relative;
    bottom: 20px;
    padding: 0 10px;
    margin-left: 20px;
}
.left-menu {
    float: right;
    font-weight: bold;
    padding-top: 84px;
}

.left-menu a{
    color: #000;
    padding: 0 1px;
    margin-right: 10px;
}

/*--- Nav bar Start ---*/

#main-nav {
    background-color: #ff7719;
    color: #FFF;
    bordeR: none;
}


.navbar {
    margin-bottom: 0;
}

#main-link {
    color: #FFF;
}

/* --- Navbar End ---*/

/* --- Body Banner ---*/
#body-banner {
    height: 400px; /*ORIGINALLY 450PX*/
    position: relative;
}

#body-banner img {
    width: 100%;
}

.search-form {
    height: 122px;
    /*background-color: rgba(4, 4, 4, 0.7);*/
    position: relative;
    right: 0px;
    top: 0;
    z-index: 5;
    width: 495px;
    padding-left: 0px;
}

.search-form > form{
    padding: 0px;
    margin-top: 0px;
}

.search-form-btn {
    padding: 10px;
    margin-left: -3px;
    margin-top: -2px;
    border: 1px solid #444;
    text-align: center;
    width:50px;
    height:42px;
    background-color: #444;
    color:#fff;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

/*-- Body Banner Ends --- */


/* -- Service Area Starts --*/
#service-section {
    color: #FFF;
    background-color: #333;
    padding: 10px;
    display: block;
    position: relative;
    top: -40px;
    z-index: 1000;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

#service-section a {
    color: #FFF;
    text-decoration: none;
}

#service-section-xs {
    color: #FFF;
    background-color: #333;
    padding: 15px 20px 15px 20px;
    display: block;
    position: relative;
    top: -20px;
    z-index: 1000;
    width: 100%;
    height: 120px;
    margin-bottom: 0;
}

#service-section-xs a {
    color: #FFF;
    text-decoration: none;
}

.xs-section-div {
    background-color: #fff;
    color: #222;
    text-align: left;
    display: inline-block;
    width: 100%;
    padding: 2.5px 0px 2.5px 5px !important;
    height: 20px;
    font-size: 10px;
    vertical-align: middle !important;
    border-radius: 2px;
}

.xs-section-div-fol {
    background-color: #fff;
    color: #222;
    margin-top: 4px;
    text-align: left;
    display: inline-block;
    width: 100%;
    padding: 2.5px 0px 2.5px 5px !important;
    height: 20px;
    font-size: 10px;
    vertical-align: middle !important;
    border-radius: 2px;
}

.xs-go-btn {
    background-color: #ff6800;
    color: #fff;
    width: 20px;
    height: 20px;
    text-align: center;
    vertical-align: middle !important;
    font-size: 14px;
    position: relative;
    top: -2.5px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}

.xs-service-div-border {
    border-right: 1px solid #eee;
}

.s-section-one,.s-section-two,.s-section-three {
    background-color: #444;
    border-radius: 0px;
    text-align: center;
    padding: 5px;
    height: 87.5px;
    margin: 10px;
}

.service-message {
    background-color: #ff6800;
    height: 128px;
    color: #FFF;
    display: block;
    position: relative;
    top: -40px;
    z-index: 1000;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}


/* -- Service Area Ends --*/

/*--- Make/Logos Section Start ---*/

#makebox-section1,
#makebox-section2 {

    margin-top: 30px;
    margin-bottom: 30px;
}

#makebox-section2 > div{
    margin-bottom: 10px;
}

.panel-image img{
    margin-left: 5px;
}

/*#makebox-section2 img {*/
/*margin-left: 5px;*/
/*}*/

/*#makebox-section2 img:last-child{*/
/*margin-left: 0;*/
/*}*/

/* ---- Make/Logs Section Ends ---*/

#stock-brands {
    margin-bottom: 30px;
    text-align: center;
}

#stock-brands h3 {
    width: 100%;
    text-align: center;
    border-bottom: 3px solid #ff6f0b;
    line-height: 0.1em;
    margin: 10px 0 20px;
    font-weight: bold;
}

#stock-brands h3 span {
    background:#fff;
    padding:0 10px;
}

#stock-logos{
    margin-bottom: 20px;
}

#stock-logos img {
    padding: 10px;
}

#subscribe-box,
#warning-box,
#alert-box,
#social-box {
    border: 1px solid grey;
    border-radius: 5px;
    min-height: 300px;
    margin-top: 50px;
}

#subscribe-box img,
#warning-box img,
#alert-box img{
    padding: 25px;
}

#subscribe-box a,
#warning-box a,
#alert-box a {
    color: #ff6f0b;
}

#subscribe-box input[type='email'] {
    background-color: #ff6f0b;
    color: #FFF;
    padding: 7px 10px;
    border: 1px solid #444;
    border-radius: 10px;
    outline: none;
    max-width: 250px;
}

#subscribe-box ::-webkit-input-placeholder { / Chrome/Opera/Safari /
color: #FFF;
}
#subscribe-box ::-moz-placeholder { / Firefox 19+ /
color: #FFF;
}
#subscribe-box :-ms-input-placeholder { / IE 10+ /
color: #FFF;
}
#subscribe-box :-moz-placeholder { / Firefox 18- /
color: #FFF;
}

.btn-follow {
    padding: 7px;
    font-size: 20px;
    margin-top: 40px;
    background-color: #ff6f0b;
    color: #FFF;
    border: none;
    border-radius: 100px;
    width: 100px;
}

#social-btn {
    margin-top: 30px;
}

/*Stock Brands Ends*/

/*--- Footer ---*/

#footer-top {
    background-color: #333333;
    color: #FFF;
    margin: 10px 0;
    padding: 4px;
    font-family: calibri;
    font-size: 18px;
}

#footer-uppertop {
    background-color: #f5f5f5;
    color: #444;
    margin: 10px 0;
    min-height: 50px !important;
    padding: 4px;
    font-family: calibri;
    font-size: 18px;
    margin-bottom: -10px;
}

.footer-uppertop-col1 {
    position: relative;
    display: inline-block;
    left: 0px;
}

.footer-uppertop-col2 {
    position: relative;
    display: inline-block;
    right: 0px;
}

.footer-uppertop-col1-text {
    line-height: 1.2;
    font-size: 13.5px;
    font-weight: 300;
    margin-bottom: 5px;
}

#footer-middle{
    margin-bottom: 15px;
}

#footer-middle ul.list-unstyled > li {
    width: 100%;
    /*border-bottom: 1px solid grey;*/
}

#footer-middle ul.list-unstyled > li > a{
    color: #666;
    font-size: 15px;
}

#footer-middle .social-icons > a{
    margin-right: 5px;
}

#footer-middle ul.list-unstyled > li > a:hover{
    text-decoration: none;
    color: #aaa;
}

.footer-middle-headings {
    color: #666;
}

#contact-us-section ul.list-unstyled > li{
    width: 70%;
}

#footer-bottom {
    background-color: #191919;
    color: #FFF;
    padding-top: 10px;
}

#footer-bottom a {
    color: #ff6f0b;
}

/* ------ Other pages ------*/

/* ------ Products page start ----*/

#products-section .row {
    margin-bottom: 0px;
}

#products-section h4,
#products-section ul li,
#products-section ul li a {
    color: #1373a7;
}

#products-section .btn-sm {
    background-color: #ff6800;
}

#products-section .btn {
    margin: 10px 0;
}

#products-section img{
    width: 100%;
    height: 152px;
}

.part-name > a{
    color: #f86800 !important;
    border: none;
    font-size: 16px;
    font-weight: bold;
}

/* ------ Products end ----*/


/* ------ Categories Start ----*/

#popular-categories-section, #categories-section, #part-detail-section, #parts-section, #products-section {
    font-family: calibri;
    margin: 20px 0;
}

#popular-categories-section, #categories-section .row {
    margin-bottom: 20px;
}

#categories-section h4,
#categories-section ul li,
#categories-section ul li a {
    color: #1373a7;
}

#categories-section .btn-sm {
    background-color: #ff6800;
}

#categories-section .btn {
    margin: 10px 0;
}

#popular-categories-section h4,
#popular-categories-section ul li,
#popular-categories-section ul li a {
    color: #1373a7;
}

#popular-categories-section .btn-sm {
    background-color: #ff6800;
}

#popular-categories-section .btn {
    margin: 10px 0;
}

#categories-section img{
    height: 116px !important; /** 150px previously **/
    width: 177px !important; /** 100% previously **/
    /** background-color: lightgrey; **/
    border: none !important;
    opacity: 1;
}

#categories-section img:hover {
    height: 116px !important; /** 150px previously **/
    width: 177px !important; /** 100% previously **/
    /** background-color: lightgrey; **/
    border: none !important;
    opacity: 0.7;
}

#popular-categories-section img{
    height: 150px !important; /** 150px previously **/
    width: 100% !important; /** 100% previously **/
    /** background-color: lightgrey; **/
    border: none !important;
    opacity: 1;
}

#popular-categories-section img:hover {
    height: 150px !important; /** 150px previously **/
    width: 100% !important; /** 100% previously **/
    /** background-color: lightgrey; **/
    border: none !important;
    opacity: 0.7;
}

.thumbnail-nobrd {
    border: none !important;
}

.categories-links {
    color: #666 !important;
}

.categories-links:hover,
.categories-links:active {
    color: #aaa !important;
    text-decoration: none;
}

#popular-categories-section ul li, #popular-categories-section ul li a,
#categories-section ul li, #categories-section ul li a {
    color: #666;
}

.categories-style-type {
    list-style-type: square;
}

/* -------Categories end ----*/

.btn-xxxs,
.btn-group-xxxs > .btn {
    padding: 2.5px 7.5px !important;
    font-size: 10px !important;
    font-weight: 300 !important;
    line-height: 1.5 !important;
    border-radius: 3px !important;
}

/* ------ Product Page Info Start ----*/

#product-info {
    margin: 10px 0;
}

#product-info h3 {
    color: #ff6800;
}

#customer-rating {
    color: #225dd4;
    margin-top: 20px;
}

#product-detail-section h3 {
    font-weight: bold;
}

#product-detail-section p {
    font-weight: 700;
}

#highlights-section {
    /*font-weight: bold;*/
}

#related-product-section h3 {
    font-weight: bold;
}
#related-product-section p {
    color: #ff6800;
}


#related-product-section a:link,
#related-product-section a:visited {
    color: #ff6800;
}

#related-product-section a:hover,
#related-product-section a:active {
    color: #ff6800;
}

#review-text {
    font-size: 11px;
    color: #ff6800;
}

#addcart-box {
    height: auto;
    padding-bottom: 15px;
    text-align: center;
    border: 1px solid black;
    background-color: #f4f4f4;
}

.price-bar{
    background-color: #333;
    color: #fff;
    padding: 5px;
    border-left: 5px solid #FF7719;
}

.special-sale-bar {
    background-color: #FF7719;
    color: #fff;
    padding: 5px;
    border-left: 5px solid #333;
    font-weight: bold;
    text-transform: uppercase;
}

#addcart-box > h3 {
    background-color: #444;
    color: #FFF;
    font-size: 20px;
    padding: 20px 8px;
}
#addtocartbtn{
    background-color: black;
    color: white;
}
#addtocartbtn2{
    background-color: #ff5400;
    color: white;
    border-radius: 4px;
    padding: 6px 12px;
}
#addtofavpartstbtn2{
    background-color: #ffa800;
    color: white;
    border-radius: 0px;
    padding: 6px 12px;
    border-radius: 4px;
}

#actual-price {
    color: #ff6800;
}

#discounted_price{
    color: #ff6800;
}

#addcart-box a#addtocartbtn {
    background-color: #ff6800;
    color: #FFF;
    border: none;
    padding: 10px 15px;
    font-weight: bold;
}

/*#addcart-box-middle {*/
/*padding: 40px 0;*/
/*}*/

#addcart-box-middleend {
    margin-top: 20px;
    padding-right: 15px;

}

#addcart-box-middle h5 {
    font-weight: 600;
}

#addcart-box-middleend ul li {
    color: #ff6800;
    font-size: 12px;
    font-weight: 600;
}

#addcart-box-middleend ul li a,
#addcart-box-middleend a {
    font-weight: 600;
    color: #222;
    font-size: 12px;

}

#addcart-box-middleend p {
    font-weight: 600;
    color: #222;
    font-size: 12px;
}

/* ------ Product Page Info End ----*/


/* ------ Product List Page Start  -----*/

#products-section-inner{
    margin-top: 20px;
}

#pl {
    font-family: calibri;
}

#product-list-pag {
    background-color: #444;
    color: #FFF;
    border-radius: 5px;
    border: 1px solid grey;
}


#product-list-pag select {
    color: #000;
}

#product-list-pag a:link {
    color: #000;
    background-color: #FFF;
    padding: 6px;
    border-radius: 2px;
}

#product-list-pag a:hover {
    background-color: #f86800;
    text-decoration: none;
    color: #FFF;
}

#pagination {
    margin-top: 10px;
    margin-bottom: 0;
}

#product-section {
    /*margin-top: 30px;*/
}

#product-section > a {
    padding: 10px !important;
}

#strong {
    color: #f86800;
    font-weight: 700;
}

#desc-line {
    margin: 20px 0;
}

.product-topbar {
    background-color: #f86800;
}

#product-info-bar {
    background-color: #f6f5f5;
    margin-top: 10px;
}

.product-info-bar-top {
    padding: 5px 0;
    border: 1px solid black;
}

.product-info-bar-top > h4{
    margin-bottom: 0;
}

#product-info-bar p {
    font-weight: 700;
}

#product-info-bar a {
    padding: 5px 8px;
    background-color: #f86800;
    border-radius: 5px;
    color: #FFF;
    border: none;
    font-weight: bold;
    margin: 10px 0;
}

.availability-text {
    color: black;
}

#product-info-bar h4 {

}

/* ------ Product List Page End  -----*/

/* ------ Add to Cart Page Start ---*/

#shopping-cart {
    font-family: calibri;
    margin: 40px 0;
}
.shopping-cart{
    margin-top: 10px;
    /* min-height: 500px !important; */
}

#shopping-menu {
    background-color: #444;
    color: #FFF;
    padding: 10px;
}

#clr {
    color: #f86800;
}

#shopping-top-msg {
    margin-top: 10px;
}

#shopping-menu span {
    color: #f86800;
}

#shopping-cart-heading {
    margin: 0 !important;
    background-color: #f86800;
    padding: 10px;
    text-align: center;
    color: #FFF;
}

#delete-cart{
    background-color: red;
    color: white;
    padding: 10px;
    text-align: center;
    margin: 0;
}

#delete-cart > a{
    color: white;
}

#summry-bottom {
    background-color: #444;
    color: #FFF;
    padding: 10px;
    text-align: center;
    margin: 0;

}

#summry-bottom > a {
    color: white;
}

#summry-middle {
    background-color: #f86800;
    color: #FFF;
    text-align: center;
    padding: 10px;
    margin: 0;
}

#shopping-info-left {
    margin-top: 50px;
}

#shopping-coupon {
    background-color: #EEE;
    padding: 20px;
    margin: 10px 0;
}

#shopping-coupon input {
    background-color: #EEE;
    border: 1px solid #000;
    padding: 2px;
    outline: none;
}

#shopping-coupon .bl-btn {
    background-color: #000;
    color: #FFF;
    border: none;
    padding: 3px 20px;

}

#shopping-coupon .bl-btn:hover {
    background-color: #333;
}

#add {
    background-color: #f86800;
    border: none;
    color: #FFF;
}

#cost {
    color: #0044cd;
}

.input-number{
    text-align: center;
}

.price{
    font-size: 20px;
    color: #ff7719;
}

/* ------ Add to Cart Page End ---*/

/* ------ Biling Section ----*/

#billing-section {
    font-family: calibri;
    margin-top: 20px;
}

/*.payment-method-img {*/
/*position: relative;*/
/*bottom: 40px;*/
/*}*/

.tab {
    background-color: #EEE;
    padding: 5px;
}

#tab-one,
#tab-two,
#tab-three {
    width: 290px;
}

#tab-one {
    color: #FFF;
    padding: 10px 40px;
    font-size: 20px;
    font-weight: bold;
    color: #f86800;
}

#tab-two {
    color: #FFF;
    padding: 10px 40px;
    font-size: 20px;
}

#tab-three {
    color: #f86800;
    padding: 10px 40px;
    font-weight: bold;
    font-size: 20px;
}

/*.active{*/
/*background-color: #f86800;*/
/*color: #FFF;*/
/*}*/

#link {
    color: orange;
    font-weight: 800;
}

#btn {
    background-color: #ff6800;
}

#login {
    border: 1px solid #DDD;
    padding: 10px;
}

#order-summary{
    border: 1px solid #DDD;
    padding: 10px;
}

#info-bar{
    margin-top: 10px;
}
/* ------ Biling Section End ----*/

/* --------Profile ------------*/

#user-profile, #user-orders{
    min-height: 200px;
    margin-top: 20px;
}

/*------------Search Part --------------*/

.glyphicon { margin-right:5px; }

.thumbnail
{
    margin-bottom: 20px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.item{
}

.item.list-group-item
{
    float: none;
    width: 100%;
    background-color: #444;
    margin-bottom: 10px;
}
/*.item.list-group-item:nth-of-type(odd):hover,.item.list-group-item:hover*/
/*{*/
/*background: #428bca;*/
/*}*/

.item.list-group-item .list-group-image
{
    margin-right: 10px;
}
.item.list-group-item .thumbnail
{
    margin-bottom: 0px;
}
.item.list-group-item .caption
{
    padding: 9px 9px 0px 9px;
}
/*.item.list-group-item:nth-of-type(odd)*/
/*{*/
/*background: #eeeeee;*/
/*}*/

.item.list-group-item:before, .item.list-group-item:after
{
    display: table;
    content: " ";
}

.item.list-group-item img
{
    float: left;
}
.item.list-group-item:after
{
    clear: both;
}
.list-group-item-text
{
    margin: 0 0 11px;
}

.list-group-image{
    width: 400px !important;
    /**height: 225px !important;**/
}

/*********Footer*******************/
#footer-bottom p {
    margin-bottom: 0 !important;
}

#footer-bottom p:last-child{
    margin-bottom: 5px !important;
}

#sticky-checkout-btn{
    background-color: #ff9900;
    color: white;
}

#sticky-empty-cart-btn{
    background-color: red;
    color: white;
}

p.cart-summary-options{

}

#filter-section{
    margin-top: 20px;
}

.search-filter{
    /*margin-top: 44px;*/
    padding: 10px;
    background-color: #fff;
    border: 1px solid #fff;
    /*background-color: rgba(204, 204, 204, 0.25);*/
}

.search-filter .panel{
    background-color: transparent !important;
}

.search-filter h4{
    color: #ff6800;
}

.parts-list .total-parts{
    font-size: 20px;
}
.average-rating-main{
    background-color: rgba(211, 211, 211, 0.28);
    height: auto;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-align: center;
}

.btn-remove-car-back {
    color: #fff;
    background-color: #444;
}

.btn-remove-car-back:hover {
    color: #fff;
    background-color: #222222;
}

.btn-remove-car {
    padding: 5px 10px;
    font-size: 12px;
    font-family: lato;
    line-height: 1.5;
    border-radius: 3px;
}

.avg-rating-desc {
    font-family: Calibri !important;
    color: #d2d2d2 !important;
    font-size: 26px !important;
}

.votes-partdesc {
    float: left;
    font-size: 12px;
    font-family: Helvetica;
    color: #848484;
}

.partdetailsinfo {
    font-family: Helvetica;
    font-size: 12px;
    color: #333333;
    float: left;
    font-weight: 600;
    left: 30px !important;
}

.partdetailsinfo2 {
    font-family: Helvetica;
    font-size: 12px;
    color: #333333;
    float: left;
    font-weight: 600;
    line-height: 10px;
    left: 30px !important;
}

.headerrow-desc {
    left: 30px !important;
}

.subdetails-desc {
    display: inline !important;
    margin-left: 60px !important;
    width: 20% !important;
    font-weight: 300;
}

.subdetails-desc2 {
    display: inline !important;
    margin-left: 38px !important;
    width: 20% !important;
    font-size: 14px;
    font-weight: 300;
}
.subdetails-desc3 {
    display: inline !important;
    margin-left: 6px !important;
    font-weight: 600;
    font-family: Helvetica;
    font-size: 12px;
    color: #333333;
}

.subdetails-search3 {
    display: inline !important;
    font-weight: 600;
    font-family: Helvetica;
    font-size: 12px;
    color: #333333;
}

.subdetails-desc4 {
    display: inline !important;
    margin-left: 38px !important;
    font-weight: 600;
}

.fprice-partdesc {
    position: relative;
    display: inline;
    color: #ff6800;
    font-family: Helvetica;
    font-weight: 900 !important;
    font-size: 28px;
    top: -3px;
    vertical-align: top !important;
}

.fprice-partdesc2 {
    position: relative;
    display: inline-block;
    color: #333333;
    font-family: Helvetica;
    font-size: 18px;
    font-weight: 300;
    top: -3px;
    vertical-align: top !important;
}

.perpieceinfo {
    position: relative;
    top: -5px;
    color: #808080;
    font-family: Helvetica;
    font-size: 12px;
}

.perpieceinfo-2 {
    position: relative;
    top: 0px;
    left: 5px;
    color: #808080;
    font-family: Helvetica;
    font-size: 12px;
}

.yousaveinfo-desc {
    position: relative;
    color: red;
    font-family: Helvetica;
    font-size: 12px;
    font-weight: 300;
}

.quantitynewbox-desc {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-left: 25px;
}

.form-group-sm .form-control {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 0px;
}
.form-group-sm select.form-control {
    height: 30px;
    line-height: 30px;
}
.form-group-sm textarea.form-control,
.form-group-sm select[multiple].form-control {
    height: auto;
}
.form-group-sm .form-control-static {
    height: 30px;
    min-height: 32px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 1.5;
}
.vendorinfo-desc {
    color: #ff7f00;
    font-size: 17px;
    font-family: "Lato Medium";
    font-weight: 900;
}
.vendorinfo-desc:hover,
.vendorinfo-desc:visited,
.vendorinfo-desc:active {
    color: #ff7f00;
    font-size: 17px;
    font-family: "Lato Medium";
    font-weight: 900;
    text-decoration: none !important;
}
.dealercitydetails {
    font-weight: 500;
    font-family: lato;
    font-size: 12px;
    color: #333333;
    line-height: 1px;
}

.dealerbadge-verify {
    position: relative;
    display: inline-block;
    top: -2.5px !important;
}

.nodiscqty-box {
    position: relative;
    display: inline;
    top: -5px;
}

.deliverytimetext-desc {
    display: inline-block;
    position: relative;
    top: 10px;
    color: #333333;
    font-size: 12px;
    font-family: Helvetica;
    font-weight: 300;
    line-height: 1px !important;
}

.dealerratingtext-desc {
    display: inline-block;
    position: relative;
    top: 7.5px;
    color: #333333;
    font-size: 12px;
    font-family: Helvetica;
    font-weight: 300;
    line-height: 1px !important;
}
.nav-tabs {
    border-bottom: 1px solid #ddd;
}
.nav-tabs > li {
    float: left;
    margin-bottom: -1px;
}
.nav-tabs > li > a {
    margin-right: 0px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 0px 0px 0 0;
    padding: 5px 20px;
    color: #9d9d9d;
    background-color: #f4f4f4;
}
.nav-tabs > li > a:hover {
    border-color: #eee #eee #ddd;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #ff6800;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}

.fixed-badges-div {
    position: absolute;
    display: block;
    top: 20px;
    height: auto;
    background-color: #9d9d9d;
    padding: 20px 5px;
}

/*#fixed-badges-div {*/
/*padding: 40px 0;*/
/*}*/

#fixed-badges-divend {
    margin-top: 20px;
    padding-right: 15px;
}

#fixed-badges-div h5 {
    font-weight: 600;
}

#fixed-badges-divend ul li {
    color: #ff6800;
    font-size: 12px;
    font-weight: 600;
}

#fixed-badges-divend ul li a,
#fixed-badges-divend a {
    font-weight: 600;
    color: #222;
    font-size: 12px;

}

#fixed-badges-divend p {
    font-weight: 600;
    color: #222;
    font-size: 12px;
}

#fixed-badges-box {
    position: relative;
    top: 20px;
    height: 210px;
    padding-bottom: 15px;
    text-align: left;
    border: none;
    background-color: #fff;
    color: #4c4c4c;
    font-size: 14px;
    font-family: lato;
}

.sidebadge-imagespos {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    margin-left: 10px;
}

.margin-stretch-fixedbadges {
    margin-bottom: 10px;
}

.fixed-badges-col-1 {
    position: relative;
    top: 3.5px;
    width: 20%;
    background-color: transparent;
    padding: 2.5px;
    text-align: center;
}

.fixed-badges-col-2 {
    position: absolute;
    display: block;
    margin-left: 60px;
    padding: 2.5px;
    top: 3.5px;
    background-color: transparent;
    color: #4c4c4c;
    font-family: lato;
    font-size: 14px;
    text-align: center;
}

.questionmarks-tooltips {
    color: #999999;
}

.sellonpakmoto-badge {
    position: relative;
    top: 10px;
    left: -25px;
    width: 300px;
}

.sellonpakmoto-badge-text {
    font-size: 14px;
    font-family: lato;
    color: #ff6800;
    font-weight: 600;
}

.sellonpakmoto-badge-text:hover,
.sellonpakmoto-badge-text:visited,
.sellonpakmoto-badge-text:active {
    font-size: 14px;
    font-family: lato;
    color: #ff6800;
    font-weight: 600;
    text-decoration: none;
}

/* for pop-ups */
#blanket {
    background-color:#111;
    opacity: 0.65;
    *background:none;
    position:absolute;
    z-index: 9001;
    top:0px;
    left:0px;
    width:100%;
}

#popUpDiv {
    position:absolute;
    background:url(pop-back.jpg) no-repeat;
    width:400px;
    height:400px;
    border:5px solid #000;
    z-index: 9002;
}

.reviewbar-descpg {
    position: relative;
    display: inline-block;
    width: 100%;
    background-color: #f5f5f5;
    padding: 7.5px;
    color: ##444;
    font-family: "Lato Medium";
    font-weight: 300;
    font-size: 14px;
    border-radius: 4px;
}

.reviewbar-text-descpg {
    position: relative;
    display: inline;
    left: 10px;
}

.review-bar-button {
    background-color: #ff5400;
    color: white;
    border-radius: 4px;
    padding: 6px 12px;
}

.inline-block {
    display: inline;
}

.userreview-sidepanel {
    margin-top: 20px;
    margin-left: 40px;
    padding-right: 35px;
    padding-left: 35px;
    font-family: Lato;
    font-size: 14px;
}

.userrating-ratebarsdesc {
    position: relative;
    display: block;
    top: -10px;
    line-height: 10px;
}

.linebreak-border {
    width: 95%;
    position: relative;
    top: 12.5px;
    padding-left: 15px;
    padding-right: 15px;
}

.ratingsnapshot-desc {
    margin: 20px 0 30px 0;
    font-family: "Lato Medium";
    font-size: 12px;
    font-weight: 600;
}

.avgrating-desc {
    margin-top: 20px;
    font-family: "Lato Medium";
    font-size: 13px;
    font-weight: 600;
}

.ratingstyle-desc {
    margin: 15px 0 0 30px;
    font-family: "Lato Medium";
    font-size: 12px;
    font-weight: 600;
}

.ratingsnapshot-ratebars {
    margin-left: 10px;
}

.avgrating-scale-desc {
    margin: 15px 0 0 10px;
    font-family: "Lato Medium";
    font-size: 13px;
    font-weight: 600;
}
/* for testing purpose only */
.avgrating-listtype-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
/* for testing purpose only */
.avgrating-listtype-li {
    display: block;
    float: left;
    color: #444;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.avgrating-scale-desc2 {
    float: right;
    font-weight: 100;
}

.mediumfont {
    font-weight: 500;
}

.buildabundlehead {
    margin-bottom: 0px;
}

.buildabundlehead-heading {
    color: #ff6800;
    margin-bottom: 0px;
    font-weight: 300;
    font-size: 20px;
    font-family: "Lato Medium";
    margin-left: 15px;
}

.customizebundle-btn {
    background: linear-gradient(#444, #848484) !important;
    color: white !important;
    padding: 0px 8px !important;
    border-radius: 30px !important;
}

.buildbundlebody {
    margin-left: 15px;
}

.buildabundle-thumbnail {
    display: inline-block;
    border: 2px solid #ddd;
    border-radius: 6px;
    width: 115px;
    height: 115px;
    margin-left: 0px !important;
    padding: 5px;
}

.buildabundle-thumbnail:visited,
.buildabundle-thumbnail:hover,
.buildabundle-thumbnail:active {
    border: 3px solid #ff6800;
    cursor: pointer;
}



.bundle-thumb-img {
    width: 100%;
    padding-top: 17.5px;
}

.buildabundleplus {
    font-family: "Lato Medium";
    font-size: 24px;
    color: #444;
    font-weight: 900;
    position: relative;
    display: inline-block;
    bottom: 65px;
}

.buildabundle-subheads,
.buildabundle-subheads:hover,
.buildabundle-subheads:visited,
.buildabundle-subheads:active {
    display: block;
    font-family: "Lato Medium";
    color: #ff6800;
    font-size: 13px;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    overflow-wrap: break-word;
}

.paddingthumbnails {
    margin-left: 40px;
}

.col-bundle-thumbnail {
    width: 125px;
    position: relative;
    display: inline-block;
    min-height: 1px;
    padding-right: 5px;
    padding-left: 5px;
}

@media (min-width: 992px) {
    .col-bundle-thumbnail
    float: left;
}

.col-bundle-thumbnailplus {
    width: 20px;
    position: relative;
    display: inline-block;
    min-height: 1px;
    padding-right: 2.5px;
    padding-left: 2.5px;
}

@media (min-width: 992px) {
    .col-bundle-thumbnailplus
    float: left;
}

/* FOR INNER BUNDLE VIEW */

.col-innerbundle-thumbnail {
    width: 125px;
    position: relative;
    display: inline-block;
    min-height: 1px;
    padding-right: 5px;
    padding-left: 5px;
    margin: 0 5px;
}

.bundleinner-subheads,
.bundleinner-subheads:hover,
.bundleinner-subheads:visited,
.bundleinner-subheads:hover,
.bundleinner-subheads:active {
    display: block;
    font-family: Helvetica;
    color: #ff6800;
    font-size: 13px;
    font-weight: 300;
    text-align: center;
    text-decoration: none;
    padding-right: 5px;
    padding-left: 5px;
    overflow-wrap: break-word;
    margin-bottom: 15px;
}

@media (min-width: 992px) {
    .col-innerbundle-thumbnail
    float: left;
}

.col-innerbundle-thumbnailplus {
    width: 20px;
    position: relative;
    display: inline-block;
    min-height: 1px;
    padding-right: 2.5px;
    padding-left: 2.5px;
}

@media (min-width: 992px) {
    .col-innerbundle-thumbnailplus
    float: left;
}

/* END HERE */

.otherproductsdealer-heading {
    color: #848484;
    margin-bottom: 0px;
    font-weight: 300;
    font-size: 20px;
    font-family: "Lato Medium";
    margin-left: 15px;
}

.viewstorelink,
.viewstorelink:hover,
.viewstorelink:visited,
.viewstorelink:active {
    color: #ff6800;
    padding: 0px 8px;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}

/* tool tip for delivery schedule only */
.tooltip-partdescpage {
    position: relative;
    display: inline-block;
}

.tooltip-partdescpage .tooltiptext-partdescpage {
    visibility: hidden;
    background-color: transparent;
    color: #fff;
    text-align: center;
    border-radius: 0px;
    padding: 10px 10px;
    position: absolute;
    z-index: 1;
    top: 0%;
    left: 50%;
    margin-left: -285px;

    /* fade animation */
    opacity: 0;
    transition: opacity 1s;
}

.tooltip-partdescpage .tooltiptext-partdescpage::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 80%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent transparent;
}

.tooltip-partdescpage:hover .tooltiptext-partdescpage {
    visibility: visible;
    cursor: pointer;
    opacity: 1;
}

.boxshadow-hovereffect-pgdesc {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
/* end tool tip for delivery schedule only */

/* tool tip for verified dealer only */
.tooltip-pgdesc-dealer {
    position: relative;
    display: inline-block;
}

.tooltip-pgdesc-dealer .tooltiptext-pgdesc-dealer {
    visibility: hidden;
    width: 140px;
    background-color: #fff;
    font-family: "Lato Medium";
    font-weight: 300;
    font-size: 12px;
    color: #ff6800;
    text-align: center;
    border-radius: 4px;
    padding: 15px 10px;
    position: absolute;
    z-index: 1;
    top: 170%;
    left: 50%;
    margin-left: -116px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

    /* fade animation */
    opacity: 0;
    transition: opacity 1s;
}

.tooltip-pgdesc-dealer .tooltiptext-pgdesc-dealer::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 80%;
    margin-left: -5px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent white transparent;

}

.tooltip-pgdesc-dealer:hover .tooltiptext-pgdesc-dealer {
    visibility: visible;
    cursor: pointer;
    opacity: 1;
}

.ex-policy-tooltip-text,
.ex-policy-tooltip-text:hover,
.ex-policy-tooltip-text:visited,
.ex-policy-tooltip-text:active {
    font-family: "Lato Medium";
    font-weight: 300;
    font-size: 12px;
    color: #ff6800;
    text-align: center;
}
/* end tool tip for verified dealer only */

.uidialog-box-review {
    background-color: #ff6800;
}

#reviewuidialog-box {
    position: sticky;
    z-index: 9999;
    width: 300px;
    height: 300px;
    background-color: red;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 2147483647; /* Sit on top */
    padding-top: 50px; /* Location of the box */
    padding-bottom: 75px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    overflow-x: auto;
    overflow-y: auto;
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
}

/* Modal Content */

.review-form-modal-content {
    display: block;
    position: relative;
    background-color: #f5f5f5;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 70%;
    border-radius: 8px !important;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s

}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close {
    color: #ddd;
    opacity: 0.8;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    opacity: 1;
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.review-form-modal-header {
    padding: 6px 8px;
    background-color: #444;
    color: #fff;
    border: none;
    margin-bottom: 10px;
    border-top-right-radius: 8px !important;
    border-top-left-radius: 8px !important;
}

.review-form-modal-body {padding: 4px 16px;}

.review-form-modal-footer {
    padding: 2px 8px;
    background-color: inherit;
    color: #444;
    border-radius: 6px;
}

/* End of modal box */

/* Modal Content for Build a Bundle */

/* The Modal (background) */
.bundlemodal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 2147483647; /* Sit on top */
    padding-top: 50px; /* Location of the box */
    padding-bottom: 50px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    overflow-x: auto;
    overflow-y: auto;
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
}

.build-bundle-modal-content {
    display: block;
    position: relative;
    background-color: #fff;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    border-radius: 8px;
    width: 60%;
    z-index: 999 !important;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s

}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.closebundle {
    color: #ddd;
    opacity: 0.8;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.closebundle:hover,
.closebundle:focus {
    opacity: 1;
    color: black !important;
    text-decoration: none;
    cursor: pointer;
}

.build-bundle-modal-header {
    padding: 15px 30px;
    background-color: #fff;
    color: black;
    border: none;
    margin-bottom: 10px;
    font-size: 20px;
    font-family: "Lato Medium";
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.build-bundle-modal-body {
    padding: 4px 16px;
    border-radius: 8px !important;
}

.build-bundle-modal-footer {
    padding: 2px 8px;
    background-color: inherit;
    color: #444;
    border-radius: 6px;
}

.bundle-inner-thumbnail {
    display: inline-block;
    border: 2px solid #ddd;
    border-radius: 6px;
    position: relative;
    left: 10px;
    width: 125px;
    height: 125px;
    margin-left: 0px !important;
    margin-bottom: 5px;
}

.bundle-inner-thumbnail:hover {
    border: 3px solid #ff6800;
    cursor: pointer;
}

.bundle-inner-arrow-up {
    top: 100px;
    width: 100px;
    height: 100px;
    border-left: 15px solid transparent !important;
    border-right: 15px solid transparent !important;
    border-bottom: 15px solid #ff6800 !important;
}


/* End of modal box */

/* The Search Modal (background) */
.searchbarmodal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 2789181 !important; /* Sit on top */
    padding-top: 40px; /* Location of the box */
    padding-bottom: 40px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    overflow-x: auto;
    overflow-y: auto;
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
}

.search-top-modal-content {
    display: block;
    position: relative;
    background-color: #fff;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    z-index: 2789181 !important;
    width: 90%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s
    border-radius: 8px !important;

}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.search-close {
    color: #ddd;
    opacity: 0.8;
    float: right;
    font-size: 28px;
    font-weight: bold;
    z-index: 999 !important;
}

.search-close:hover,
.search-close:focus {
    opacity: 1;
    color: black;
    text-decoration: none;
    cursor: pointer;
    z-index: 999 !important;
}

.search-top-modal-body {
    padding: 4px 16px;
    border-radius: 8px !important;
    z-index: 999 !important;
}

/* End of search modal box */

/* Styling for review form */

.review-form-rows {
    display: block;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

.review-form-rows-following {
    display: block;
    width: 100%;
    padding: 7.5px 7.5px;
    margin: 15px 0;
    border-top: 1px solid #ddd!important;
}

.review-form-rows-following-33perc {
    display: inline-block;
    width: 33%;
    padding-right: 15px;
    margin-top: 15px;
}

.review-form-rows-following-25perc {
    display: inline-block;
    width: 25%;
    padding-right: 15px;
    margin-top: 15px;
}

.review-form-rows-following-45perc {
    display: inline-block;
    width: 49%;
    padding-right: 30px;
    margin-top: 15px;
}

.review-form-rows-following-16perc {
    display: inline-block;
    width: 16.66666667%;
    padding-right: 30px;
    margin-top: 15px;
}

.review-form-rows-following-41perc {
    display: inline-block;
    width: 41.66666667%;
    padding-right: 30px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.reviewtitle-textfield {
    width: 100% !important;
    border-radius: 4px;
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ededed;
}

.reviewtitle-textfield:hover {
    border: 1px solid #444;
    -webkit-transition : border 500ms ease-out;
    -moz-transition : border 500ms ease-out;
    -o-transition : border 500ms ease-out;
    transition : border 500ms ease-out;
}

.myreview-mainbody {
    width: 100% !important;
    border-radius: 4px;
    padding: 5px;
    font-size: 14px;
    padding-left: 15px;
    padding-right: 15px;
    border: 1px solid #ededed;
}
.myreview-mainbody:hover {
    border: 1px solid #444;
    -webkit-transition : border 500ms ease-out;
    -moz-transition : border 500ms ease-out;
    -o-transition : border 500ms ease-out;
    transition : border 500ms ease-out;
}

.recommend-buttons-yes {
    display: inline;
    background-color: #ededed;
    font-size: 14px;
    font-family: "Lato Medium";
    padding: 6px 25px;
    border: 1px solid #e0dfe3;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.recommend-buttons-no {
    display: inline;
    margin-left: -4px;
    background-color: #ededed;
    font-size: 14px;
    font-family: "Lato Medium";
    padding: 6px 25px;
    border: 1px solid #e0dfe3;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.recommend-buttons-yes:hover,
.recommend-buttons-no:hover {
    background-color: #e0dfe3;
}

.review-form-submit-btn {
    margin: auto;
    text-align: center;
    padding: 7.5px 15px;
    background-color: #ff6800;
    display: inline-block;
    border: none;
    font-size: 16px;
    font-family: Helvetica;
    color: #fff;
    border-radius: 4px;
    margin-bottom: 10px;
}

.review-form-submit-btn:hover,
.review-form-submit-btn:visited,
.review-form-submit-btn:active {
    background-color: #ff7700;
}

.review-form-header-text {
    margin-top: 12.5px;
    font-size: 18px;
    font-family: Helvetica;
    text-align: left;
    margin-left: 20px;
}

/* End of styling for review form */

/* Styling My Cart table */

.table.mycarttable {
    border-collapse: collapse !important;
    border-radius: 12px !important;
    border-bottom: 1px solid #ddd;
}

.table.mycarttable > thead > tr > th {
    background-color: #fff;
    border-collapse: collapse !important;
    text-align: left;
    vertical-align: middle !important;
    padding: 2.5px !important;
    color: #999;
    border-bottom: 1px solid #ddd;
    font-weight: 400 !important;
}

.table.mycarttable > tbody > tr > td {
    background-color: #ffffff;
    border: none;
    text-align: left;
    vertical-align: top !important;
    color: #5c5c5c;
}

.mycartable-img {
    display: block;
    width: 70px;
    min-height: 70px;
    border: 1px solid black;
}

.mycartable-img:hover,
.mycartable-img:active {
    display: block;
    width: 70px;
    min-height: 70px;
    border: 1px solid #ff6800;
}

.qtyunit-box {
    width: 45px;
    padding: 2px 0 !important;
    border: 1px solid #ccc !important;
}
/* End of My Cart table */

.continue-shop-txt {
    color: #999;
    text-decoration: none;
}

.continue-shop-txt:hover,
.continue-shop-txt:active {
    color: #ff6800;
    text-decoration: underline;
}

.cart-dealer-txt {
    color: #5c5c5c;
    text-decoration: none;

}

.cart-dealer-txt:hover,
.cart-dealer-txt:active {
    color: #ff6800;
    text-decoration: underline;
}

.cart-dealer-part-name {
    overflow-wrap: break-word;
    padding-left: 20px;
}

.checkout-dealer-txt {
    color: #999;
    text-decoration: none;
}

.checkout-dealer-txt:hover,
.checkout-dealer-txt:active {
    color: #ff6800;
    text-decoration: underline;
}

.mycart-qtybox {
    text-align: center !important;
    width: 30% !important;
    border-radius: 6px;
}

.newcart-qtybox {
    text-align: center !important;
    border: 1px solid #eee;
    width: 50% !important;
}

.col-xs-12width {
    width: 12.50%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
}

.col-xs-20width {
    width: 20%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
}

.col-xs-10width {
    width: 10%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
}

.newcol-xs-12width {
    width: 100%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
}

.check-mycart {
    font-size: 24px;
    color: #00dd00;
}

.cross-mycart {
    font-size: 24px;
    color: #dd0000;
}

.cross-mycart-delete {
    font-size: 20px;
    color: #dd0000;
}

.table.no-border-mycart {
    border-left: 1px solid #ddd;
}

.table.no-border-mycart > thead > tr > th {
    border: none;
}

.table.no-border-mycart > tbody > tr > td {
    border: none;
    padding: 5px 5px;
    font-family: Helvetica;
    color: #999;
}

.mycart-table-style1 {
    background-color: none;
    margin-right: 15px;
    border-radius: 4px;
    color: #5c5c5c;
}

.mycart-totalsavings {
    color: #00dd00;
    font-size: 10px;
    font-weight: 600;
}

.orangecolortext {
    color: #ff6800;
}

.orangecolortext:hover,
.orangecolortext:visited,
.orangecolortext:active {
    color: #ff6800 !important;
    text-decoration: none !important;
}

.searchpanel-price {
    font-size: 12px;
    color: #9d9d9d;
}

.search-disc-bar {
    padding: 0 0 !important;
    color: #fff;
    font-weight: 900;
    background-color: #ff6800;
    text-align: center !important;
}

.my-cart-disc-bar {
    margin-top: 10px;
    padding: 4px 2px !important;
    color: #fff;
    font-weight: 900;
    font-size: 13px;
    background-color: #ff6800;
    text-align: center !important;
}

.bundle-rewards {
    padding: 4px 2px !important;
    color: #fff !important;
    font-weight: 900;
    font-size: 15px !important;
    background-color: #ff6800;
    text-align: center !important;
}

.bundle-rewards-text {
    font-size: 14px;
    color: #444;
    padding-top: 4.5px;
    text-align: left;
    padding-left: 40px;
}

.bundle-cart-btn {
    display: inline-block;
    margin-left: 15px;
}

.btn-learn-more {
    margin-top: 10px;
    padding: 0px 15px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    border-radius: 8px;
}

.btn-learn-more-style {
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    background-color: #ffa700;
    border-color: #d08800;
    border: 1px solid #d08800 !important;
    border: none;
    margin-right: 15px;
    margin-top: 5px;
}

.btn-learn-more-style:hover {
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    background-color: #ffc414;
    border-color: #d08800;
    border: 1px solid #d08800 !important;
    border: none;
    margin-right: 15px;
    margin-top: 5px;
}

.fiftyperc-width-input-type {
    width: 50% !important;
    padding: 0px 10px !important;
}

.btn-subscribe-upperfooter {
    position: relative;
    display: inline-block;
    padding: 0px 15px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    border-radius: 8px;
}

/* for search images */
.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
    display: block;
    max-width: 100%;
    height: auto;
}
/* end */

/* Payment Methods Nav Styling */

.payment-methods-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
    background-color: #fff;
    position: relative;
    height: 100%;
    overflow: auto;
    border-radius: 4px;
}

.payment-methods-li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

.payment-methods-li a.active {
    background-color: #ff6800;
    color: #fff;
}

.payment-methods-li a:hover:active {
    background-color: #ff6800;
    color: #fff;
}

.payment-methods-li a:hover:not(.active) {
    background-color: #ff6800;
    color: #fff;
}

/* End of Payment Methods Styling */


.mycart-staticbox {
    padding: 5px;
    border: 1px solid #ddd;
    margin-left: 15px;
    border-radius: 0px;
}

.mycart-help-box {
    margin-top: 15px;
    margin-left: 15px;
    border: 1px solid #ddd;
    border-radius: 0px;
    padding: 2px;
    color: #5c5c5c;
    background-image: url("/img/tti-asia-customer-service.png");
    background-repeat: no-repeat;
    background-position: right bottom;
}

.mycart-help-box-para {
    margin-left: 10px;
    margin-top: 5px;
}

.mycart-help-box-minipara {
    font-size: 13px;
    color: #5c5c5c;
    float: left;
    font-weight: 600;
    line-height: 1;
    margin-left: 10px;
}

.mycart-help-box-coupon {
    margin-top: 15px;
    border: 1px solid #ddd;
    border-radius: 0px;
    padding: 5px;
    margin-left: 15px;
    background-color: beige;
}

.mycart-help-box-we-accept {
    margin-top: 10px;
    border: 1px solid #ddd;
    border-radius: 0px;
    padding: 5.5px;
}

.inline-block-class {
    display: inline-block;
}

.checkout-form-text-fields {
    border-radius: 4px;
    border: 1px solid #ccc;
    padding: 2px 15px;
}

.checkout-title-heads {
    background-color: #fff;
    border-bottom: 2px solid #ddd !important;
    text-align: left;
    vertical-align: middle !important;
    color: #5c5c5c;
    margin-bottom: 20px;
    font-size: 14px;
    padding: 5px 15px !important;
    font-family: "Lato Black";
}

.use-this-add-title {
    background-color: #00a65a;
    border: none !important;
    text-align: left;
    vertical-align: middle !important;
    color: #fff;
    margin-bottom: 10px;
    font-size: 14px;
    padding: 5px 15px !important;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    font-family: "Lato Black";
}

.checkout-title-heads-2 {
    background-color: #fff;
    border-bottom: 1px solid #ddd !important;
    text-align: left;
    vertical-align: middle !important;
    color: #5c5c5c;
    margin-bottom: 15px;
    font-size: 14px;
    padding: 5px 15px !important;
    font-family: "Lato Black";
}

.checkout-notice-head {
    background-color: #fff;
    border-bottom: 1px solid red !important;
    text-align: left;
    vertical-align: middle !important;
    color: red;
    margin-bottom: 10px;
    font-size: 14px;
    padding: 5px 15px !important;
    font-family: "Lato Black";
}

.checkout-order-summary-bar {
    background-color: beige;
    border: none !important;
    text-align: right;
    vertical-align: middle !important;
    color: #5c5c5c;
    margin-bottom: 10px;
    font-size: 14px;
    padding: 5px 15px !important;
    font-family: "Lato Black";
    line-height: 1.6;
}

.checkout-order-summary-bar-text {
    font-family: "Lato Medium";
    line-height: 1.6;
    font-size: 14px;
    color: #5c5c5c;
    text-align: right !important;
    vertical-align: middle !important;
}

/* Custom Radio Buttons */
/* The container */
.container-radio-btns {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 6px;
    cursor: pointer;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.container-radio-btns input {
    position: absolute;
    opacity: 0;
}

/* Create a custom radio button */
.checkmark-radio-btns {
    position: absolute;
    top: 0;
    left: 0;
    height: 15px;
    width: 15px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container-radio-btns:hover input ~ .checkmark-radio-btns {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container-radio-btns input:checked ~ .checkmark-radio-btns {
    background-color: red;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark-radio-btns:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.container-radio-btns input:checked ~ .checkmark-radio-btns:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.container-radio-btns .checkmark-radio-btns:after {
    top: 4px;
    left: 4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: white;
}

/* End of Custom Radio Button */

/* Custom Coupon Apply Buttons 2 */
/* The container */
.container-coupon-btns {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 6px;
    cursor: pointer;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.container-coupon-btns input {
    position: absolute;
    opacity: 0;
}

/* Create a custom radio button */
.checkmark-coupon-btns {
    position: absolute;
    top: 2.5px;
    left: 10px;
    height: 15px;
    width: 15px;
    background-color: #eee;
    border-radius: 20%;
}

/* On mouse-over, add a grey background color */
.container-coupon-btns:hover input ~ .checkmark-coupon-btns {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container-coupon-btns input:checked ~ .checkmark-coupon-btns {
    background-color: #ff6800;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark-coupon-btns:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.container-coupon-btns input:checked ~ .checkmark-coupon-btns:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.container-coupon-btns .checkmark-coupon-btns:after {
    top: 4px;
    left: 4px;
    width: 7px;
    height: 7px;
    border-radius: 20%;
    background: white;
}

/* End of Custom Radio Button */

/* Payment Method Styling */
.payment-method-ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
    margin-left: 0px !important;
}

.payment-method-li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

/* Change the link color on hover */
.payment-method-li a:hover {
    background-color: #555;
    color: white;
}

.payment-method-li a:active {
    background-color: #fff;
    color: #5c5c5c;
}

/* End Payment Method Styling */

/* Payment Method Tabs Styling */
/* Style the tab */
div.tabcheckout {
    float: left;
    width: 20%;
    height: 350px;
}

/* Style the buttons inside the tab */
div.tabcheckout button {
    display: block;
    background-color: inherit;
    color: #5c5c5c;
    padding: 10px 16px;
    width: 100%;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-size: 14px;
    border: none;
    border-bottom: 1px solid #ddd;
    word-wrap: break-word;
}

/* Change background color of buttons on hover */
div.tabcheckout button:hover {
    background-color: #ddd;
}

/* Create an active/current "tab button" class */
div.tabcheckout button.active {
    background-color: #ff6800;
    border: none !important;
    color: #fff;
}

/* Style the tab content */
.tabcontent {
    float: left;
    padding: 0px 12px;
    width: 80%;
    border-left: none;
}

.checkout-cardno-box {
    border: 1px solid #b5bbc8;
    border-radius: 4px;
}

.checkout-bankdetails {
    border-color: #fff;
    background-color: powderblue;
    color: #5c5c5c;
    border-radius: 4px;
    box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-bottom: 20px;
    padding: 5px 20px;
}

.checkout-rewardspoints {
    border-color: #fff;
    background-color: beige;
    color: #5c5c5c;
    border-radius: 4px;
    padding: 5px 20px;
    font-size: 13px;
    font-weight: 600;
}

/* Footer New Style Social Icons */
.footer-social-icons {
    opacity: 1;
}

.footer-social-icons:hover {
    opacity: 0.8;
}
/* End Footer New Style Social Icons */

/* Home Page Text Content */
.homepage-text-content-box {
    text-align: justify;
}

.homepage-text-content-head {
    font-weight: 600;
    font-size: 17px;
    color: #848484;
}

.homepage-text-content-body {
    font-weight: 400;
    color: #848484;
}

.homepage-left-right-menu-icons {
    color: orange;
    font-size: 20px;
}

.email-input-footer {
    height: 25px;
    width: 60%;
    font-size: 14px;
    padding: 0 10px;
    display: inline-block;
}

.best-brands-slide {
    height: auto;
}

.service-three-lgmdsm {
    margin-top: 13px;
    width: 50%;
    float: right;
}

/* Pagination Styling */
.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 0px 0;
    border-radius: 4px;
}

.pagination > li > a,
.pagination > li > span {
    position: relative;
    float: left;
    padding: 3px 7px;
    margin: 0px 3px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #444;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #444;
    border-radius: 2px;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    z-index: 2;
    color: #444;
    background-color: #bbb;
    border-color: #bbb;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #444;
    border-color: #444;
}

.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
    color: #777;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #bbb;
}
/* Pagination Styling End */

.filter-heads-style {
    border-bottom: 1px solid #eee;
    background-color: #fff;
    margin-bottom: 15px;
}

.no-padding-set {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.filter-heads-heading {
    color: #ff6800;
    font-family: lato;
    font-size: 14px;
    text-align: center !important;
}

/** STYLED CHECKBOX **/         /***WORKED***/
/* The container */
.container-filters {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    margin-right: 50px;
    cursor: pointer;
    font-family: lato !important;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.container-filters input {
    position: absolute;
    opacity: 0;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 1px;
    left: 0;
    height: 17px;
    width: 17px;
    border: 1px solid grey;
    border-radius: 5px;
    background-color: #fff;
}

/* On mouse-over, add a grey background color */
.container-filters:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container-filters input:checked ~ .checkmark {
    background-color: #fff;
    border: none;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container-filters input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.container-filters .checkmark:after {
    left: 4px;
    top: 1px;
    width: 6px;
    height: 11px;
    border: solid #ff6800;;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/** END HERE **/

/* Filters Text */
.filters-text {
    font-family: lato !important;
    font-size: 14px !important;
    color: #5c5c5c !important;
}
/* END HERE */

/** PRICE RANGE INPUT FIELD **/
.price-range-input {
    border-radius: 0;
    border: 1px solid #bbb;
    height: 30px;
}
/** END HERE**/

/* Small Screens (MOBILES SPECIFICALLY) Display Settings */
@media (max-width: 767px) {
    .homepage-text-content-body-xs {
        font-size: 8px;
    }
    
    .home-top-seller-stars {
        color: #ffcc00;
        font-size: 14px !important;
        padding-top: 5px;
    }

    .user-coupons-img-xs {
        border-radius: 500px !important;
        margin-bottom: 10px;
        opacity: 1;
        margin-left: 0px;
    }

    .homepage-text-usernav-xs {
        font-size: 6px;
    }

    .home-user-nav {
        font-size: 8px;
    }

    .homepage-text-content-head-xs {
        font-size: 12px;
    }

    .homepage-header-text-xs {
        font-size: 6px;
        line-height: 1.6;
    }

    .homepage-header-r-text-xs {
        font-size: 9px;
        line-height: 1.6;
    }

    .topfooter-text-xs {
        font-size: 10px;
    }

    .homepage-header-icons-xs {
        font-size: 10px;
    }

    .right-menu-xs {
        padding-top: 20px;
        padding-bottom: 0;;
    }

    .right-menu-xs a {
        color: #FFF;
        position: relative;
        bottom: 10px;
        padding: 0 10px;
        margin-left: 20px;
    }

    .left-menu-log-xs {
        padding-top: 30px;
        padding-bottom: 10px;
        text-align: right;
        font-size: 9px;
    }

    .right-menu-align-xs {
        margin-left: -65px;
        width: 355px;
        overflow: hidden !important;
    }

    .dealer-sub-panel-pos {
        padding: 0 0 0 0;
    }

    .dealer-xs-panel-margin {
        margin-top: 20px;
    }

    /*******Main Slider****************/
    #main-slider .item img{
        display: block;
        width: 100%;
        height: 150px;
    }

    #body-banner {
        height: 150px;
        position: relative;
    }

    .main-logo-col {
        width: 20%;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        float: left;
    }

    .main-logo-offset {
        margin-left: 4.555555%;
    }

    #footer-middle ul.list-unstyled > li > a{
        color: black;
        width: 100%;
        font-size: 10px;
    }

    .middlefooter-headings-xs {
        font-size: 11px;
        margin-bottom: 2.5px;
    }

    .contactus-section-xs {
        font-size: 10px;
    }

    .bottomfooter-xs-text {
        font-size: 7px;
    }

    .bottomfooter-icons-xs {
        width: 20px;
    }

    .contact-us-icons-xs {
        width: 40px;
    }

    /* CONTACT US FIELDS */
    .contact-us-textfield {
        width: 100% !important;
    }

    .contactus-mainbody {
        width: 100% !important;
    }
    /* CONTACT US FIELDS */

    .uppertopfooter-text-xs {
        font-size: 10px !important;
    }

    .upperfooter-pmimg-xs {
        width: 50px !important;
        margin-left: -15px;
    }

    .btn-learn-more-xs {
        margin-top: 10px;
        padding: 0px 15px;
        font-size: 8px;
        font-weight: 400;
        line-height: 1.5;
        border-radius: 8px;
    }

    .btn-subscribe-upperfooter-xs {
        position: relative;
        display: inline-block;
        padding: 0px 15px;
        font-size: 9px;
        font-weight: 400;
        line-height: 1.5;
        border-radius: 8px;
    }

    .email-input-footer-xs {
        height: 15px;
        width: 80%;
        font-size: 8px;
        padding: 0 10px;
        display: inline-block;
    }

    .middlefooter-li-xs {
        line-height: 1.1;
    }

    .best-brands-head-xs {
        font-size: 12px;
    }

    .headerrow-desc {
        left: 0px !important;
    }

    .navbar-nav .open .dropdown-menu {
        position: static !important;
        float: none;
        width: 10px !important;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .banner-search-xs {
        font-size: 10px;
    }

    .banner-searchbar-xs {
        width: 150px;
        height: 17.5px;
        font-size: 7px;
    }

    .search-form-xs {
        height: 100%;
        background-color: rgba(4, 4, 4, 0.7);
        position: absolute;
        right:0;
        top: 0;
        z-index: 5;
        max-width: 450px;
    }

    .search-form-xs > form{
        padding: 0px;
        margin-top: 0px;
    }

    .search-button-xs {
        padding: 3px 8px;
        font-size: 6px;
    }

    .services-img-xs {
        width: 40%;
    }

    .services-text-xs {
        font-size: 8px;
    }

    .services-body-xs {
        font-size: 7px;
    }

    .services-box-xs {
        background-color: #5c5c5c;
        border-radius: 10px;
        text-align: center;
        padding: 5px;
        min-height: 70px;
        margin: 0px;
    }

    #makebox-section2 {
        margin: 30px 30px 30px 30px;
    }

    .review-bar-xs {
        font-size: 8px;
        line-height: 1;
    }

    .best-brands-slide-xs { /* A little fault is occuring in resizing shifts */
        height: 130px;
        margin-bottom: 0;
    }

    #stock-brands {
        margin-bottom: 10px;
        text-align: center;
    }

    .row-xs {
        margin-right: -15px;
        margin-left: -15px;
    }

    .quote-xs-margin {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .service-message-xs {
        background-color: #ff6800;
        height: 90px;
        color: #FFF;
    }

    .service-message-xs-body {
        font-size: 10px;
    }

    .service-three-xs {
        margin-top: 10px;
        width: 75%;
    }

    .service-twoimg-xs {
        width: 60%;
    }

    .popular-imgs-xs {
        width: 100px;
        height: 100px;
    }

    #categories-section img{
        height: 116px !important; /** 80px previously **/
        width: 177px !important; /** 100% previously **/
        /** background-color: lightgrey; **/
        margin-bottom: 10px;
    }

    #popular-categories-section img{
        height: 80px !important; /** 80px previously **/
        width: 100% !important; /** 100% previously **/
        /** background-color: lightgrey; **/
        margin-bottom: 10px;
    }

    .categories-textheads-xs {
        font-size: 12px;
    }

    .subcategories-textheads-xs {
        font-size: 10px;
        margin-left: -20px;
    }

    .btn-xxs,
    .btn-group-xxs > .btn {
        padding: 2.5px 5px;
        font-size: 7px;
        line-height: 1;
        border-radius: 2px;
    }

    .thumbnail-xs {
        display: block;
        padding: 4px;
        margin-bottom: 20px;
        line-height: 1.42857143;
        background-color: #fff;
        border: none;
        border-radius: 4px;
        -webkit-transition: border .2s ease-in-out;
        -o-transition: border .2s ease-in-out;
        transition: border .2s ease-in-out;
    }

    .products-name-xs {
        margin-top: 0;
        margin-bottom: 0;
        font-size: 10px;
        text-align: center;
    }

    #products-section img{
        width: 100%;
        height: 90px;
    }

    .xs-offset {
        display: block;
        margin: auto !important;
        margin-top: 5px !important;
        margin-bottom: 10px !important;
    }

    .xs-margin-top-20 {
        margin-top: 20px;
    }

    .xs-select-radius {
        border-radius: 6px;
    }

    .login-page-text {
        line-height: 1.5;
    }

    .pm-top-bar-xs {
        background-color: #f99b20;
        display: inline-block;
        width: 50px !important;
        height: 100px !important;
        z-index: 3;
        position: relative;
    }

    .logo-abb-text-xs {
        font-size: 26px;
        color: #fff;
        font-weight: 900;
        vertical-align: middle !important;
        text-align: center;
        font-family: "Lato Black";
        padding-top: 32.5px;
    }

    .top-layout-col-xxsmall {
        background-color: #f5f5f5;
        width: 100% !important;
        height: 25px !important;
        padding: 0 0px 0 0px;
    }

    .new-rating-div-xs {
        width: 100% !important;
        height: 155px !important;
        border-radius: 4px !important;
        margin: 30px 2.5px !important;
        background: rgb(76,31,0); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(76,31,0,1) 0%, rgba(109,45,0,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(76,31,0,1) 0%,rgba(109,45,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(76,31,0,1) 0%,rgba(109,45,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c1f00', endColorstr='#6d2d00',GradientType=0 ); /* IE6-9 */
    }

    .fb-box-div-xs {
        width: 100% !important;
        margin: 0px 2.5px !important;
    }

    .search-bar-icon-xs {
        color: black;
        font-weight: 900;
        font-size: 35px;
        z-index: 999;
        padding-top: 30px;
        margin-bottom: 0;
    }

    .user-signed-txt {
        font-size: 8px;
        text-align: center;
        color: black;
        margin-top: 5px;
    }

    .navbar {
        background-color: #444;
        border: none;
        height: 100%;
        padding-left: 0px !important;
        font-weight: 600;
    }

    .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
        background-color: #5c5c5c;
        color: #fff;
        width: 100% !important;
    }

    .dropdown-menu {
        min-width: 100% !important;
    }

    .navbar-default .navbar-nav > li > a {
        color: #fff;
        width: 100% !important;
        overflow-wrap: break-word;
        margin-top: 0;
        padding-top: 5px;
        padding-bottom: 2.5px;
        text-align: left !important;
        text-transform: uppercase;
        font-size: 11px;
        font-weight: 900;
    }

    .mega-dropdown-menu > li > ul > li > a {
        display: flex;
        color: #fff;
        padding: 3px 5px;
        font-size: 11px !important;
        text-transform: uppercase !important;
    }

    .mega-dd-see-all-txt {
        font-size: 11px !important;
        text-transform: uppercase !important;
        color: #f39a0d !important;
    }

    .mega-dd-see-all-txt:hover {
        font-size: 11px !important;
        color: #ff6800 !important;
        text-transform: uppercase !important;
        text-decoration: none;
    }

    .mega-dd-hr-margin {
        margin-top: 5px !important;
        margin-bottom: 2.5px !important;
    }

    .navbar-nav .open .dropdown-menu {
        background-color: #333 !important;
    }

    .navbar-nav>li>.dropdown-menu {
        border-radius: 0 !important;
    }

    .order-track-xs-div {
        padding-right: 20px;
        padding-left: 20px;
        margin-bottom: 20px;
    }

    .service-row-pad-xs {
        padding: 0 25px;
    }

    .pgdesc-toprat-pos-2 {
        position: relative;
        top: 4px;
        padding: 1px 15px;
    }

    .tagline-bartxt-xs {
        font-size: 9px !important;
        color: #f99b20;
        position: relative;
        top: -1.60px;
        text-align: right;
        padding: 0 !important;
    }

    /* The Modal (background) */
    .modal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 2147483647; /* Sit on top */
        padding-top: 0; /* Location of the box */
        padding-bottom: 0; /* Location of the box */
        padding-right: 20px;
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        overflow-x: auto;
        overflow-y: auto;
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
    }

    /* Modal Content */

    .review-form-modal-content {
        display: block;
        position: relative;
        background-color: #f5f5f5;
        margin: auto;
        padding: 0;
        border: 1px solid #888;
        width: 100%;
        border-radius: 8px !important;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s

    }

    /* Add Animation */
    @-webkit-keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    @keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    /* The Close Button */
    .close {
        color: #ddd;
        opacity: 0.8;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }

    .close:hover,
    .close:focus {
        opacity: 1;
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

    .review-form-modal-header {
        padding: 6px 8px;
        background-color: #444;
        color: #fff;
        border: none;
        margin-bottom: 10px;
        border-top-right-radius: 8px !important;
        border-top-left-radius: 8px !important;
    }

    .review-form-modal-body {padding: 4px 16px;}

    .review-form-modal-footer {
        padding: 2px 8px;
        background-color: inherit;
        color: #444;
        border-radius: 6px;
    }

    /* End of modal box */

    /* The Filters Modal (background) */
    .modalfilter {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 2147483647; /* Sit on top */
        padding-top: 0; /* Location of the box */
        padding-bottom: 0; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        overflow-x: auto;
        overflow-y: auto;
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
    }

    /* Modal Content */

    .filter-modal-content {
        display: block;
        position: relative;
        background-color: #fff;
        margin: auto;
        padding: 0;
        border: 1px solid #888;
        width: 100%;
        border-radius: 8px !important;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s

    }

    /* Add Animation */
    @-webkit-keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    @keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    /* The Close Button */
    .filters-close {
        color: #ddd;
        opacity: 0.8;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }

    .filters-close:hover,
    .filters-close:focus {
        opacity: 1;
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

    .filter-modal-header {
        padding: 6px 8px;
        background-color: #444;
        color: #fff;
        border: none;
        margin-bottom: 10px;
        border-top-right-radius: 8px !important;
        border-top-left-radius: 8px !important;
    }

    .filter-modal-body {padding: 4px 16px;}

    .filter-modal-footer {
        padding: 2px 8px;
        background-color: inherit;
        color: #444;
        border-radius: 6px;
    }

    /* End of filters modal box */

    /** Modal Content for Build a Bundle **/
    /* The Modal (background) */
    .bundlemodal {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 2147483647; /* Sit on top */
        padding-top: 0; /* Location of the box */
        padding-bottom: 0; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        overflow-x: auto;
        overflow-y: auto;
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
    }

    .build-bundle-modal-content {
        display: block;
        position: relative;
        background-color: #fff;
        margin: auto;
        padding: 0;
        border: 1px solid #888;
        border-radius: 8px;
        width: 100%;
        z-index: 999 !important;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s

    }

    /* Add Animation */
    @-webkit-keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    @keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    /* The Close Button */
    .closebundle {
        color: #ddd;
        opacity: 0.8;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }

    .closebundle:hover,
    .closebundle:focus {
        opacity: 1;
        color: black !important;
        text-decoration: none;
        cursor: pointer;
    }

    .build-bundle-modal-header {
        padding: 15px 30px;
        background-color: #fff;
        color: black;
        border: none;
        margin-bottom: 10px;
        font-size: 20px;
        font-family: "Lato Medium";
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }

    .build-bundle-modal-body {
        padding: 4px 16px;
        border-radius: 8px !important;
    }

    .build-bundle-modal-footer {
        padding: 2px 8px;
        background-color: inherit;
        color: #444;
        border-radius: 6px;
    }

    .bundle-inner-thumbnail {
        display: inline-block;
        border: 2px solid #ddd;
        border-radius: 6px;
        position: relative;
        left: 10px;
        width: 125px;
        height: 125px;
        margin-left: 0px !important;
        margin-bottom: 5px;
    }

    .bundle-inner-thumbnail:hover {
        border: 3px solid #ff6800;
        cursor: pointer;
    }

    .bundle-inner-arrow-up {
        top: 100px;
        width: 100px;
        height: 100px;
        border-left: 15px solid transparent !important;
        border-right: 15px solid transparent !important;
        border-bottom: 15px solid #ff6800 !important;
    }

    .buildabundle-thumbnail {
        display: inline-block;
        border: 2px solid #ddd;
        border-radius: 6px;
        width: 100px;
        height: 100px;
        margin-left: 0px !important;
        padding: 5px;
    }

    .buildabundle-thumbnail:hover {
        border: 3px solid #ff6800;
        cursor: pointer;
    }

    .col-innerbundle-thumbnail {
        width: 110px;
        position: relative;
        display: inline-block;
        min-height: 1px;
        padding-right: 5px;
        padding-left: 5px;
        margin: 0 5px;
    }

    .partdetailsinfo {
        font-family: Helvetica;
        font-size: 12px;
        color: #333333;
        float: left;
        font-weight: 600;
        left: 0 !important;
    }

    .partdetailsinfo2 {
        font-family: Helvetica;
        font-size: 12px;
        color: #333333;
        float: left;
        font-weight: 600;
        line-height: 10px;
        left: 0 !important;
    }

    .tabcontent {
        float: left;
        width: 100%;
        border-left: none;
        padding: 0;
    }

    div.tabcheckout {
        float: left;
        width: 100%;
        height: 150px;
    }

    .checkout-seccode-xs {
        position: relative;
        left: 15px;
    }

    .checkout-cardno-box {
        width: 85% !important;
    }

    .xs-parts-dis-gap {
        margin-bottom: 20px;
    }



}

.checkout-border {
    border-bottom: 1px solid #ddd;
}

.pm-top-bar-sm {
    background-color: #f99b20;
    display: inline-block;
    width: 65px !important;
    height: 105px !important;
    z-index: 3;
    position: relative;
}

.logo-abb-text-sm {
    font-size: 26px;
    color: #fff;
    font-weight: 900;
    vertical-align: middle !important;
    text-align: center;
    font-family: "Lato Black";
    padding-top: 32.5px;
}

.zero-padding {
    padding: 0;
}

.zero-margin {
    margin: 0;
}

.bundle-parts-price-head {
    margin-bottom: 0;
    color: #444;
    font-size: 14px;
}

.bundle-parts-org-price {
    font-size: 13px;
    color: #444;
}

.top-layout-col-small {
    background-color: #f5f5f5;
    width: 100%;
    height: 25px;
    padding: 0 275px 0 70px;
}

.top-layout-cellxs {
    background-color: #f5f5f5;
    width: 100%;
    height: 15px;
}

/** STYLING NEW CART **/
.carty-dealer-box {
    border: 2px solid #ddd;
}

.carty-dealer-title {
    color: grey;
}

.new-chkout-btn {
    border-radius: 2px !important;
    border: 1px solid #f0ad4e !important;
    margin-top: 5px;
    margin-bottom: 10px;
    padding: 5px 20px !important;
    background: rgb(255,157,71)!important; /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,157,71,1) 1%, rgba(255,104,0,1) 99%)!important; /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,157,71,1) 1%,rgba(255,104,0,1) 99%)!important; /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,157,71,1) 1%,rgba(255,104,0,1) 99%)!important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9d47', endColorstr='#ff6800',GradientType=0 )!important; /* IE6-9 */
}

.freight-fields {
    padding: 5px;
    text-align: center !important;
    border: 1px solid #eee !important;
    width: 100px;
    margin-left: 5px !important;
}
/** SEARCH ICON IN INPUT FIELD **/

/* enable absolute positioning */
.inner-addon {
    position: relative;
}

/* style icon */
.inner-addon .glyphicon {
    position: absolute;
    padding: 0px;
    pointer-events: none;
}

/* align icon */
.top-addon .glyphicon  { top: -10px;}
.left-addon .glyphicon  { left:  10px;}
.right-addon .glyphicon { right: 10px;}

/* add padding  */
.left-addon input  { padding-left:  10px; }
.right-addon input { padding-right: 10px; }

.search-bar-icon {
    color: #fff;
    font-weight: 900;
    font-size: 32px;
    z-index: 999;
}
/** END HERE **/

/** NEW STYLE RATING BOX HOME **/

.br-theme-fontawesome-stars .br-widget a.br-selected:after {
    color: #FFCC00;
    font-size: 25px;
}

.br-theme-fontawesome-stars .br-widget a:after {
    color: #d2d2d2;
    font-size: 25px;
}

/** END HERE **/

/** NEW SIDE PANELS **/
.benefit-box-one {
    width: 105%;
    height: 155px;
    border-radius: 2px;
    margin: 0px 0px 1px 0px;
    background: rgb(43,0,32); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(43,0,32,1) 0%, rgba(73,0,55,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(43,0,32,1) 0%,rgba(73,0,55,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(43,0,32,1) 0%,rgba(73,0,55,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b0020', endColorstr='#490037',GradientType=0 ); /* IE6-9 */
}

.benefit-one-head {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding: 10px;
    background-color: purple;
    text-align: center;
    margin-bottom: 0;
    position: relative;
    top: 10px;
}

.benefit-one-body-txt {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding-top: 15px;
    text-align: left;
}

.benefit-box-two {
    width: 105%;
    height: 155px;
    border-radius: 2px;
    margin: 0px 0px 1px 0px;
    background: rgb(16,0,51); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(16,0,51,1) 0%, rgba(23,0,71,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(16,0,51,1) 0%,rgba(23,0,71,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(16,0,51,1) 0%,rgba(23,0,71,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#100033', endColorstr='#170047',GradientType=0 ); /* IE6-9 */
}

.benefit-two-head {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding: 5px 10px;
    background-color: midnightblue;
    text-align: center;
    margin-bottom: 0;
    line-height: 1;
}

.benefit-two-body-txt {
    font-size: 13px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding-top: 17.5px;
    text-align: left;
}

.benefit-box-three {
    width: 105%;
    height: 175px;
    border-radius: 2px;
    margin: 0px 0px 1px 0px;
    background: rgb(150,0,0); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(150,0,0,1) 0%, rgba(66,0,1,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(150,0,0,1) 0%,rgba(66,0,1,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(150,0,0,1) 0%,rgba(66,0,1,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#960000', endColorstr='#420001',GradientType=0 ); /* IE6-9 */
}

.benefit-three-head {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding: 10px;
    background-color: #dd0000;
    text-align: center;
    margin-bottom: 0;
    line-height: 1;
}

.benefit-three-body-txt {
    font-size: 13px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding-top: 17.5px;
    text-align: center;
}

.benefit-box-four {
    width: 105%;
    height: 155px;
    border-radius: 2px;
    margin: 0px 0px 1px 0px;
    background: rgb(163,163,0); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(163,163,0,1) 0%, rgba(61,61,0,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(163,163,0,1) 0%,rgba(61,61,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(163,163,0,1) 0%,rgba(61,61,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3a300', endColorstr='#3d3d00',GradientType=0 ); /* IE6-9 */
}

.benefit-four-head {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding: 10px;
    background-color: #aaaa00;
    text-align: center;
    margin-bottom: 0;
    line-height: 1;
    position: relative;
    top: 7px;
}

.benefit-four-body-txt {
    font-size: 13px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding-top: 17.5px;
    text-align: left;
}

/** END HERE **/

.pm-top-bar {
    background-color: #f99b20;
    display: inline-block;
    width: 100px;
    height: 205px;
    z-index: 3;
    position: relative;
}

.breadcrumb {
    background-color: #fff !important;
    border-bottom: 1px solid #eee !important;
}

.breadcrumb > li> a {
    color: #666 !important;
    font-weight: 900 !important;
}

.breadcrumb > li> a:hover {
    color: #bbb !important;
    text-decoration: none !important;
    font-weight: 900 !important;
}

.breadcrumb > li.active {
    color: #aaa !important;
    text-decoration: none !important;
    font-weight: 900 !important;
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 0 !important;
    }

    .mega-dropdown-menu > li > ul > li > a {
        display: block;
        color: #444 !important;
        padding: 3px 5px;
    }

    .mega-dropdown-menu > li > ul > li > a:hover {
        display: block;
        color: #fff !important;
        padding: 3px 5px;
    }

    .dropdown-menu {
        left: 200px !important;
        border-top: 6px solid #444;
        border-radius: 0 !important;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
    }
}

.logout-dd-btn {
    background-color: #f3b72e;
    padding: 15px 12.5px !important;
    font-weight: 900;
    text-align: center;
    border-radius: 4px;
    color: #fff !important;
}
.logout-dd-btn:hover {
    background-color: #f39a0d;
}

.user-panel-blocks {
    border-radius: 4px;
    border: 1px solid #ddd;
    padding: 5px 15px;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    width: 45% !important;
    vertical-align: middle;!important;
    height: 100px !important;
    display: block;
}

.user-panel-blocks:hover {
    border-radius: 4px;
    border: 2px solid #ff6800;
    padding: 5px 15px;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    width: 45% !important;
    vertical-align: middle;!important;
    height: 100px !important;
    display: block;
}

.user-panel-blocks-active {
    border-radius: 4px;
    border: 1px solid #ff6800;
    background-color: #ff6800;
    padding: 5px 15px;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    width: 45% !important;
    vertical-align: middle;!important;
    height: 100px !important;
}

.user-panel-nav-txt {
    line-height: 1;
    margin-top: 5px;
}

.user-panel-nav-links {
    color: black;
    text-decoration: none;
}

.user-panel-nav-links:hover {
    color: black;
    text-decoration: none;
}

.user-panel-nav-links-active {
    color: #fff;
    text-decoration: none;
}

.user-panel-nav-links-active:hover {
    color: #fff;
    text-decoration: none;
}

/** FOR SMALLER SCREENS **/
.user-panel-blocks-xs {
    border-radius: 4px;
    border: 1px solid #ddd;
    padding: 5px 0px;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    width: 45% !important;
    vertical-align: middle;!important;
}

.user-panel-blocks-xs:hover {
    border-radius: 4px;
    border: 1px solid #ff6800;
    padding: 5px 0px;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    width: 45% !important;
    vertical-align: middle;!important;
}

.user-panel-blocks-xs-active {
    border-radius: 4px;
    border: 1px solid #ff6800;
    background-color: #ff6800;
    padding: 5px 0px;
    margin-bottom: 10px;
    margin-right: 10px;
    text-align: center;
    width: 45% !important;
    vertical-align: middle;!important;
}

.user-panel-nav-txt {
    line-height: 1;
    margin-top: 5px;
}

.user-panel-nav-links {
    color: black;
    text-decoration: none;
}

.user-panel-nav-links:hover {
    color: black;
    text-decoration: none;
}

.user-panel-nav-links-active {
    color: #fff;
    text-decoration: none;
}

.user-panel-nav-links-active:hover {
    color: #fff;
    text-decoration: none;
}
/** END HERE **/

/** TABLET SCREEN SETTINGS **/
@media (min-width: 768px) {
    .new-rating-div-sm {
        width: 110%;
        height: 155px;
        border-radius: 2px;
        margin: 30px 0px 30px -12.5px;
        background: rgb(76,31,0); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(76,31,0,1) 0%, rgba(109,45,0,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(76,31,0,1) 0%,rgba(109,45,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(76,31,0,1) 0%,rgba(109,45,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c1f00', endColorstr='#6d2d00',GradientType=0 ); /* IE6-9 */
    }

    #contact-us-section ul.list-unstyled > li{
        width: 100% !important;
    }

    #service-section-xs {
        color: #FFF;
        background-color: #333;
        padding: 15px 20px 15px 20px;
        display: block;
        position: relative;
        top: -20px;
        z-index: 1000;
        width: 100%;
        height: 120px;
        margin-bottom: 0;
    }

    #service-section-xs a {
        color: #FFF;
        text-decoration: none;
    }

    .xs-service-div-border {
        border-right: 1px solid #eee;
    }

    .service-row-pad-sm {
        padding: 0 50px;
    }

    .form-horizontal .control-label {
        text-align: left !important;
    }

    #main-slider .item img{
        display: block;
        margin: auto;
        width: 100%;
        height: 325px; /*345px to be set */
        border-top: 3px solid #444;
        border-bottom: 3px solid #444;
    }

    #body-banner {
        height: 300px; /*ORIGINALLY 450PX*/ /* previously set at 350px; */
        position: relative;
    }

    .navbar-default .navbar-nav > li > a {
        color: #fff;
        width: 100% !important;
        overflow-wrap: break-word;
        margin-top: 0;
        padding-top: 5px;
        padding-bottom: 2.5px;
        text-align: left !important;
        text-transform: uppercase;
        font-size: 11px;
        font-weight: 900;
    }

    .mega-dropdown-menu > li > ul > li > a {
        display: block;
        color: #fff !important;
        padding: 3px 5px;
        font-size: 11px !important;
        text-transform: uppercase !important;
    }

    .mega-dd-see-all-txt {
        font-size: 11px !important;
        text-transform: uppercase !important;
        color: #f39a0d !important;
    }

    .mega-dd-see-all-txt:hover {
        font-size: 11px !important;
        color: #ff6800 !important;
        text-transform: uppercase !important;
        text-decoration: none;
    }

    .mega-dd-hr-margin {
        margin-top: 5px !important;
        margin-bottom: 2.5px !important;
    }

    .navbar-nav .open .dropdown-menu {
        background-color: #333 !important;
    }

    .navbar-nav>li>.dropdown-menu {
        border-radius: 0 !important;
    }

    .navbar {
        padding-left: 0 !important;
    }

    .top-userlog-txt {
        overflow-wrap: break-word;
        color: black;
        font-size: 10px;
        line-height: 1;
        text-decoration: none;
        padding-top: 0.75px;
    }

    .top-userulog-txt {
        overflow-wrap: break-word;
        color: black;
        font-size: 10px;
        line-height: 1;
        padding-top: 2.75px;
    }

    .top-layout-cellsm {
        background-color: #f5f5f5;
        width: 100%;
        height: 20px;
    }

    .pgdesc-toprat-pos {
        width: 20% !important;
    }

    .pgdesc-toprat-pos-2 {
        width: 13% !important;
        position: relative;
        top: 3.25px;
        padding: 1px;
    }

    .order-track-sm-div {
        padding-right: 20px;
        padding-left: 20px;
        margin-bottom: 20px;
    }

    /* The Filters Modal (background) */
    .modalfilter {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 2147483647; /* Sit on top */
        padding-top: 50px; /* Location of the box */
        padding-bottom: 50px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        overflow-x: auto;
        overflow-y: auto;
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
    }

    /* Modal Content */

    .filter-modal-content {
        display: block;
        position: relative;
        background-color: #fff;
        margin: auto;
        padding: 0;
        border: 1px solid #888;
        width: 80%;
        border-radius: 8px !important;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s

    }

    /* Add Animation */
    @-webkit-keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    @keyframes animatetop {
        from {top:-300px; opacity:0}
        to {top:0; opacity:1}
    }

    /* The Close Button */
    .filters-close {
        color: #ddd;
        opacity: 0.8;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }

    .filters-close:hover,
    .filters-close:focus {
        opacity: 1;
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

    .filter-modal-header {
        padding: 6px 8px;
        background-color: #444;
        color: #fff;
        border: none;
        margin-bottom: 10px;
        border-top-right-radius: 8px !important;
        border-top-left-radius: 8px !important;
    }

    .filter-modal-body {padding: 4px 16px;}

    .filter-modal-footer {
        padding: 2px 8px;
        background-color: inherit;
        color: #444;
        border-radius: 6px;
    }

    /* End of filters modal box */

    #home-rating-box {
        border: 1px solid #444444;
        padding: 10px 15px;
        width: 22.5% !important;
        margin: 5px 10px 15px;
        height: 85px;
        border-radius: 4px;
        margin-left: 0px !important;
        background-color: #444444;
        color: #ffffff;
    }

    #home-rating-box:hover {
        background-color: #ff6800;
        color: #ffffff;
        border: 1px solid #ff6800;
    }

}
/** END HERE **/


/** FOR LAPTOPS ONLY **/
/** FOR CORRECTION OF RATING PANEL ON HOME PAGE **/
@media (min-width: 992px) {
    .new-rating-div {
        width: 110%;
        height: 155px;
        border-radius: 2px;
        margin: 30px 0px 30px -12.5px;
        background: rgb(76,31,0); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(76,31,0,1) 0%, rgba(109,45,0,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(76,31,0,1) 0%,rgba(109,45,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(76,31,0,1) 0%,rgba(109,45,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c1f00', endColorstr='#6d2d00',GradientType=0 ); /* IE6-9 */
    }

    .dealer-store-stars-pos {
        padding-left: 15px;
    }

    .avg-dealerrating-desc {
        font-family: Calibri !important;
        color: #d2d2d2 !important;
        font-size: 22px !important;
        top: -5px;
        margin-left: -140px !important;
    }

    .fb-box-div {
        width: 110%;
        border-radius: 2px;
        margin: 0px 0px 30px -12.5px;
    }

    .navbar {
        padding-left: 175px !important;
    }

    .navbar-nav .open .dropdown-menu {
        background-color: #fff !important;
    }

    .mega-dropdown-menu > li > ul > li > a {
        display: block;
        color: #444 !important;
        padding: 3px 5px;
        font-size: 11px !important;
        text-transform: uppercase !important;
    }

    .pgdesc-toprat-pos {
        width: 30% !important;
    }

    .pgdesc-toprat-pos-2 {
        width: 13% !important;
        position: relative;
        top: 5px;
        padding: 1px;
    }

    .pgdesc-toprat-pos-3 {
        padding: 0;
    }

    .order-track-sm-div {
    }
}
/** END HERE **/

#social-links > ul, ol {
    padding-left: 2.5px !important;
}

.inline-block-ele {
    display: inline-block;
}

.user-rating-pos {
    margin-top: -20px !important;
}

.user-bar-rating-pos {
    margin-top: -40px !important;
}

.user-rev-name-for {
    color: #999;
    font-size: 13px;
    font-weight: 600;
    padding-left: 15px;
    position: relative;
    top: -5px;
}

.user-rev-details-for {
    color: #999;
    font-size: 13px;
    position: relative;
    top: -5px;
}

.user-rev-star-for {
    font-size: 28px !important;
}

.rat-snp-colr-pos {
    position: relative;
    top: -5px;
}

.rat-snp-colr-pos-2 {
    position: relative;
    top: 0px;
}

/** MAIN LAY OUT PAGE CSS **/
.log-out-bartxt {
    font-size: 12px;
    color: #a1a1a1;
    padding-top: 3px !important;
    text-align: right;
    padding: 0;
}

.track-order-bartxt {
    font-size: 12px;
    color: #a1a1a1;
    padding-top: 3px !important;
    text-align: right;
    padding: 0;
}

.tagline-bartxt {
    font-size: 12px;
    color: #a1a1a1;
    padding-top: 3px !important;
    text-align: right;
    padding: 0;
}

.tagline-pos {
    padding-left: 42.5px;
}

.tagline-pos-sm {
    padding-left: 20.5px !important;
    position: relative;
    top: -2.5px;
}


.topbar-txt-clr {
    color: #a1a1a1;
}

.topbar-txt-clr:hover {
    color: #5c5c5c;
    text-decoration: none;
    cursor: pointer;
}

.top-main-bar {
    background-color: #fff;
    padding: 0 30px 0 70px;
}

.main-bar-logo {
    padding-top: 5px;
    z-index: 999 !important;
    margin-right: 0;
}

.main-bar-search-pos {
    padding: 25px 0px 0 20px;
}

.main-bar-search {
    background-color: #f5f5f5;
    border-radius: 0 !important;
    padding: 20px 10px !important;
    display: inline-block !important;
    width: 85% !important;
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

.main-bar-search-btn {
    display: inline-block !important;
    position: relative;
    top: 0px;
}

.main-bar-account {
    padding: 0;
    padding-top: 27.5px !important;
    height: 122px !important;
}

.main-bar-account-log {
    text-align: center !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

.main-bar-user-icon {
    margin-bottom: 0;
    text-align: center;
}

.main-bar-user-dd {
    left: -95px !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
    border-top: 1px solid #ddd !important;
    margin-top: 5px !important;
    min-width: 300px !important;
    padding-bottom: 0 !important;
    border-radius: 6px !important;
}

.main-bar-userbox-txt {
    font-size: 14px;
    color: black;
    padding-top: 12.5px;
}

.main-bar-username {
    font-size: 16px;
}

.user-dd-logout-box {
    padding: 20px 15px 10px 15px;
}

.user-dd-logout-txt {
    color: #fff !important;
    text-decoration: none;
}

.user-dd-options-col {
    padding: 10px 0 20px 0;
}

.user-dd-profile-col {
    margin-top: 20px;
    border-right: 1px solid #f5f5f5;
}

.user-dd-profile-txt {
    overflow-wrap: break-word;
    text-align: center;
    color: #393939;
}

.user-dd-profile-link {
    color: #393939;
    text-decoration: none !important;
}

.user-dd-rewards-col {
    margin-top: 20px;
}

.user-dd-footer {
    background-color: #f3f3f3;
    padding: 15px 15px !important;
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}

.user-dd-footer-txt {
    font-size: 12px;
    color:#848484;
    padding-left: 15px;
    line-height: 1.2;
    margin:0;
}

.user-dd-footer-txt-2 {
    font-size: 12px;
    color:#848484;
    padding-left: 15px;
    line-height: 1.1;
    margin:0;
}

.main-bar-garage {
    padding: 0px;
    padding-top: 26px !important;
    height: 122px;
}

.main-bar-garage-icon {
    margin-bottom: 0;
    text-align: center;
}

.main-bar-garage-txt {
    text-align: center;
    margin-top: 3px;
}

.main-bar-favorites {
    padding: 0px;
    padding-top: 30px !important;
    height: 122px;
}

.main-bar-fav-txt {
    text-align: center;
    line-height: 1;
    margin-top: 3px;"
}

.main-bar-cart {
    padding: 0px;
    padding-top: 28px !important;
    height: 122px;
}

.main-bar-cart-txt {
    text-align: center;
    line-height: 1.2;
    margin-top: 5px;
}

.main-bar-cart-link {
    color: black;
    line-height: 1;
}

.main-bar-orders {
    padding: 0px;
    padding-top: 30px !important;
    height: 122px;
}

.main-bar-orders-txt {
    text-align: center;
    line-height: 1;
    margin-top: 3px;
}

.main-bar-myaccount {
    padding: 0;
    padding-top: 45.5px;
    height: 122px;
}

.main-myacc-txt {
    text-align: center;
    margin-bottom: 0;
    line-height: 1;
}

.main-myacc-mini-txt {
    text-align: center;
    margin-top: 0;
    line-height: 1;
    font-size: 10px;
    color: #999;
}

.main-bar-reg {
    padding: 0px;
    padding-top: 30px !important;
    height: 122px;
}

.main-bar-reg-txt {
    text-align: center;
    line-height: 1;
    margin-top: 3px;
    color: black;
}

.main-bar-cart {
    padding: 0px;
    padding-top: 28px !important;
    height: 122px;
}

.main-bar-cart-txt {
    text-align: center;
    line-height: 1.2;
    margin-top: 5px;
}

/*Customize a bundle modal category image*/
.similer_category >img {
    width: 100%;
    padding-top: 17.5px;
}

.similar-category-frame {
    height: 180px !important;
    padding: 10px 35px;
    overflow-y: auto;
    margin-bottom: 20px;
}

.similar-category-qtyform {
    text-align:center;
    max-width: 55px;
    display: inline-block;
    margin: 0 auto;
    height: 20px;
    font-size: 12px;
    border: 1px solid #bbb;
    border-radius: 4px;
}

.xs-dealer-banner-img {
    height: 250px !important;
}

.dealer-rating-col {
    width: 12.5% !important;
}

.dealer-follow-inline {
    display: inline-block;
}

.dealer-follow-txt {
    padding-left: 10px;
}

.dealer-sub-panel {
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    margin-bottom: 20px;
    padding-bottom: 0;
}

.dealer-sub-panel-pos {
    padding: 10px 0 0 0;
}

.dealer-sub-panel-pos2 {
    padding: 7.5px 0 0 0;
}

.error-404-con {
    margin-top: 20px;
    margin-bottom: 20px;
}

.error-404-txt {
    font-size: 18px;
    text-align: center;
}

.projects-structure {
    display: inline-block;
    height: 350px !important;
    overflow-y: hidden;
    margin-bottom: 15px;
}

.project-desc-type {
    text-align: justify;
    padding-left: 15px;
    text-overflow: clip;
}

div.tabcheckout a.active {
    background-color: #ff6800;
    border: none !important;
    color: #fff;
}

div.tabcheckout a:hover {
    background-color: #ddd;
    text-decoration: none;
}
.tabcheckoutlinks{
    display: block;
    background-color: inherit;
    color: #5c5c5c;
    padding: 10px 16px;
    width: 100%;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-size: 14px;
    border: none;
    border-bottom: 1px solid #ddd;
    word-wrap: break-word;
}
div.tabcheckout a {
    display: block;
    background-color: inherit;
    color: #5c5c5c;
    padding: 10px 16px;
    width: 100%;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    font-size: 14px;
    border: none;
    border-bottom: 1px solid #ddd;
    word-wrap: break-word;
}

.red-color {
    color: red;
}

.cart-select-styling {
    padding: 4px;
    border-radius: 5px;
    border: 1px solid #d5d5d5;
    width: 85%;
    font-size: 12px;
    font-family: Helvetica;
}

.bundle-price-box {
    background-color: #f5f5f5;
    border-top: 1px solid #eee;
    font-size: 14px;
    color: #444;
    padding: 3.5px 10px;
}

.bundle-part-heading {
    margin-bottom: 2.5px;
}

.email-sub-btn {
    background-color: #ffcc00;
    margin-top: 4px;
    color: #444;
    padding: 0;
    border: 1px solid #ffa84c;
    border-radius: 6px;
    font-family: Calibri !important;
}

.email-sub-btn:hover {
    background-color: #ffa700;
    margin-top: 4px;
    color: #444;
    padding: 0;
    border: 1px solid #cc8500;
    border-radius: 6px;
    font-family: Calibri !important;
}

.home-shop-one {
    position: relative;
    height: auto;
    padding: 0 5px;
    overflow: hidden;
}

/* Create the overlay */
.home-shop-one::after {
    content: "";
    position: absolute;
    top: 0; left: 5px;
    width: 98.2%;
    height: 100%;
    background-color: #ff8800;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none; /* Keeps underlying content clickable */
    border-radius: 10px;
}

/* Show overlay on hover */
.home-shop-one:hover::after {
    opacity: 0.5; /* You can adjust intensity here */
    cursor: pointer;
}

/**.home-shop-one:hover {
    opacity: 0.8;
    cursor: pointer;
}**/

.home-shop-two {
    position: relative;
    height: auto;
    padding: 0 5px;
    overflow: hidden;
}

/* Create the overlay */
.home-shop-two::after {
    content: "";
    position: absolute;
    top: 0; left: 5px;
    width: 98.2%;
    height: 100%;
    background-color: #ff8800;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none; /* Keeps underlying content clickable */
    border-radius: 10px;
}

/* Show overlay on hover */
.home-shop-two:hover::after {
    opacity: 0.5; /* You can adjust intensity here */
    cursor: pointer;
}

/**.home-shop-two:hover {
    opacity: 0.8;
    cursor: pointer;
}**/

.home-shop-three {
    height: auto;
    opacity: 1;
    margin-top: 10px;
    padding: 0 5px;
}

.home-shop-three:hover {
    opacity: 0.8;
    cursor: pointer;
}

.home-shop-four {
    height: auto;
    opacity: 1;
    margin-top: 10px;
    padding: 0 5px;
}

.home-shop-four:hover {
    opacity: 0.8;
    cursor: pointer;
}

.home-shops-text-head {
    font-weight: 900;
    font-size: 24px;
    text-transform: uppercase;
    color: #444;
    font-family: lato;
}

.home-shops-head {
    margin-bottom: 20px;
    text-align: center;
}

.admin-order-details-panel {
    background-color: #ff7700 !important;
    color: #fff !important;
}

.shopping-cart-img {
    padding: 5px;
}

.shopping-cart-shipping {
    padding: 4px;
    border: 1px solid #d5d5d5;
    width: 85%;
    font-size: 12px;
    font-family: Helvetica;
}

.part-details-jssor1 {
    position: relative;
    margin: 0 auto;
    top: 0;
    left: 0;
    width: 800px;
    height: 1250px;
    overflow: hidden;
    visibility: hidden;
}

.part-details-jssorloading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.7);
}

.part-details-jssoruslides {
    cursor:default;
    position:relative;
    top:0;
    left:0;
    width:775px;
    height:850px;
    overflow:hidden;
}

.parts-details-jssornavigator {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 750px;
    height: 230px;
}

.parts-details-prototype {
    width: 190px;
    height: 210px;
}

.parts-details-arrow-left {
    width: 55px;
    height: 55px;
    top: 500px;
    left: 30px;
}

.parts-details-view-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.parts-details-arrow-right {
    width: 55px;
    height: 55px;
    top: 500px;
    right: 30px;
}

.parts-details-view-box-r {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.rating-dialog-txt-tt {
    padding-top: 10px;
}

.rewards-box-1-details {
    background-color: #f5f5f5;
    color:white;
    padding: 40px 10px;
    border-radius: 8px;
    margin-left: 50px;
}

.rewards-box-1-details:hover {
    background-color: #444444;
}

.signin-dash-user-text {
    font-size: 20px;
    font-weight: 999;
    font-family: lato;
    padding: 20px 10px 10px 10px;
}

.signin-dash-user-counts {
    font-size: 26px;
    font-weight:
    font-family: lato;
    padding: 10px 10px 10px 10px;
    text-align: center;
    float: right;
}

.signin-dash-user-nav > ul {
    list-style-type: none;
    margin: 0px 0px 0px;
    padding: 0;
    overflow: hidden;
}

.signin-dash-user-nav > li {
    float: left;
}

.signin-dash-user-nav > li a {
    display: block;
    color: #444444;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 14px;
    font-family: lato;
}

.signin-dash-user-nav > li a:hover:not(.active) {
    border-bottom: 3px solid #ff6800;
}

.signin-dash-user-nav-active {
    border-bottom: 3px solid #ff6800;
}

.signin-dash-user-nav-active:hover {
    border-bottom: none;
}

.signin-dash-user-nav-title {
    display: block;
    color: #444;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    border-right: 1px solid #f5f5f5;
}

.nav-tabs-user-profile {
    border-bottom: 1px solid #ddd;
}
.nav-tabs-user-profile > li {
    float: left;
    margin-bottom: -1px;
}
.nav-tabs-user-profile > li > a {
    margin-right: 0px;
    border: 1px solid transparent;
    border-radius: 0px 0px 0 0;
    padding: 14px 16px;
    color: #444444;
    background-color: #ffffff;
}
.nav-tabs-user-profile > li > a:hover {
    border-bottom: 3px solid #ff6800;
}
.nav-tabs-user-profile > li.active > a,
.nav-tabs-user-profile > li.active > a:hover,
.nav-tabs-user-profile > li.active > a:focus {
    color: #ff6800;
    cursor: default;
    background-color: #ffffff !important;
    border-bottom: 3px solid #ff6800 !important;
    border-bottom-color: transparent;
}


/* Small Screens (MOBILES SPECIFICALLY) Display Settings */
@media (max-width: 767px) {
    .signin-dash-user-counts {
        display: inline-block;
    }

    .dealer-store-stars-pos {
        padding-left: 0;
    }

    .avg-dealerrating-desc {
        font-family: Calibri !important;
        color: #d2d2d2 !important;
        font-size: 22px !important;
        top: -5px;
        margin-left: -100px !important;
    }

    .dealer-store-profile-pic {
        display: inline-block;
        width: 100px !important;
        height: 100px !important;
        margin-bottom: 20px !important;
        padding-left: 65px !important;
        border-radius: 500px;
        position: relative;
        top: -60px;
        left: 15px !important;
    }

    .home-shop-one {
        height: auto;
        opacity: 1;
        padding: 5px 5px;
    }

    .home-shop-one:hover {
        opacity: 0.8;
        cursor: pointer;
    }

    .home-shop-two {
        height: auto;
        opacity: 1;
        margin-top: 10px;
        padding: 5px 5px;
    }

    .home-shop-two:hover {
        opacity: 0.8;
        cursor: pointer;
    }

    .home-shop-three {
        height: auto;
        opacity: 1;
        margin-top: 10px;
        padding: 5px 5px;
    }

    .home-shop-three:hover {
        opacity: 0.8;
        cursor: pointer;
    }

    .home-shop-four {
        height: auto;
        opacity: 1;
        margin-top: 10px;
        padding: 5px 5px;
    }

    .home-shop-four:hover {
        opacity: 0.8;
        cursor: pointer;
    }

    .home-shops-text-head {
        font-weight: 900;
        font-size: 24px;
        text-transform: uppercase;
        color: #444;
        font-family: lato;
    }

    .home-shops-head {
        margin-bottom: 20px;
        text-align: center;
    }

    .home-top-seller-stars {
        color: #ffcc00;
        font-size: 14px !important;
        padding-top: 5px;
    }
}

.home-top-seller-stars {
    color: #ffcc00;
    font-size: 18px;
    padding-top: 5px;
}

.user-coupons-img-xs {
    border-radius: 500px !important;
    margin-bottom: 10px;
    opacity: 1;
    margin-left: 0px;
}

#unlock-user-coupon {
    margin-left: 0 !important;
}

.user-coupons {
    margin-bottom: 25px;
}

.no-top-border {
    border-top: none !important;
}

.tracking-order-table-td-1 {
    padding-left: 15px !important;
    width: 60%;
}

.tracking-order-table-td-2 {
    padding-left: 15px !important;
    width: 30%;
}

.tracking-order-table-td-3 {
    padding-left: 15px !important;
    width: 10%;
}

.tracking-order-table-td-border {
    border-right: 10px solid white;
}

.tracking-order-padding-left {
    padding-left: 15px !important;
}

.tracking-order-table-div-header {
    background-color: #f5f5f5;
    padding: 15px;
    margin-bottom: 10px;
}

.tracking-order-table-row-1 {
    background-color: #f5f5f5;
    border-top: none;
}

.tracking-order-table-row-2 {
    background-color: #ffffff !important;
    border-top: none;
}

.must-have-links {
    color: black !important;
    text-decoration: none !important;
}

#home-rating-box {
    border: 1px solid #444444;
    padding: 10px 15px;
    width: 22.5% !important;
    margin: 5px 10px 15px;
    height: 85px;
    border-radius: 4px;
    margin-left: 25px;
    background-color: #444444;
    color: #ffffff;
}

#home-rating-box:hover {
    background-color: #ff6800;
    color: #ffffff;
    border: 1px solid #ff6800;
}

#home-low-prices {
    border: 1px solid #444444;
    padding: 10px 15px;
    color: white;
    width: 22.5% !important;
    margin: 5px 10px 15px;
    height: 85px;
    border-radius: 4px;
    background-color: #444444;
}

#home-low-prices:hover {
    background-color: #ff6800;
    color: #fffffff;
    border: 1px solid #ff6800;
}

.home-info-four-boxes {
    margin-top: 30px !important;
    margin-bottom: 10px !important;
    margin-left: 30px !important;
}

#fav-dealer-home {
    opacity: 1;
}

#fav-dealer-home:hover {
    opacity: 0.8;
}

.dealer-store-profile-pic {
    display: inline-block;
    width: 135px;
    height: 135px;
    margin-bottom: 20px !important;
    border-radius: 500px;
}

.contact-us-page-background {
    background-image: url("/img/pakmoto-contact-us-page-background-img-2-greyed.jpg");
    background-repeat: no-repeat;
    background-size: cover;         /* Makes the image cover the full area */
    background-position: center;    /* Keeps it centered on all screens */
    width: 100%;                    /* Full width */
    min-height: 70vh;              /* Makes it fill the full screen height */
}

.contact-us-header {
    font-size: 35px;
    color: #ffffff;
    font-family: Helvetica;
    margin-top: 20px;
    text-align: center !important;
    font-weight: 999;
}

.contact-us-heading-border {
    border-bottom: 1px solid #ff6800;
}

.contact-us-left-col {
    font-size: 16px;
    color: #ffffff;
    font-family: Lato;
    margin-bottom: 20px;
    margin-top: 80px;
    text-align: center;
}

/* Contact Us Social Icons */
.contact-us-social-icons img {
    width: 50px;
    height: 50px;
    transition: transform 0.3s ease-in-out, opacity 0.25s ease-in-out;
    cursor: pointer;
}

.contact-us-social-icons img:hover {
    transform: scale(1.1);
}

/* Contact Us Form Column */
.contact-us-right-col {
    font-size: 16px;
    color: #ffffff;
    font-family: Lato;
    margin-bottom: 20px;
    margin-top: 40px;
}

.contact-us-form-rows-following {
    display: block;
    width: 100%;
    padding: 7.5px 7.5px;
    margin: 5px 0;
}

.contact-us-textfield {
    width: 80%;
    border-radius: 4px;
    padding: 5px;
    font-size: 14px;
    border: 1px solid #111111;
    background-color: #111111;
    color: #ffffff;
}

.contact-us-textfield:hover {
    border: 1px solid #ff6800;
    -webkit-transition : border 500ms ease-out;
    -moz-transition : border 500ms ease-out;
    -o-transition : border 500ms ease-out;
    transition : border 500ms ease-out;
}

.contactus-mainbody {
    width: 80%;
    border-radius: 4px;
    padding: 5px;
    font-size: 14px;
    padding-left: 15px;
    padding-right: 15px;
    border: 1px solid #111111;
    background-color: #111111;
    color: #ffffff;
}
.contactus-mainbody:hover {
    border: 1px solid #ff6800;
    -webkit-transition : border 500ms ease-out;
    -moz-transition : border 500ms ease-out;
    -o-transition : border 500ms ease-out;
    transition : border 500ms ease-out;
}

.contactus-form-submit-btn {
    margin: auto;
    margin-left: 7.5px !important;
    text-align: center;
    padding: 5px 15px;
    background-color: #ff6800;
    display: inline-block;
    border: none;
    font-size: 12px;
    font-family: Helvetica;
    color: #fff;
    border-radius: 20px;
    margin-bottom: 10px;
}

.contactus-form-submit-btn:hover,
.contactus-form-submit-btn:visited,
.contactus-form-submit-btn:active {
    background-color: #ff7700;
}

.contact-us-social-text-line {
    border-bottom: 2px solid #ff6800;
}

.contact-us-icons-xs {
    margin-right: 2.5px;
}

.user-coupons {
    margin-bottom: 20px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding-top: 25px;
    padding-bottom: 25px;
}

.user-coupons-img {
    border-radius: 500px !important;
    margin-bottom: 10px;
    opacity: 1;
    margin-left: 15px;
}

.user-coupons-img:hover {
    opacity:0.8;
}

.user-coupons-title {
    color: #ff7700;
    text-decoration: none;
}

.user-coupons-criteria {
    text-decoration: none;
    color: black;
}

#unlock-user-coupon {
    margin-left: 20px;
}

.checkout-promo-div {
    background-color: #f5f5f5;
}

.checkout-promo-title {
    background-color: #fff;
    border-bottom: 2px solid #ddd !important;
    text-align: left;
    vertical-align: middle !important;
    color: #5c5c5c;
    margin-bottom: 20px;
    font-size: 14px;
    padding: 5px 15px !important;
    font-family: "Lato Black";
}

.checkout-promo-field {
    margin-bottom: 20px;
}

.lockdown-order-warning {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background-color: #149414;
  padding: 10px;
  font-size: 16px;
  text-align: center;
  color: white;
  z-index: 777777 !important;
}

.manufacturer-image {
    transition: transform 0.3s ease;
}

.manufacturer-image:hover {
    transform: scale(1.2);  /* ~20px increase if original is 150px */
}

.homepage-info-stats {
    transition: transform 0.3s ease;
}

.homepage-info-stats:hover {
    transform: scale(1.5);  /* ~20px increase if original is 150px */
    cursor: pointer;
}

.home-category-imgs {
    margin-top: 40px;
}

.home-category-imgs-20 {
    margin-top: 30px;
}

.home-category-show-all-links {
    color: #ff8800;
    text-decoration: none;
}

.home-category-show-all-links:hover {
    color: #444444;
    text-decoration: none;
}

.home-category-links {
    color: #444444;
    text-decoration: none;
}

.home-category-links:hover,
.home-category-links:active {
    color: #ff8800;
    text-decoration: none;
}

.home-category-links-header {
    color: #666666;
    text-decoration: none;
}

.home-category-links-header:hover,
.home-category-links-header:active {
    color: #ff8800;
    cursor: pointer;
    text-decoration: none;
}

.home-category-header-image {
    transition: transform 0.3s ease;
}

.home-category-header-image:hover {
    transform: scale(1.1);  /* ~20px increase if original is 150px */
    cursor: pointer;
}

.category-text-center {
    text-align: center;
    text-decoration: none;
    margin-top: 10px;
}

.center-align-text-xs {
    text-align: center;
    margin-top: 10px;
}

/** BRANDS CAROUSAL **/
.carousel-container {
    max-width: 1200px;
    margin: 20px auto;
    overflow: hidden;
    position: relative;
    background: #fff;
    padding: 10px;
}

.carousel-track {
    display: flex;
    width: calc(100% * 2); /* 2 sets of 6 logos */
    animation: slide 10s infinite;
}

.carousel-slide {
    display: flex;
    flex: 0 0 50%;
    justify-content: space-between;
    align-items: center;
}

.carousel-slide img {
    width: 100px;
    height: auto;
    object-fit: contain;
    margin: 0 10px;
    filter: grayscale(75%);
    transition: 0.3s;
}

.carousel-slide img:hover {
    filter: grayscale(0%);
    transform: scale(1.05);
}

@keyframes slide {
    0%   { transform: translateX(0); }
    45%  { transform: translateX(0); }
    55%  { transform: translateX(-50%); }
    100% { transform: translateX(-50%); }
}

@media (max-width: 768px) {
    .carousel-slide img {
        width: 70px;
    }
}

@media (max-width: 480px) {
    .carousel-slide {
        flex-wrap: wrap;
        justify-content: center;
    }

    .carousel-slide img {
        width: 60px;
        margin: 10px;
    }
}
/** BRANDS CAROUSAL END **/

/** WHATSAPP BUTTON **/
.whatsapp-float {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 999;
    width: 60px;
    height: 60px;
    background-color: #25D366;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}

.whatsapp-float:hover {
    transform: scale(1.1);  /* ~20px increase if original is 150px */
}

.whatsapp-float img {
    width: 30px;
    height: 30px;
    transition: transform 0.3s ease;
}

.whatsapp-float img:hover {
    width: 30px;
    height: 30px;
    transform: scale(1.3);  /* ~20px increase if original is 150px */
    cursor: pointer;
}

@media (max-width: 600px) {
    .whatsapp-float {
        width: 50px;
        height: 50px;
    }

    .whatsapp-float img {
        width: 24px;
        height: 24px;
    }
}

/** WHATSAPP BUTTON END **/

.top-bar-logo {
    margin: auto;
    margin-top: 19px;
}

.footer-logo-img {
    margin: auto;
}

/** REGISTRATION BOX SUBSCRIBE TOGGLE BUTTON **/
/* Toggle switch wrapper */
.registration-subscribe-switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
}

/* Hide the default checkbox */
.registration-subscribe-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* Slider design */
.registration-subscribe-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.4s;
    border-radius: 34px;
}

/* Circle inside the slider */
.registration-subscribe-slider::before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 4px;
    bottom: 3px;
    background-color: white;
    transition: 0.4s;
    border-radius: 50%;
}

/* When checkbox is checked */
.registration-subscribe-switch input:checked + .registration-subscribe-slider {
    background-color: #ff8800; /* You can use #ff8800 if you prefer */
}

.registration-subscribe-switch input:checked + .registration-subscribe-slider::before {
    transform: translateX(24px);
}

/** REGISTRATION SUBSCRIBE TOGGLE BUTTON END **/

/** REGISTRATION TERMS & CONDITIONS CHECKBOX **/
.register-terms-container {
    margin-top: 10px;
    font-size: 14px;
}

.register-terms-checkbox-wrapper {
    display: flex;
    align-items: flex-start;
    cursor: pointer;
    position: relative;
    user-select: none;
}

.register-terms-checkbox-wrapper input[type="checkbox"] {
    opacity: 0;
    width: 0;
    height: 0;
}

.register-terms-custom-checkbox {
    width: 18px;
    height: 18px;
    border: 2px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
    margin-top: 2px;
    margin-right: 10px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    position: relative;
}

.register-terms-checkbox-wrapper input:checked + .register-terms-custom-checkbox {
    background-color: #ff8800;
    border-color: #ff8800;
}

.register-terms-custom-checkbox::after {
    content: "";
    position: absolute;
    display: none;
    left: 5px;
    top: 1px;
    width: 4px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.register-terms-checkbox-wrapper input:checked + .register-terms-custom-checkbox::after {
    display: block;
}

.register-terms-text {
    line-height: 1.5;
}

.register-terms-text a {
    color: #007bff;
    text-decoration: underline;
}

.register-terms-text a {
    color: #FF8800;
    text-decoration: none;
}

.register-terms-text a:hover,
.register-terms-text a:focus,
.register-terms-text a:active,
.register-terms-text a:visited {
    color: #FF8800;
}
/** REGISTRATION TERMS & CONDITION CHECKBOX END **/

/** ADMIN PANEL AND SELLER CENTER LOGIN LOGO **/
.center-login-logo-img {
    width: 30px !important;
}
/** ADMIN PANEL AND SELLER CENTER LOGIN LOGO END **/

/** WEB OPEN POPUP **/
#entryPopup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.6);
}

.entry-popup-content {
    position: relative;
    background-color: #fff;
    margin: 10% auto;
    padding: 20px;
    width: 90%;
    max-width: 600px;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    animation: fadeIn 0.4s ease-in-out;
    display: flex;
    flex-direction: column;
}

.entry-popup-inner {
    display: flex;
    gap: 20px;
}

.entry-popup-left {
    position: relative;
    flex: 1;
}

.entry-popup-left img {
    max-width: 100%;
    border-radius: 8px;
}

.discount-badge {
    position: absolute;
    bottom: 10px;
    left: 25px;
    background-color: #fff;
    color: #ff8800;
    font-size: 32px;
    font-weight: bold;
    padding: 8px 16px;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.discount-badge-upto {
    color: #ff8800;
    font-size: 12px;
    font-weight: bold;
}


@media (max-width: 600px) {
    .discount-badge {
        position: absolute;
        bottom: 10px;
        left: 0px;
        background-color: #fff;
        color: #ff8800;
        font-size: 24px;
        font-weight: bold;
        padding: 8px 4px;
        border-radius: 8px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }

    .discount-badge-upto {
        color: #ff8800;
        font-size: 6px;
        font-weight: bold;
    }
}

.entry-popup-right {
    flex: 2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.entry-popup-right h3 {
    color: #000;
    font-size: 20px;
    margin: 0 0 10px 0;
}

.entry-popup-right p {
    font-size: 14px;
    color: #333;
    margin-bottom: 12px;
}

.popup-cta {
    background-color: #ff8800;
    color: #fff;
    border: none;
    padding: 12px 18px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 4px;
    cursor: pointer;
    align-self: flex-start;
    margin: auto;
}

.entry-popup-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    background-color: #ff8800;
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    border: none;
    border-radius: 50%;
    text-align: center;
    line-height: 28px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

#crawler img.best-brands-slide {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
}
/** WEB OPEN POPUP END **/

/** Control Panel Buttons **/
.control-panel-add-button {
    background-color: #444 !important;
    border: none !important;
}
/** Control Panel Buttons End **/

/** Vehicles Show Page Hover Effect **/
.vehicle-view-image {
    transition: transform 0.3s ease;
}

.vehicle-view-image:hover {
    transform: scale(1.08);  /* ~20px increase if original is 150px */
}
/** Vehicles Show Page Hover Effect End**/

/** Password Toggle Button on Registration Page **/
.password-toggle-btn {
    background: transparent !important;
    box-shadow: none !important;
    padding: 6px 10px;
    color: #666;
    cursor: pointer;
}

.password-toggle-btn:hover,
.password-toggle-btn:focus {
    background-color: #f5f5f5;
    outline: none;
}
/** Password Toggle Button on Registration Page End**/

/* WhatsApp Banner Styles */
.whatsapp-banner {
    background-color: #444444; /* Auto Axis orange */
    color: #fff;
    padding: 5px 15px;
    font-family: 'Segoe UI', sans-serif;
    z-index: 10000;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}

.whatsapp-banner-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    flex-wrap: wrap;
    padding: 0 10px;
    box-sizing: border-box;
}

.whatsapp-text {
    font-size: 16px;
    font-weight: 500;
    flex: 1;
    text-align: left;
}

.whatsapp-button {
    background-color: #fff;
    color: black;
    padding: 8px 16px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    border-radius: 4px;
    transition: background 0.3s ease, color 0.3s ease;
}

.whatsapp-button:hover {
    background-color: #ff8800;
    color: #ffffff;
    text-decoration: none;
}

/* Push button left on large screens to avoid sticky cart */
@media screen and (min-width: 1024px) {
    .whatsapp-button {
        margin-right: 150px;
    }
}

/* Responsive Styling for tablets */
@media screen and (max-width: 768px) {
    .whatsapp-banner-content {
        flex-direction: column;
        text-align: center;
        padding: 10px;
    }

    .whatsapp-text {
        font-size: 15px;
        margin-bottom: 8px;
        text-align: center;
    }

    .whatsapp-button {
        width: 100%;
        margin: 0 auto;
    }
}

/* Responsive Styling for mobile phones */
@media screen and (max-width: 480px) {
    .whatsapp-text {
        font-size: 14px;
    }

    .whatsapp-button {
        font-size: 13px;
        padding: 7px 12px;
    }
}
/* WhatsApp Banner Styles End */

/* Dealer Search Result Full Length Text */
/* Target the actual input field */
.select2-container--default .select2-selection--multiple .select2-search__field {
    width: 100% !important; /* Force the input field to take full width within its container */
    box-sizing: border-box;
}

/* Part Details Page Share Button */
.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 25px;   /* bigger size */
    height: 25px;  /* bigger size */
    border-radius: 50%;
    margin-right: 5px;
    font-size: 16px;   /* bigger icon */
    color: #fff;       /* white icons by default */
    transition: transform 0.2s ease;
    text-decoration: none;
}

.share-btn:hover {
    transform: scale(1.1);  /* subtle hover zoom */
}

/* Brand colors */
.fb { background-color: #1877F2; }     /* Facebook */
.x  { background-color: #000000; }     /* X (Twitter) */
.li { background-color: #0A66C2; }     /* LinkedIn */
.wa { background-color: #25D366; }     /* WhatsApp */
.tg { background-color: #0088CC; }     /* Telegram */
.rd { background-color: #FF4500; }     /* Reddit */

/* Sticky Social Follow Buttons */
#social-follow {
    position: fixed;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 9999;
}

#social-follow ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#social-follow ul li {
    margin: 5px 0;
}

#social-follow ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    border-radius: 0 5px 5px 0;
    transition: all 0.3s ease;
}

/* Platform colors */
#social-follow ul li a.instagram { background: #E1306C; }
#social-follow ul li a.facebook { background: #1877F2; }
#social-follow ul li a.x { background: #000000; } /* Updated X color */
#social-follow ul li a.pinterest { background: #BD081C; }
#social-follow ul li a.youtube { background: #FF0000; }
#social-follow ul li a.tiktok { background: #000000; }
#social-follow ul li a.linkedin { background: #0077B5; }

/* Hover effect */
#social-follow ul li a:hover {
    transform: translateX(5px);
}
/* Sticky Social Follow Buttons End */