.navbar-primary {
  background-color: #4f2551;
  color: #fff;
}
.layout-navbar-fixed .wrapper .sidebar-light-primary .brand-link:not([class*="navbar"]) {
  background-color: #4f2551;
}
.layout-navbar-fixed .wrapper .sidebar-light-primary .brand-link:not([class*="navbar"]) {
  background-color: #4f2551;
}
.layout-navbar-fixed .wrapper .sidebar-light-primary .brand-link:not([class*="navbar"]) {
  background-color: #4f2551;
}
[class*="sidebar-light-"] {
  background-color: #4f2551;
}
sidebar-light-primary .nav-sidebar.nav-legacy>.nav-item>.nav-link.active {
    border-color: #fff;
}
a {
  color: #4f2551;
  text-decoration: none;
  background-color: transparent;
}
.btn-primary {
  color: #fff;
  background-color: #4f2551;
  border-color: #4f2551;
}
.btn-primary:hover {
  color: #fff;
  background-color: #713b73;
  border-color: #713b73;
}

.btn-primary:focus, .btn-primary.focus {
  color: #fff;
  background-color: #4f2551;
  border-color: #4f2551;
  box-shadow: 0 0 0 0.2rem rgba(105, 136, 228, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: #713b73;
  border-color: #713b73;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #713b73;
  border-color: #713b73;
}

.btn-outline-primary {
  color: #4f2551;
  border-color: #4f2551;
}

.btn-outline-primary:hover {
  color: #fff;
  background-color: #4f2551;
  border-color: #4f2551;
}

.dropdown-item:hover, .dropdown-item:focus {
    color: #fff;
    background-color: #4f2551;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: #fff;
  background-color: #4f2551;
}
.bg-primary {
  background-color: #4f2551 !important;
}

.login-bg-primary {
  background-color: #4f2551 !important;
}
.text-primary {
  color: #4f2551 !important;
}

.border-left-primary {
  border-left: 0.25rem solid #4f2551 !important;
}

.border-bottom-primary {
  border-bottom: 0.15rem solid #4f2551 !important;
}

.bg-sm-login-image {
  background: url(/Content/images/elementlogo.png) no-repeat;
  /*background-position: center;
  background-size: contain;*/
}
.bg-login-image {
  background: url(/Content/images/elementlogo.png) no-repeat;
  background-position: center;
  background-size: contain;
}

.price {
  color: #4f2551 !important;
  font-size: 14px !important; 
}
   /*Datatable CSS Style*/
    .table.dataTable thead th {
    color: #4f2551;
    background-color: #f0f0f1;
}
.dt-buttons .dt-button {
  background: #4f2551 none repeat scroll 0 0;
  border-radius: 4px;
  color: #ffffff;
  margin-right: 3px;
  padding: 5px 15px;
}
.dataTables_length select {
  background-color: transparent;
  background-image: linear-gradient(#4f2551, #4f2551), linear-gradient(#b1b8bb, #b1b8bb);
  background-position: center bottom, center calc(99%);
  background-repeat: no-repeat;
  background-size: 0 2px, 100% 1px;
  border: 0 none;
  padding-bottom: 5px;
  transition: background 0s ease-out 0s;
}
.dataTables_length select:focus {
  background-image: linear-gradient(#4f2551, #4f2551), linear-gradient(#b1b8bb, #b1b8bb);
  background-size: 100% 2px, 100% 1px;
  box-shadow: none;
  outline: medium none;
  transition-duration: 0.3s;
}
/*.dataTables_filter {
  float: right;
  margin-top: 10px;
}*/
.dataTables_filter input {
  background-color: transparent;
  background-image: linear-gradient(#4f2551, #4f2551), linear-gradient(#b1b8bb, #b1b8bb);
  background-position: center bottom, center calc(99%);
  background-repeat: no-repeat;
  background-size: 0 2px, 100% 1px;
  border: 0 none;
  border-radius: 0;
  box-shadow: none;
  float: none;
  margin-left: 10px;
  transition: background 0s ease-out 0s;
}
.dataTables_filter input:focus {
  background-image: linear-gradient(#4f2551, #4f2551), linear-gradient(#b1b8bb, #b1b8bb);
  background-size: 100% 2px, 100% 1px;
  box-shadow: none;
  outline: medium none;
  transition-duration: 0.3s;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background-color: #4f2551;
  border: 1px solid #4f2551;
  color: #ffffff !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background-color: #4f2551;
  border: 1px solid #4f2551;
  color: white;
}
.paging_simple_numbers .pagination .paginate_button.active a,
.paging_simple_numbers .pagination .paginate_button:hover a {
  background: #4f2551 none repeat scroll 0 0;
  color: #ffffff;
}
/*customize check-box*/
.custom-cbx > input[type="checkbox"] + label:before {
    position: absolute;
    width: 14px;
    width: 1.4rem;
    height: 14px;
    height: 1.4rem;
    border: 1px solid #4f2551;
    left: 2px;
    left: 0.2rem;
    top: 2px;
    top: 0.2rem;
    border-radius: 2px;
    content: '';
    cursor: pointer;
}
.custom-cbx > input[type="checkbox"]:checked + label:after {
    position: absolute;
    width: 8px;
    width: 0.8rem;
    height: 17px;
    height: 1.7rem;
    border-top: 2.5px solid transparent;
    border-right: 2.5px solid #4f2551;
    border-bottom: 2.5px solid #4f2551;
    border-left: 2.5px solid transparent;
    transform: rotate(35deg);
    left: 7px;
    left: 0.7rem;
    top: -4.5px;
    top: -0.45rem;
    border-radius: 4px;
    content: '';
    cursor: pointer;
}
.product-details .quantity .pro-qty .qtybtn {
    font-size: 24px;
    color: #4f2551;
    float: left;
    line-height: 38px;
    cursor: pointer;
    width: 18px;
}
.table thead th {
    color: #4f2551;
}
a.text-primary:hover, a.text-primary:focus {
    color: #4f2551 !important;
}
.divider-horizontal-primary {
  border-top: 1px solid #4f2551;
}
 .custom-checkbox .custom-control-input:checked~.custom-control-label::before{
        background-color: #4f2551;
    }
  .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #4f2551;
}
   /*Browser scroll*/
body::-webkit-scrollbar-thumb {
background-color: #4f2551; 
}
    /*Scrollbar-CSS*/
.scrollbar-primary::-webkit-scrollbar-thumb {
background-color: #4f2551; 
   }
.pagination > .active > a,
  .pagination > .active > span,
  .pagination > .active > a:hover,
  .pagination > .active > span:hover,
  .pagination > .active > a:focus,
  .pagination > .active > span:focus {
    background-color: #4f2551;
    border-color: #4f2551;
  }