/*--------------------------------------------

    Template Name: srtdash - Bootstrap 4 Admin and Ui Kit
    Template URI: http://tf.itech-theme.com/srtdash-preview
    Description: This is Bootstrap 4 Admin Template and Ui Kit
    Author: cdibrandstudio
    Author https://themeforest.net/user/cdibrandstudio
    Version: 1.0

    ----------------------------------------------
    
    CSS INDEX
    ===================
  
    1. Core Css
    2. Dashboard One
        2.1 Sidebar Menu
            2.1.1 Horizontal Menu
        2.2 Header Area
        2.3 Page Title Area
        2.4 Fact Area
        2.5 Overview
        2.6 Market value
        2.7 Live Crypto Price
        2.8 Trading History
        2.9 Letest Post
    3. Dashboard Two
    4. Dashboard Three
    5. Bar Chart
    6. Line Chart
    7. Pie Chart
    8. Accroding
    9. Alert
   10. Badge
   11. Button
   12. Cards
   13. Dropdown Button
   14. List Group
   15. Modal
   16. Pagination
   17. Form
   18. Icons
   19. Table Basic
   20. Datatable
   21. Map
   22. Invoice
   23. Login
   24. Pricing
   25. 404 Page
   26. Offset Sidebar

-----------------------------------------------------------------------------------*/
/* *{
    border: 1px solid red !important;
} */

#chart_div svg {
  width: 100%;
}

.slimScrollDiv {
  height: 100% !important;
}

.menu-inner {
  height: 100% !important;
}
/* #chart_div div{
    width: 100% !important;
} */
/*------------------------- 1. Core Css -------------------*/

.page-container {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  padding-left: 230px;
  -webkit-transition: padding-left 0.3s ease 0s;
  transition: padding-left 0.3s ease 0s;
}

.sbar_collapsed.page-container {
  padding-left: 0;
}

.card {
  border: none;
  border-radius: 10px;
  background-color: #fff;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.card:hover {
  box-shadow: 0 5px 30px rgba(0, 0, 0, 0.02);
}

.card-body {
  padding: 25.6px;
  padding: 1.6rem;
}

.h-full {
  height: 100%;
}

.main-content {
  width: 100%;
  background: #f3f8fb; /*#F3F8FB;*/
}

.main-content-inner {
  padding: 0 30px 50px;
}

/*------------------------- END Core Css -------------------*/

/*-------------------- 2.1 Sidebar Menu -------------------*/
.left-menu {
  background: #2a363b;
}

.sidebar-menu {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99;
  height: 100%;
  width: 230px;
  overflow: hidden;
  background: #f7f9f9;
  box-shadow: 2px 0 32px rgba(0, 0, 0, 0.05);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.sbar_collapsed .sidebar-menu {
  left: -230px;
}

.main-menu {
  /* height: calc(100% - 100px);
    overflow: hidden; */
  height: calc(100% - 100px);
  overflow: auto;
  padding: 20px 10px 0 0;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.menu-inner {
  overflow-y: scroll !important;
}

/* Additional styles for the content inside the div */
.menu-inner::-webkit-scrollbar {
  width: 12px; /* Adjust the width as needed */
  border-radius: 8px;
}

.menu-inner::-webkit-scrollbar-track-piece {
  background-color: #f7f9f9; /* Color of the scrollbar track piece */
}

.menu-inner::-webkit-scrollbar-thumb {
  background-color: #4784e6; /* Color of the scrollbar thumb */
  border-radius: 8px;
}

/* .menu-inner::-webkit-scrollbar-button {
    display: block;
    height: 15px; 
}
  
.menu-inner::-webkit-scrollbar-button:start:decrement {
    background-color: #4784e6; 
}
  
.menu-inner::-webkit-scrollbar-button:end:increment {
    background-color: #4784e6; 
}

.menu-inner::-webkit-scrollbar-arrow-color {
    display: block;
    height: 40px; 
}
  
.menu-inner::-webkit-scrollbar-arrow-color:start:decrement {
    background-color: #4784e6; 
}
  
.menu-inner::-webkit-scrollbar-arrow-color:end:increment {
    background-color: #4784e6; 
} */

.slimScrollBar {
  background: #fff !important;
  opacity: 0.1 !important;
}

.sidebar-header {
  padding: 8.5px 12px 14px 10px;
  background: var(--bg);
  border-bottom: 1px solid #fff;
}
.sidebar-menu .logo {
  text-align: left;
}
.logo a {
  display: inline-block;
  max-width: 150px;
}

.metismenu > li > a {
  padding-left: 12px !important;
}
.metismenu li a {
  position: relative;
  display: block;
  color: #575757;
  font-size: 13px;
  text-transform: capitalize;
  padding: 13px 15px;
  letter-spacing: 0;
  font-weight: 400;
}

.metismenu li a i {
  color: var(--btn);
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.metismenu li a:after {
  position: absolute;
  content: "\f107";
  font-family: fontawesome;
  right: 15px;
  top: 12px;
  color: #8d97ad;
  font-size: 20px;
}

/* .metismenu li.active>a:after {
    content: '\f106';
} */

.metismenu li a:only-child:after {
  content: "";
}

.metismenu li a span {
  margin-left: 10px;
}

.metismenu li.active > a,
.metismenu li:hover > a {
  background: var(--btn);
  color: #fff;
}

.metismenu li.active > a i,
.metismenu li:hover > a i {
  /* background: var(--btn); */
  color: #fff;
}

.metismenu li li a {
  padding: 8px 5px;
}

.metismenu li ul {
  padding-left: 37px;
}

.metismenu > li:hover > a {
  color: #951818;
  background: var(--btn);
}

.metismenu > li.active > a {
  color: #000;
  background: #5e5e5e24;
}

/* .metismenu li:hover>a{
    background: #f36621;
    color: #fff;
}

.metismenu li.active>a {
    background: #f36621;
    color: #fff;
} */

.metismenu > li:hover > a i,
.metismenu > li.active > a i {
  color: #000;
}

.submenu li:hover > a i,
.submenu li.active > a i {
  color: #f36621;
}

.metismenu li li a:after {
  top: 6px;
}

/*-------------------- END Sidebar Menu -------------------*/

body,
td,
th,
input {
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  line-height: 14px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  vertical-align: top;
}

/*-------------------- 2.1.1 Horizontal Menu -------------------*/
.body-bg {
  background: #f3f8fb;
}

.horizontal-main-wrapper {
  min-height: 100vh;
}

.horizontal-main-wrapper .container {
  max-width: 1440px;
}

.horizontal-main-wrapper .header-area,
.horizontal-main-wrapper .mainheader-area {
  padding-left: 0;
  padding-right: 0;
}

.horizontal-main-wrapper .main-content-inner {
  padding: 0 0 50px;
}

.mainheader-area .notification-area {
  /* -webkit-transform: translateY(-11px);
            transform: translateY(-11px); */
}

.mainheader-area {
  background: var(--bg) !important;
  border-bottom: 1px solid #f3f8fb;
  padding-left: 15px;
  position: relative;
  z-index: 99;
}

.mainheader-area .logo a span {
  color: #843df9 !important;
}

.horizontal-menu {
  position: relative;
}

.horizontal-menu ul li {
  display: inline-block;
  position: relative;
}

.horizontal-menu ul li a {
  display: block;
  font-size: 11px !important;
  font-weight: 600 !important;
  /* word-spacing: 10px; */
  padding: 4px 3px !important;
  letter-spacing: 0px;
  color: #645f5f !important;
  text-transform: capitalize;
}

.horizontal-menu ul li:hover > a,
.horizontal-menu ul li.active > a {
  color: #f36621 !important;
  font-weight: bold;
}

.horizontal-menu nav > ul > li:first-child > a {
  padding-left: 0;
}

.horizontal-menu ul li a i {
  margin-right: 2px;
}

.horizontal-menu .submenu {
  position: absolute;
  left: 0;
  top: 100%;
  z-index: 99;
  width: 170px;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  border-top: 4px solid #f36621;
  border-radius: 3px;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.03);
}

.horizontal-menu .submenu li {
  display: block;
}

.horizontal-menu ul li:hover > .submenu {
  opacity: 1;
  visibility: visible;
}

.horizontal-menu .mega-menu {
  position: inherit;
}

.horizontal-menu .mega-menu .submenu {
  width: 100%;
  max-width: 900px;
}

.horizontal-menu .mega-menu .submenu li {
  display: inline-block;
  width: calc(100% * (1 / 3) - 5px);
}

.slicknav_nav .slicknav_item a:hover,
.mega-menu span:hover {
  color: #f36621 !important;
}
.header-bottom .search-box input {
  max-width: 350px;
  width: 100%;
}

/* mobile menu */
.slicknav_menu {
  background: #fff;
  padding: 0;
  margin-top: 0px;
}

.slicknav_menu > a {
  display: block;
  width: 100%;
  padding: 15px;
  margin: 0;
  background: #f36621;
}
.slicknav_nav a:hover {
  color: #000 !important;
  background: #cac7c7;
}

.slicknav_menu .slicknav_icon {
  float: right;
}

.slicknav_menu .slicknav_icon-bar {
  box-shadow: none;
}

.slicknav_menu .slicknav_menutxt {
  font-weight: 500;
  text-shadow: none;
}

.slicknav_nav .slicknav_row,
.slicknav_nav a {
  text-transform: capitalize;
}

.slicknav_nav .slicknav_row:hover {
  border-radius: 0;
  background: #cac7c7;
  /* color: #fff !important; */
}

.slicknav_nav li i {
  width: 26px;
  display: inline-block;
  color: #000 !important;
}

.slicknav_nav .slicknav_item .slicknav_arrow {
  float: right;
}

/*-------------------- END Horizontal Menu -------------------*/

/*-------------------- 2.2 Header Area -------------------*/

.header-area {
  padding: 11px 0px 7px 0px;
  background: var(--bg);
  border-bottom: 1px solid #d8e3e7;
}

.nav-btn {
  margin: 10px 30px 0 0;
  cursor: pointer;
  padding-left: 20px;
}

.nav-btn span {
  display: block;
  width: 31px;
  height: 5px;
  background: #fff;
  margin: 4px 0;
  border-radius: 15px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  box-shadow: 0 0 0 4px rgba(99, 96, 96, 0.03);
}

.nav-btn span:nth-child(2) {
  opacity: 0;
}

.nav-btn span:first-child {
  -webkit-transform: rotate(45deg) translate(5px, 5px);
  transform: rotate(45deg) translate(5px, 5px);
}

.nav-btn span:last-child {
  -webkit-transform: rotate(-45deg) translate(7px, -7px);
  transform: rotate(-45deg) translate(7px, -7px);
}

.sbar_collapsed .nav-btn span {
  transform: none;
  opacity: 1;
}

.search-box form {
  position: relative;
}

div.form {
  position: relative;
}

.search-box input {
  width: 350px;
  border-radius: 33px;
  border: none;
  height: 40px;
  padding-left: 20px;
  padding-right: 40px;
  letter-spacing: 0;
  background: #f3eeff;
}

.search-box input::-webkit-input-placeholder {
  color: #b1a7a7;
}

.search-box input::-moz-placeholder {
  color: #b1a7a7;
}

.search-box input:-ms-input-placeholder {
  color: #b1a7a7;
}

.search-box form i {
  position: absolute;
  right: 21px;
  top: 14px;
  font-size: 14px;
  color: #b1a7a7;
}

/* notification-area */

.notification-area {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: relative;
  z-index: 1;
  padding-top: 0px;
  padding-bottom: 10px;
}

.notification-area li {
  display: inline-block;
  margin-left: 30px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.notification-area li.settings-btn.active i {
  color: #f36621;
}

.notification-area li > i {
  font-size: 26px;
  color: #fff;
  vertical-align: middle;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.12);
  -webkit-transition: color 0.3s ease 0s;
  transition: color 0.3s ease 0s;
}

.notification-area li > a > i {
  font-size: 26px;
  color: #fff;
  vertical-align: middle;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.12);
  -webkit-transition: color 0.3s ease 0s;
  transition: color 0.3s ease 0s;
}

.notification-area li:hover > i,
.dropdown.show > i {
  color: var(--primary-color);
}

.notification-area li i > span {
  position: absolute;
  right: -5px;
  top: -7px;
  font-family: "Poppins", sans-serif;
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  background: var(--primary-color);
  height: 20px;
  width: 20px;
  border-radius: 50%;
  text-align: center;
  line-height: 20px;
  padding-left: 2px;
}

.notify-box {
  width: 350px;
  border-radius: 10px;
  overflow: hidden;
  padding: 0;
  margin: 0;
}

.notify-title {
  background: var(--primary-color);
  display: block;
  padding: 18px 30px;
  color: #fff;
  font-size: 14px;
  letter-spacing: 0;
  overflow: hidden;
}

.notify-title a {
  float: right;
  display: inline-block;
  color: #ffee1d;
  font-size: 13px;
  text-decoration: underline;
}

.nofity-list {
  padding: 30px 0;
}

.nofity-list a {
  padding: 0 30px;
  display: block;
  margin-bottom: 20px;
  border-bottom: 1px solid #f5f2f2;
  padding-bottom: 15px;
}

.nofity-list a:last-child {
  margin-bottom: 0;
  border-bottom: none;
}

.notify-thumb {
  float: left;
  margin-right: 20px;
}

.notify-thumb i {
  height: 30px;
  width: 30px;
  line-height: 30px;
  display: block;
  border-radius: 50%;
  text-align: center;
  color: #fff;
  font-size: 23px;
}

.notify-text {
  overflow: hidden;
}

.notify-text p {
  font-size: 14px;
  color: #4e4e4e;
  line-height: 22px;
  margin-bottom: 4px;
}

.notify-text span {
  letter-spacing: 0;
  color: #272626;
  font-size: 11px;
  font-weight: 300;
}

/* notify envelope */

.expanded .notification-area li#full-view-exit {
  display: inline-block;
}

.notification-area li#full-view-exit {
  display: none;
}

.expanded .notification-area li#full-view {
  display: none;
}

.notification-area li#full-view {
  display: inline-block;
}

.nt-enveloper-box .notify-text p {
  margin-bottom: 0;
}

.notify-text span.msg {
  display: block;
  font-size: 12px;
  color: #4e4e4e;
  line-height: 22px;
  margin-bottom: 4px;
  font-weight: 400;
}

.notify-thumb img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  margin-top: 4px;
}

/*-------------------- END Header Area -------------------*/

/*-------------------- 2.3 Page Title Area -------------------*/

.page-title-area {
  padding: 0 30px;
  background: #fff;
  position: relative;
}

/* .page-title-area:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 36px;
    background: var(--primary-color);
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
} */

.page-title {
  font-size: 24px;
  font-weight: 300;
  color: #313b3d;
  letter-spacing: 0;
  margin-right: 30px;
}

ul.breadcrumbs {
  margin-top: 4px;
}

.breadcrumbs li {
  display: inline-block;
}

.breadcrumbs li a,
.breadcrumbs li span {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: var(--btn);
  letter-spacing: 0;
  margin-right: 16px;
  position: relative;
}

.breadcrumbs li a:before {
  content: "/";
  color: #768387;
  position: absolute;
  right: -13px;
  top: 0;
}

.breadcrumbs li span {
  margin-right: 0;
  color: #768387;
  text-transform: capitalize;
}

.user-profile {
  margin-right: -30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /*background: -webkit-linear-gradient(left, #f36621 0%, #d38612 100%);
    background: linear-gradient(to right, #f36621 0%, #d38612 100%);*/
  padding: 0px 38px 0px 38px;
  position: relative;
}

.user-profile img.avatar {
  height: 35px;
  width: 35px;
  border-radius: 50%;
  margin-right: 12px;
}

.user-name {
  font-size: 17px;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.user-name i {
  margin-left: 10px;
  font-size: 21px;
  vertical-align: middle;
  position: relative;
}

.notification-area .dropdown-toggle,
.user-name.dropdown-toggle {
  position: relative;
}

.notification-area .dropdown-toggle:after,
.user-name.dropdown-toggle:after {
  display: none;
}

.notification-area .dropdown-menu,
.user-profile .dropdown-menu {
  background: #fff;
  border: none;
  -webkit-transform: none !important;
  transform: none !important;
  top: 130% !important;
  right: 30px !important;
  left: auto !important;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  display: block !important;
  visibility: hidden;
  opacity: 0;
}

.notification-area .dropdown-menu.show,
.user-profile .dropdown-menu.show {
  top: 100% !important;
}

.notification-area .dropdown-menu.show,
.user-profile .dropdown-menu.show {
  top: 100% !important;
  visibility: visible;
  opacity: 1;
  box-shadow: 0 0 45px 0 rgba(131, 23, 254, 0.06);
}

.user-profile .dropdown-menu a {
  font-size: 14px;
  color: #8a8a8a;
  letter-spacing: 0;
  font-weight: 500;
  padding: 4px 120px;
  padding-left: 25px;
}

.user-profile .dropdown-menu a:hover {
  background: #f8f9fa;
  color: #2942fa;
}

/*-------------------- END Page Title Area -------------------*/

/*-------------------- 2.4 Fact Area ------------------- */

.single-report {
  background: #fff;
  overflow: hidden;
  position: relative;
}

.s-report-inner {
  padding-left: 85px;
}

.single-report .icon {
  font-size: 32px;
  color: #fff;
  background: var(--primary-color);
  height: 95px;
  width: 100px;
  text-align: right;
  padding-top: 40px;
  padding-right: 22px;
  border-radius: 50%;
  position: absolute;
  left: -39px;
  top: -30px;
}

.s-report-title {
  margin-bottom: 25px;
}

.header-title {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  color: #333;
  text-transform: capitalize;
  padding-right: 10px;
  /* margin-bottom: 17px; */
}

.btn-list {
  padding: 10px !important;
}

.empty-title {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0;
  color: #333;
  margin-bottom: 17px;
}

.single-report p {
  font-size: 12px;
  font-weight: 700;
  color: #565656;
  background: #ececec;
  letter-spacing: 0;
  padding: 0 9px;
  height: 20px;
  line-height: 20px;
}

.single-report h2 {
  font-size: 26px;
  color: #565656;
  font-weight: 500;
  letter-spacing: 0;
}

.single-report span {
  font-size: 14px;
  font-weight: 600;
  color: #565656;
  letter-spacing: 0;
}

.highcharts-exporting-group {
  display: none;
}

/*-------------------- END Fact Area ------------------- */

/*-------------------- 2.5 Overview ------------------- */

.custome-select {
  font-size: 13px;
  color: #565656;
  font-weight: 500;
  letter-spacing: 0;
}

.border-0 {
  border: none;
}

#verview-shart {
  height: 400px;
}

#verview-shart-license-text,
#coin_distribution-license-text {
  display: none;
}

#coin_distribution-wrapper {
  height: 400px !important;
  margin-top: -30px;
}

#coin_distribution-menu {
  display: none;
}

/*-------------------- END Overview ------------------- */

/*-------------------- 2.6 Market value ------------------- */

.market-status-table {
  overflow: hidden;
}

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

table.dbkit-table tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  height: 71px;
  border: 1px solid transparent;
  padding: 0 30px;
  margin: 20px 2px 6px;
  background: #f5f8f9;
}

table.dbkit-table tr th,
table.dbkit-table tr td {
  border-top: none !important;
}

table.dbkit-table tr:hover {
  border-color: #e4e2f5;
}

table.dbkit-table tr td {
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  color: #616161;
  min-width: 141px;
}

.mv-icon img {
  max-width: 29px;
}

.trends {
  text-align: center;
}

.stats-chart {
  text-align: center;
  max-width: 75px;
}

.stats-chart canvas {
  margin: auto;
}

.buy img,
.sell img {
  margin-left: 10px;
}

/*-------------------- END Market value ------------------- */

/*-------------------- 2.7 Live Crypto Price ------------------- */

.cripto-live ul li {
  margin-bottom: 27px;
  font-size: 16px;
  font-weight: 500;
  color: #565656;
  letter-spacing: 0;
}

.cripto-live ul li:last-child {
  margin-bottom: 0;
}

.cripto-live ul li .icon {
  display: inline-block;
  height: 30px;
  width: 30px;
  margin-right: 10px;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: #ffd615;
  text-align: center;
  line-height: 30px;
  text-transform: uppercase;
}

.cripto-live ul li .icon.l {
  background: #08bfc1;
}

.cripto-live ul li .icon.d {
  background: #4cff63;
}

.cripto-live ul li .icon.e {
  background: #8a7fe2;
}

.cripto-live ul li .icon.t {
  background: #95b36e;
}

.cripto-live ul li span {
  display: block;
  width: 50%;
  float: right;
}

.cripto-live ul li span i {
  color: #2fd444;
  margin-right: 10px;
}

.cripto-live ul li span i.fa-long-arrow-down {
  color: #ff0e0e;
}

/*-------------------- END Live Crypto Price ------------------- */

/*-------------------- 2.8 Trading History ------------------- */

.trd-history-tabs ul li a {
  font-size: 14px;
  font-weight: 500;
  color: #b0b0b0;
  letter-spacing: 0;
  margin: 0 15px;
  display: block;
  border-bottom: 2px solid transparent;
  padding-bottom: 7px;
}

.trd-history-tabs ul li a:hover,
.trd-history-tabs ul li a.active {
  border-bottom: 2px solid #731ffd;
  padding-bottom: 7px;
  color: #565656;
}

/*-------------------- END Trading History ------------------- */

/*-------------------- 2.9 Letest Post ------------------- */

.single-post {
  margin-bottom: 34px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.lts-thumb {
  -ms-flex-preferred-size: calc(40% - 10px);
  flex-basis: calc(40% - 10px);
}

.lts-content {
  -ms-flex-preferred-size: calc(60% - 10px);
  flex-basis: calc(60% - 10px);
}

.lts-content span {
  font-size: 16px;
  font-weight: 600;
  color: #565656;
  letter-spacing: 0;
}

.lts-content h2 a {
  display: block;
  font-size: 20px;
  font-weight: 700;
  color: #565656;
  letter-spacing: 0;
  margin-bottom: 16px;
}

.lts-content h2 a:hover {
  color: #6d65dc;
}

.lts-content p {
  font-size: 14px;
  font-weight: 400;
  color: #565656;
}

.input-form {
  position: relative;
}

.input-form input {
  height: 80px;
  width: 100%;
  padding-left: 50px;
  border: none;
  box-shadow: 0 0 41px rgba(67, 54, 251, 0.05);
}

.input-form span {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 125px;
  background: var(--primary-color);
  text-align: center;
  line-height: 80px;
  font-weight: 600;
  color: #fff;
  letter-spacing: 0;
  font-size: 19px;
}

.exhcange-rate {
  padding: 38px;
  background: #f7fafb;
}

.exhcange-rate .exchange-devider {
  text-align: center;
  font-size: 30px;
  color: #686868;
  letter-spacing: 0;
  font-weight: 600;
  margin: 24px 0;
}

.exchange-btn button {
  width: 100%;
  margin-top: 20px;
  height: 79px;
  background: var(--primary-color);
  color: #fff;
  letter-spacing: 0;
  font-weight: 700;
  border: none;
  border-radius: 2px;
  font-size: 18px;
  outline: none;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.exchange-btn button:hover {
  background: #3c34ab;
}

.footer-area {
  text-align: center;
  padding: 23px 0 19px;
  background: var(--bg);
  color: #f3f8fb;
}

.footer-area p,
a {
  color: #fff;
  margin-bottom: 0;
}

.dropdown-menu a {
  color: #000;
  font-size: 12px;
}

td a {
  color: #2b977f;
  font-size: 12px;
}

/*Ajax Table Pagination */
.link {
  padding: 5px 5px;
  background: transparent;
  border-left: 0px;
  cursor: pointer;
  color: var(--btn);
}
.disabled {
  cursor: not-allowed;
  color: #bccfd8;
}
.current {
  background: #bccfd8;
}
.first {
  border-left: #bccfd8 1px solid;
}
/*#pagination{margin-top: 20px;padding-top: 30px;border-top: #F0F0F0 1px solid;}*/
.dot {
  padding: 5px 5px;
  background: transparent;
  border-right: #bccfd8 1px solid;
}
#overlay {
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: none;
}
#overlay div {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -32px;
  margin-left: -32px;
}
.page-content {
  padding: 20px;
  margin: 0 auto;
}
.pagination-setting {
  padding: 10px;
  margin: 5px 0px 10px;
  border: #bccfd8 1px solid;
  color: #607d8b;
}
/*End Ajax Table Pagination */

/*-------------------- END Letest Post ------------------- */

/*-------------------- 3. Dashboard Two ------------------- */

.sales-style-two .single-report {
  background: #fff;
  overflow: hidden;
  position: relative;
  padding: 10px 15px 10px;
}

#visitor_graph {
  height: 400px;
}

/* Todays Order List */

.dbkit-table .heading-td td {
  color: #444;
  font-weight: 500;
}

.pagination_area ul li {
  display: inline-block;
}

.pagination_area ul li a {
  display: block;
  height: 45px;
  line-height: 44px;
  width: 45px;
  border: 2px solid #f1ebeb;
  border-radius: 50%;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: #4d4d4d;
  margin-left: 3px;
}

.pagination_area ul li a:hover {
  background: #8553fa;
  color: #fff;
}

.pagination_area ul li a i {
  font-size: 14px;
}

/* team member area */

.team-search input {
  height: 40px;
  padding-left: 12px;
  border: 1px solid #e1e1e1;
  letter-spacing: 0;
  font-size: 13px;
  border-radius: 2px;
}

.team-search input::-webkit-input-placeholder {
  color: #e1e1e1;
}

.team-search input::-moz-placeholder {
  color: #e1e1e1;
}

.team-search input:-ms-input-placeholder {
  color: #e1e1e1;
}

.member-box .media-body {
}

.member-box .media-body p {
  font-size: 18px;
  font-weight: 500;
  color: #4d4d4d;
}

.member-box .media-body span {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #4d4d4d;
  letter-spacing: 0;
}

.tm-social a {
  display: inline-block;
  margin-left: 15px;
  font-size: 22px;
  color: #555;
}

.s-member {
  padding: 16px 15px 17px;
  background: #f9f9f9;
  margin: 15px 0;
}

/*-------------------- END Dashboard Two ------------------- */

/*-------------------- 4. Dashboard Three ------------------- */

.seo-fact {
  border-radius: 3px;
}

.sbg1 {
  background: var(--bg);
}

.sbg2 {
  background: var(--act_btn);
}

.sbg3 {
  background: var(--bg);
}

.sbg4 {
  background: var(--act_btn);
}

.seofct-icon {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
}

.seofct-icon i {
  font-size: 52px;
  margin-right: 20px;
  vertical-align: middle;
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  display: inline-block;
}

.seo-fact h2 {
  font-size: 27px;
  color: #fff;
  letter-spacing: 0;
}

.seo-fact #seolinechart3,
.seo-fact #seolinechart4 {
  max-width: 200px;
}

/* socialads */

.highcharts-credits {
  display: none;
}

/* user-statistics */

#user-statistics {
  height: 350px;
}

/* salesanalytic */

#salesanalytic {
  height: 500px;
}

/* timeline */

.timeline-area {
  padding-left: 52px;
  padding-top: 6px;
}

.timeline-task {
  position: relative;
  margin-bottom: 35px;
}

.timeline-task:before {
  content: "";
  position: absolute;
  left: -35px;
  top: 0;
  height: calc(100% + 33px);
  width: 1px;
  background: #e6cdff;
}

.timeline-task:last-child:before {
  height: 100%;
}

.timeline-task:last-child {
  margin-bottom: 0;
}

.timeline-task .icon {
  position: absolute;
  left: -52px;
  top: -6px;
  height: 35px;
  width: 35px;
  line-height: 35px;
  border-radius: 50%;
  text-align: center;
  font-size: 12px;
  color: #fff;
}

.bg1 {
  background: #5c6df4;
}

.bg2 {
  background: #19d0a2;
}

.bg3 {
  background: #f7cb3f;
}

.tm-title {
  margin-bottom: 6px;
}

.tm-title h4 {
  font-size: 14px;
  letter-spacing: 0;
  color: #333;
  margin-bottom: 2px;
}

.tm-title span.time {
  color: #8c8a8a;
  font-size: 13px;
}

.tm-title span.time i {
  margin-right: 5px;
  color: #2c3cb7;
  font-size: 11px;
}

.timeline-task p {
  color: #666;
  font-size: 14px;
  line-height: 25px;
  margin-bottom: -10px;
}

.timeline-task:last-child p {
  margin-bottom: 0;
}

#seomap {
  height: 300px;
  width: 100%;
}

.map-marker {
  /* adjusting for the marker dimensions
      so that it is centered on coordinates */
  margin-left: -8px;
  margin-top: -8px;
}

.map-marker.map-clickable {
  cursor: pointer;
}

.pulse {
  width: 10px;
  height: 10px;
  border: 5px solid #f7f14c;
  border-radius: 30px;
  background-color: #716f42;
  z-index: 10;
  position: absolute;
}

.map-marker .dot {
  border: 10px solid #fff601;
  background: transparent;
  border-radius: 60px;
  height: 50px;
  width: 50px;
  -webkit-animation: pulse 3s ease-out;
  animation: pulse 3s ease-out;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  position: absolute;
  top: -20px;
  left: -20px;
  z-index: 1;
  opacity: 0;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0);
    opacity: 0;
  }
  25% {
    -webkit-transform: scale(0);
    opacity: 0.1;
  }
  50% {
    -webkit-transform: scale(0.1);
    opacity: 0.3;
  }
  75% {
    -webkit-transform: scale(0.5);
    opacity: 0.5;
  }
  100% {
    -webkit-transform: scale(1);
    opacity: 0;
  }
}

.testimonial-carousel {
  margin: 60px 0 28px;
}

.tstu-img {
  width: 70px;
  width: 70px;
  border-radius: 50%;
  overflow: hidden;
  float: left;
  margin-right: 20px;
}

.tstu-content {
  overflow: hidden;
}

.tstu-name {
  font-size: 20px;
  color: #fff;
  letter-spacing: 0;
}

.profsn {
  display: block;
  font-size: 16px;
  color: #fff;
  letter-spacing: 0.02em;
  margin-bottom: 15px;
}

.tst-item p {
  color: #fff;
}

.testimonial-carousel .owl-dots {
  text-align: center;
  margin-top: 60px;
}

.testimonial-carousel .owl-dots > div {
  height: 11px;
  width: 11px;
  background: #fff;
  display: inline-block;
  border-radius: 50%;
  margin: 0 4px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.testimonial-carousel .owl-dots .active {
  background: #f7cb3f;
}

/*-------------------- END Dashboard Three ------------------- */

/*-------------------- 5. Bar Chart ------------------- */

#ambarchart1,
#ambarchart2,
#ambarchart3,
#ambarchart4,
#ambarchart5,
#ambarchart6 {
  height: 400px;
}

.amcharts-chart-div > a {
  display: none !important;
}

/*-------------------- END Bar Chart ------------------- */

/*-------------------- 6. Line Chart ------------------- */

#amlinechart1,
#amlinechart2,
#amlinechart3,
#amlinechart4,
#amlinechart5 {
  height: 400px;
}

/*-------------------- END Line Chart ------------------- */

/*-------------------- 7. Pie Chart ------------------- */

#ampiechart1,
#ampiechart2,
#ampiechart3,
#highpiechart4,
#highpiechart5,
#highpiechart6 {
  height: 400px;
  width: 100%;
}

/*-------------------- END Pie Chart ------------------- */

/*-------------------- 8. Accroding ------------------- */

.according .card {
  margin-bottom: 20px;
}

.according .card:last-child {
  margin-bottom: 0;
}

.according .card-header {
  padding: 0;
  border: none;
}

.according .card-header a {
  display: block;
  background: #eff3f6;
  padding: 10px 9px;
  border-radius: 3px;
  color: #000;
  letter-spacing: 0;
  font-size: 14px;
  font-weight: 500;
}

.according .card-body {
  padding: 10px;
  border: 1px solid #eff3f6;
  font-size: 14px;
  letter-spacing: 0;
  color: #444;
  line-height: 27px;
  font-weight: 400;
}

.according .card-header a {
  position: relative;
}

.accordion-s2 .card-header a.collapsed:before {
  content: "\f107";
}

.accordion-s2 .card-header a:before {
  content: "\f106";
  font-family: fontawesome;
  position: absolute;
  right: 13px;
  color: #444;
  font-size: 26px;
}

/* accordion-3 */

.accordion-s3 .card-header a.collapsed:before {
  content: "\e61a";
}

.accordion-s3 .card-header a:before {
  content: "\e622";
  font-family: "themify";
  position: absolute;
  right: 13px;
  color: #444;
  font-size: 14px;
}

.gradiant-bg .card-header a {
  background-image: -webkit-linear-gradient(top left, #6591f0, #a0ccea);
  background-image: linear-gradient(to bottom right, #6591f0, #a0ccea);
  color: #151515;
}

.gradiant-bg .card-header a:before {
  color: #fff;
}

.gradiant-bg-gray .card-header a {
  background-image: -webkit-linear-gradient(top left, #6c757d, #6c757d);
  background-image: linear-gradient(to bottom right, #6c757d, #6c757d);
  color: #fff;
}

.gradiant-bg-gray .card-header a:before {
  color: #fff;
}

/*-------------------- END Accroding ------------------- */

/*-------------------- 9. Alert------------------- */

.alert {
  letter-spacing: 0;
  font-size: 13px;
  border: none;
  padding: 10px 16px;
}

.alert strong,
.alert-link {
  font-weight: 600;
}

.alert-items .alert-primary {
  color: #4796ea;
  background-color: #c8e1fb;
}

.alert-items .alert-primary .alert-link {
  color: #4796ea;
}

.alert-items .alert-success {
  color: #36b398;
  background-color: #cff1ea;
}

.alert-items .alert-success .alert-link {
  color: #36b398;
}

.alert-items .alert-danger {
  color: #f96776;
  background-color: #ffdde0;
}

.alert-items .alert-danger .alert-link {
  color: #f96776;
}

.alert-items .alert-warning {
  color: #d6a20c;
  background-color: #f9efd2;
}

.alert-items .alert-warning .alert-link {
  color: #d6a20c;
}

/* additional content */

.alert-heading {
  margin-bottom: 7px;
}

.alert-dismiss .alert {
  padding: 13px 15px;
}

.alert-dismiss .alert-dismissible .close {
  top: 4px;
  outline: none;
  font-size: 13px;
}

/*-------------------- END Alert------------------- */

/*-------------------- 10. Badge------------------- */

.btn {
  padding: 11px 17px;
  font-size: 13px;
  letter-spacing: 0;
}

.btn-xl {
  padding: 19px 24px;
}

.btn-lg {
  padding: 15px 22px;
}

.btn-md {
  padding: 12px 19px;
}

.btn-sm {
  padding: 9px 14px;
}

.btn-xs {
  padding: 3px 10px;
}

.nav-pills .nav-link {
  padding: 16px 48px;
  padding: 1rem 3rem;
  line-height: 19px;
  background: #f0ebeb;
  border: 1px #000;
  color: #000;
}

/*-------------------- END Badge------------------- */

/*-------------------- 11. Button------------------- */

.btn-flat {
  border-radius: 0;
}

.btn-rounded {
  border-radius: 50px;
}

/*-------------------- END Button ------------------- */

/*-------------------- 12. Cards ------------------- */

.title {
  font-size: 18px;
  color: #444;
  margin-bottom: 10px;
}

.card-bordered {
  border: 1px solid rgba(0, 0, 0, 0.125);
}

p.card-text {
  margin-bottom: 23px;
}

/*-------------------- END Cards ------------------- */

/*-------------------- 13. Dropdown Button ------------------- */

.drop-buttons .btn {
  margin-bottom: 1.3em;
}

.dropdown-item {
  font-size: 14px;
}

/*-------------------- END Dropdown Button ------------------- */

/*-------------------- 14. List Group ------------------- */

.list-group-item {
  color: #444;
  font-size: 13px;
}

.media-body {
  font-size: 13px;
  line-height: 27px;
}

/*-------------------- END List Group ------------------- */

/*-------------------- 15. Modal ------------------- */

.child-media {
  padding-left: 100px;
}

.modal-dialog.modal-xl {
  max-width: 100%;
}

/*-------------------- END Modal ------------------- */

/*-------------------- 16. Pagination ------------------- */

.pg-color-border li a {
  border-color: #f36621;
}

.pagination li a {
  font-family: "Poppins", sans-serif;
}

/*-------------------- END Pagination ------------------- */

/*-------------------- 17. Form ------------------- */

.form-control,
.form-control:focus {
  outline: none;
  box-shadow: none;
}

.form-rounded {
  border-radius: 40px;
}

.form-control {
  font-size: 14px;
  border: 1px solid rgba(170, 170, 170, 0.3);
  padding: 10.72px 12.8px;
  padding: 0.67rem 0.8rem;
}

.form-control-sm,
.input-group-sm > .form-control,
.input-group-sm > .input-group-append > .btn,
.input-group-sm > .input-group-append > .input-group-text,
.input-group-sm > .input-group-prepend > .btn,
.input-group-sm > .input-group-prepend > .input-group-text {
  padding: 4px 8px;
  padding: 0.25rem 0.5rem;
  font-size: 11px;
  /* min-height: 30; */
}

.form-control-lg,
.input-group-lg > .form-control,
.input-group-lg > .input-group-append > .btn,
.input-group-lg > .input-group-append > .input-group-text,
.input-group-lg > .input-group-prepend > .btn,
.input-group-lg > .input-group-prepend > .input-group-text {
  padding: 13.6px 16px;
  padding: 0.85rem 1rem;
}

label {
  font-weight: 500;
  color: #1f1e1e;
  display: inline-block;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.font-14 {
  font-size: 14px;
}

.input-rounded {
  border-radius: 50px;
}

.custom-file-label,
.custom-file-input,
.custom-file {
  height: calc(2.25rem + 7px);
  padding: 10.8px 12px;
  padding: 0.675rem 0.75rem;
}

.custom-file-label:after {
  height: calc(calc(2.25rem + 7px) - 1px * 2);
  padding: 10.8px 12px;
  padding: 0.675rem 0.75rem;
}

.grid-col {
  padding: 10px 15px;
  background: #f3f8fb;
  margin-bottom: 30px;
  color: #666;
  border: 1px solid #e3e6e8;
}

.custom-control-label {
  margin-top: 2px;
}

.custom-control-label-2 {
  position: absolute;
  margin-top: 2px;
}

/* MY FORM FORMTING */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="website"]:focus,
input[type="phone"]:focus,
input[type="email"]:focus,
textarea:focus {
  border-color: #007bff !important; /* Change border color on focus */
  outline: none !important; /* Remove default outline */
}

/* Adjustments for smaller screens */
@media (max-width: 768px) {
  input[type="text"],
  input[type="password"],
  input[type="website"],
  input[type="email"],
  input[type="phone"],
  textarea,
  select {
    padding: 8px;
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  input[type="text"],
  input[type="password"],
  input[type="website"],
  input[type="email"],
  input[type="phone"],
  textarea,
  select {
    padding: 6px;
    font-size: 12px;
  }
}

/* END OF MY FORM FORMTING */

/*-------------------- END Form ------------------- */

/*-------------------- 18. Icons ------------------- */

.fw-icons {
}

.fw-icons a {
  color: #444;
  margin: 9px 0;
  display: inline-block;
  font-family: "Poppins", sans-serif;
}

.fw-icons a:hover {
  color: #f36621;
}

.fw-icons a i {
  width: 30px;
  font-size: 14px;
}

/* icon-container */

.icon-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.icon-container {
  cursor: pointer;
  -ms-flex-preferred-size: calc(100% * (1 / 4));
  flex-basis: calc(100% * (1 / 4));
}

.icon-container [class^="ti-"] {
  width: 30px;
  font-size: 14px;
  display: inline-block;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.icon-container:hover [class^="ti-"] {
  -webkit-transform: scale(2);
  transform: scale(2);
  -webkit-transform-origin: left center;
  transform-origin: left center;
}

.icon-container span.icon-name {
  color: #444;
  margin: 9px 0;
  display: inline-block;
  font-family: "Poppins", sans-serif;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.icon-container:hover span.icon-name {
  -webkit-transform: translateX(10px);
  transform: translateX(10px);
}

.icon-container:hover span {
  color: #f36621;
}

/*-------------------- END Icons ------------------- */

/*-------------------- 19. Table Basic ------------------- */

.single-table .table {
  margin-bottom: 0;
}

table tr th {
  border-bottom: none;
}

table tr th,
table tr td {
  border-top: 1px solid rgba(120, 130, 140, 0.13) !important;
}

table tr td [class^="ti-"] {
  cursor: pointer;
}

.table-bordered td,
.table-bordered th {
  border: 1px solid rgba(120, 130, 140, 0.13) !important;
}

.status-p {
  color: #fff;
  padding: 0px 10px 3px;
  border-radius: 20px;
  display: inline-block;
  text-transform: capitalize;
  vertical-align: middle;
}

/*-------------------- END Table Basic ------------------- */

/*-------------------- 20. Datatable ------------------- */

div.dataTables_wrapper div.dataTables_length select {
  width: 76px;
  margin: 0 10px;
}

/* datatable-primary */

.datatable-primary thead {
  background: #4336fb;
  color: #fff;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  border: none;
  background: transparent;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 0;
  border: none;
  margin-top: 20px;
}

table.dataTable.no-footer {
  border-bottom: 1px solid rgba(120, 130, 140, 0.13) !important;
}

table.dataTable thead th,
table.dataTable thead td {
  border-bottom-color: transparent;
}

.datatable-primary .dataTables_paginate .page-item.active .page-link,
.datatable-primary .dataTables_paginate .page-item .page-link:hover {
  background-color: #4336fb;
  border-color: #4336fb;
  color: #fff;
}

.datatable-primary .dataTables_paginate .page-link {
  color: #4336fb;
  border: 1px solid #4336fb;
}

.datatable-primary .dataTables_paginate .paginate_button.disabled,
.datatable-primary .dataTables_paginate .paginate_button.disabled:hover,
.datatable-primary .dataTables_paginate .paginate_button.disabled:active {
  color: #4336fb !important;
  border: none;
}

.datatable-primary .dataTables_paginate .page-item.disabled .page-link {
  color: #9f98f7;
  background-color: #f9f9f9;
  border-color: #c9c6f5;
}

/* datatable-dark */

.datatable-dark thead {
  background: #444;
  color: #fff;
}

.datatable-dark .dataTables_paginate .page-item.active .page-link,
.datatable-dark .dataTables_paginate .page-item .page-link:hover {
  background-color: #444;
  border-color: #444;
  color: #fff;
}

.datatable-dark .dataTables_paginate .page-link {
  color: #444;
  border: 1px solid #444;
}

.datatable-dark .dataTables_paginate .paginate_button.disabled,
.datatable-dark .dataTables_paginate .paginate_button.disabled:hover,
.datatable-dark .dataTables_paginate .paginate_button.disabled:active {
  color: #444 !important;
  border: none;
}

.datatable-dark .dataTables_paginate .page-item.disabled .page-link {
  color: #999;
  background-color: #f9f9f9;
  border-color: #999;
}

/*-------------------- END Datatable ------------------- */

/*-------------------- 21. Map Start ------------------- */

#mapamchart1,
#mapamchart2,
#mapamchart3,
#mapamchart4,
#mapamchart5,
#mapamchart6 {
  height: 400px;
}

#google_map {
  height: 600px;
}

/*-------------------- END Map Start ------------------- */

/*-------------------- 22. Invoice ------------------- */

.invoice-area {
}

.invoice-head {
  margin-bottom: 30px;
  border-bottom: 1px solid #efebeb;
  padding-bottom: 20px;
}

.invoice-head .iv-left span {
  color: #444;
}

.invoice-head span {
  font-size: 21px;
  font-weight: 700;
  color: #777;
}

.invoice-address h3 {
  font-size: 24px;
  text-transform: uppercase;
  font-weight: 600;
  color: #333;
  margin-bottom: 15px;
}

.invoice-address h5 {
  font-size: 17px;
  margin-bottom: 10px;
}

.invoice-address p {
  font-size: 14px;
  color: #555;
}

.invoice-date li {
  font-size: 14px;
  /* color: #555; */
  /* font-weight: 700; */
  margin-bottom: 0.4rem;
  font-family: "Poppins", sans-serif;
}

.invoice-table {
}

.invoice-table .table-bordered td,
.invoice-table .table-bordered th {
  border: 1px solid rgba(120, 130, 140, 0.13) !important;
  border-left: none !important;
  border-right: none !important;
}

.invoice-table tr td {
  color: #666;
}

.invoice-table tfoot tr td {
  text-transform: uppercase;
  font-weight: 600;
  color: #444;
}

.invoice-buttons a {
  display: inline-block;
  font-size: 14px;
  color: #fff;
  background: var(--btn);
  padding: 12px 19px;
  border-radius: 3px;
  text-transform: capitalize;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  letter-spacing: 0.03em;
  margin-left: 6px;
}

.invoice-buttons a:hover {
  background: #574494;
}

/*-------------------- END Invoice ------------------- */

/*-------------------- 23. Login ------------------- */

.login-area {
  background: #f3f8fb;
}

.login-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  min-height: 100vh;
}

.login-box form {
  margin: auto;
  width: 320px;
  max-width: 100%;
  background: #fff;
  border-radius: 15px;
  margin-right: 50px;
}

.list-group-item a {
  color: rgb(68, 68, 68);
}

.login-form-head {
  text-align: left;
  padding: 10px;
  padding-left: 30px;
  padding-top: 30px;
}

.login-form-head h4 {
  letter-spacing: 0;
  font-weight: 700;
  margin-bottom: 7px;
  color: #000;
  font-size: 16px;
}

.login-form-head p {
  color: #000;
  font-size: 13px;
  line-height: 18px;
  width: 250px;
}

.login-form-body {
  padding: 30px;
  padding-top: 50px;
  max-width: 320px;
}

.form-gp {
  margin-bottom: 25px;
  position: relative;
}

.form-gp label {
  position: absolute;
  left: 0;
  top: 0;
  color: #a3aaa4;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
}

.form-gp i {
  color: #a3aaa4 !important;
  font-size: 16px !important;
}

.form-gp.focused label {
  top: -15px;
  color: #000;
}

.form-gp input {
  width: 100%;
  height: 30px;
  border: none;
  border-bottom: 1px solid #e6e6e6;
}

.form-gp input::-webkit-input-placeholder {
  color: #dad7d7;
}

.form-gp input::-moz-placeholder {
  color: #dad7d7;
}

.form-gp input:-ms-input-placeholder {
  color: #dad7d7;
}

.form-gp input:-moz-placeholder {
  color: #dad7d7;
}

.form-gp i {
  position: absolute;
  right: 5px;
  color: #2b977f;
  font-size: 12px;
}

.form-gp.has-error,
.form-gp.has-error label,
.form-gp.has-error input,
.form-gp.has-error input::placeholder,
.form-gp.has-error i {
  color: var(--red);
}

.rmber-area {
  font-size: 12px;
  color: var(--btn);
}

.forgot-pass {
  font-size: 12px;
  color: var(--btn);
}

.submit-btn-area {
  text-align: left;
}

.submit-btn-area button {
  min-width: 80px;
  height: 30px;
  border: none;
  background: var(--btn);
  color: #fff;
  border-radius: 5px;
  text-transform: uppercase;
  letter-spacing: 0;
  font-weight: 600;
  font-size: 12px;
  box-shadow: 0 0 22px rgba(0, 0, 0, 0.07);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  padding: 0px 10px 0px 10px;
}

.submit-btn-area button:hover {
  background: #d8700f;
  color: #ffffff;
}

.submit-btn-area button i {
  margin-left: 5px;
  -webkit-transition: margin-left 0.3s ease 0s;
  transition: margin-left 0.3s ease 0s;
}

.submit-btn-area button:hover i {
  margin-left: 20px;
}

.login-other a {
  display: block;
  width: 100%;
  max-width: 250px;
  height: 43px;
  line-height: 43px;
  border-radius: 40px;
  text-transform: capitalize;
  letter-spacing: 0;
  font-weight: 600;
  font-size: 12px;
  box-shadow: 0 0 22px rgba(0, 0, 0, 0.07);
}

.login-other a i {
  margin-left: 5px;
}

.login-other a.fb-login {
  background: #2b977f;
  color: #fff;
}

.login-other a.fb-login:hover {
  box-shadow: 0 5px 15px rgba(44, 113, 218, 0.38);
}

.login-other a.google-login {
  background: #fb5757;
  color: #fff;
}

.login-other a.google-login:hover {
  box-shadow: 0 5px 15px rgba(251, 87, 87, 0.38);
}

.form-footer a {
  margin-left: 5px;
}

/* login-s2 */

.login-s2 {
  background: #fff;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.login-s2:before {
  content: "";
  position: absolute;
  height: 206%;
  width: 97%;
  background: #28a745;
  background: linear-gradient(
      0deg,
      rgba(0, 255, 51, 0.7),
      rgba(49, 147, 63, 0.7)
    ),
    url(../images/benue-state.jpg) center/cover no-repeat;
  border-radius: 50%;
  left: -42%;
  z-index: -1;
  top: -47%;
  box-shadow: inset 0 0 51px rgba(0, 0, 0, 0.1);
}

.login-s2 .login-form-head,
.login-s2 .login-box form,
.login-s2 .login-box form .form-gp input {
  background: transparent;
}

.login-s2 .login-form-head h4,
.login-s2 .login-form-head p {
  color: #444;
}

/* login-s3 */

.login-bg {
  background: url(../images/bg/Norakle-login.jpg) center/cover no-repeat;
  position: relative;
  z-index: 1;
}

.login-bg:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  height: 100%;
  width: 100%;
}

.login-bgmain {
  background: url(../images/bg/business-management-software.png) center/cover
    no-repeat;
  position: relative;
  z-index: 1;
}

.login-bgmain:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  height: 100%;
  width: 100%;
  background: #272727;
  opacity: 0.2;
}

/* register 4 page */

.login-box-s2 {
  min-height: 40vh;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.login-box-s2 form {
  margin: auto;
  background: #fff;
  width: 100%;
  max-width: 400px;
}

/*-------------------- END Login ------------------- */

/*-------------------- 24. Pricing ------------------- */

.pricing-list {
  text-align: center;
}

.prc-head h4 {
  background: var(--btn);
  color: #fff;
  padding: 10px;
  letter-spacing: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
}

.prc-list {
  padding: 30px;
}

.prc-list li a {
  display: block;
  font-size: 14px;
  letter-spacing: 0;
  margin: 23px 0;
  color: #6d6969;
}

.prc-list li.bold {
  font-weight: 600;
  margin-top: 20px;
}

.prc-list > a {
  display: inline-block;
  margin-top: 40px;
  background: var(--btn);
  color: #fff;
  padding: 11px 20px;
  border-radius: 40px;
}

.prc-list > a:hover {
  box-shadow: 0 3px 25px rgba(44, 113, 218, 0.38);
}

.dark-pricing .prc-head h4 {
  background: #3e3b3b;
  color: #fff;
}

.dark-pricing .prc-list > a {
  background: #3e3b3b;
}

.dark-pricing .prc-list > a:hover {
  box-shadow: 0 3px 25px rgba(27, 27, 27, 0.38);
}

/*-------------------- END Pricing ------------------- */

/*-------------------- 25. 404 Page ------------------- */

.error-area {
  min-height: 100vh;
  background: #f3f8fb;
}

.error-content {
  background: #fff;
  width: 100%;
  max-width: 600px;
  margin: auto;
  padding: 70px 30px;
}

.error-content h2 {
  font-size: 98px;
  font-weight: 800;
  color: #686cdc;
  margin-bottom: 28px;
  text-shadow: -3px -3px 0 #ffffff, 3px -3px 0 #ffffff, -3px 3px 0 #ffffff,
    3px 3px 0 #ffffff, 4px 4px 0 #6569dc, 5px 5px 0 #6569dc, 6px 6px 0 #6569dc,
    7px 7px 0 #6569dc;
  font-family: "Poppins", sans-serif;
}

.error-content img {
  margin-bottom: 50px;
}

.error-content p {
  font-size: 17px;
  color: #787bd8;
  font-weight: 600;
}

.error-content a {
  display: inline-block;
  margin-top: 40px;
  background: #656aea;
  color: #fff;
  padding: 16px 26px;
  border-radius: 3px;
}

/*-------------------- END 404 Page ------------------- */

/*-------------------- 26. Offset Sidebar ------------------- */

.offset-area {
  position: fixed;
  right: -320px;
  top: 0;
  height: 100vh;
  width: 320px;
  background: #f9f9f9;
  z-index: 998;
  box-shadow: -5px 0 20px rgba(0, 0, 0, 0.05);
  -webkit-transition: right 0.3s cubic-bezier(0.62, -0.01, 0.2, 0.83) 0s;
  transition: right 0.3s cubic-bezier(0.62, -0.01, 0.2, 0.83) 0s;
}

.show_hide.offset-area {
  right: 0;
}

.offset-close {
  font-size: 19px;
  position: absolute;
  left: 0;
  top: 0;
  height: 40px;
  width: 40px;
  cursor: pointer;
  text-align: center;
  line-height: 40px;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.offset-close:hover {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.offset-menu-tab {
  padding: 30px 20px;
}

.offset-menu-tab li {
  display: inline-block;
  width: 50%;
  text-align: center;
}

.offset-menu-tab li a {
  display: block;
  font-size: 16px;
  color: #444;
  font-weight: 600;
  font-family: "Poppins", sans-serif;
  position: relative;
  padding-bottom: 15px;
}

.offset-menu-tab li a.active {
  color: #853bfa;
}

.offset-menu-tab li a:before {
  content: "";
  position: absolute;
  bottom: 0;
  height: 5px;
  width: 100%;
  background: #853bfa;
  border-radius: 30px;
  -webkit-transition: all 0.3s cubic-bezier(0.91, 0.31, 0.31, 0.92) 0s;
  transition: all 0.3s cubic-bezier(0.91, 0.31, 0.31, 0.92) 0s;
}

.offset-menu-tab li a.active:before {
  left: 0;
}

.offset-menu-tab li a:before {
  left: 100%;
}

.offset-menu-tab li:last-child a:before {
  display: none !important;
}

.offset-content {
  padding: 15px;
}

.recent-activity {
  padding-top: 7px;
  padding-left: 53px;
}

.offset-settings h4 {
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  letter-spacing: 0;
  font-weight: 700;
  color: #444;
  margin-bottom: 23px;
}

.s-swtich input[type="checkbox"] {
  height: 0;
  width: 0;
  visibility: hidden;
  position: absolute;
}

.s-swtich label {
  cursor: pointer;
  text-indent: -9999px;
  width: 40px;
  height: 23px;
  background: #1bd4a6;
  display: block;
  border-radius: 100px;
  position: relative;
  margin: 0;
}

.s-swtich label:after {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 15px;
  height: 15px;
  background: #fff;
  border-radius: 90px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.s-swtich input:checked + label {
  background: #bada55;
}

.s-swtich input:checked + label:after {
  left: calc(100% - 5px);
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}

.s-swtich label:active:after {
  width: 40px;
}

.s-settings {
  margin-bottom: 30px;
}

.s-settings p {
  color: #888383;
  font-size: 14px;
}

.s-sw-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 20px;
}

.s-sw-title h5 {
  font-size: 16px;
  color: #555;
}

/*-------------------- END Offset Sidebar ------------------- */

/* Beginnin  of Dashboard Shortcut */
.shortcuts {
  text-align: center;
}

.shortcuts div {
  padding: 7px !important;
}

.shortcuts .shortcut {
  /* width: 22.50%; */
  /* display: inline-block; */
  padding: 12px 0;
  /* margin: 1em; */
  height: 105px;
  vertical-align: top;

  text-decoration: none;

  background: var(--btn);

  border-radius: 5px;
}

.shortcuts .shortcut .shortcut-icon {
  margin-top: 0.25em;
  margin-bottom: 0.25em;

  font-size: 32px;
  color: #fff;
}

.shortcuts .shortcut:hover {
  background: var(--act_btn);
}

.shortcuts .shortcut:hover span {
  color: #fff;
}

.shortcuts .shortcut:hover .shortcut-icon {
  color: #fff;
}

.shortcuts .shortcut-label {
  display: block;

  font-weight: 400;
  color: #f5f2f2;
}

/* Short Color 2 */
.shortcuts .shortcut2 {
  width: 22.5%;
  display: inline-block;
  padding: 12px 0;
  margin: 0 0.9% 1em;
  vertical-align: top;

  text-decoration: none;
  background: #f36621;
  border-radius: 5px;
}

.shortcuts .shortcut2 .shortcut-icon {
  margin-top: 0.25em;
  margin-bottom: 0.25em;

  font-size: 32px;
  color: #fff;
}

.shortcuts .shortcut2:hover {
  background: #b3450e;
}

.shortcuts .shortcut2:hover span {
  color: #fff;
}

.shortcuts .shortcut2:hover .shortcut-icon {
  color: #fff;
}

.shortcuts .shortcut2-label {
  display: block;

  font-weight: 400;
  color: #f5f2f2;
}

/* Green Background */
/* Short Color 2 */
.shortcuts .shortcut3 {
  width: 22.5%;
  display: inline-block;
  padding: 12px 0;
  margin: 0 0.9% 1em;
  vertical-align: top;

  text-decoration: none;
  background: #34ac05;
  border-radius: 5px;
}

.shortcuts .shortcut3 .shortcut-icon {
  margin-top: 0.25em;
  margin-bottom: 0.25em;

  font-size: 32px;
  color: #fff;
}

.shortcuts .shortcut3:hover {
  background: #3b740e;
}

.shortcuts .shortcut3:hover span {
  color: #fff;
}

.shortcuts .shortcut3:hover .shortcut-icon {
  color: #fff;
}

.shortcuts .shortcut3-label {
  display: block;

  font-weight: 400;
  color: #f5f2f2;
}
/* End of Shortcut */

/*
* ==========================================================
*     DASHBOARD COUNTS SECTION
* ==========================================================
*/
div.dashboard-counts .icon {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  min-width: 40px;
  max-width: 40px;
  border-radius: 50%;
}

div.dashboard-counts .title {
  font-size: 1.1em;
  font-weight: 300;
  color: #777;
  margin: 0 20px;
}

div.dashboard-counts .progress {
  margin-top: 10px;
  height: 4px;
}

div.dashboard-counts .number {
  font-size: 1.8em;
  font-weight: 300;
}

div.dashboard-counts .number strong {
  font-weight: 700;
}

div.dashboard-counts .number a {
  color: #000;
}

div.dashboard-counts .row {
  padding: 10px 15px;
  margin: 0;
}

div.dashboard-counts div[class*="col-"] .item {
  border-right: 1px solid #eee;
  padding: 15px 0;
}

div.dashboard-counts div[class*="col-"] .item2 {
  border-right: 1px solid #eee;
  padding: 40px 0;
}

div.dashboard-counts div[class*="col-"]:last-of-type .item {
  border-right: none;
}

/*  DASHBOARD COUNTS MEDIAQUERIES ------------------------ */
@media (max-width: 1199px) {
  div.dashboard-counts div[class*="col-"]:nth-of-type(2) .item {
    border-right: none;
  }
}

@media (max-width: 575px) {
  div.dashboard-counts div[class*="col-"] .item {
    border-right: none;
  }
}

/*=== Helpers ===*/
.text-bold {
  font-weight: 700;
}

.text-small {
  font-size: 0.9rem;
}

.text-xsmall {
  font-size: 0.8rem;
}

.bg-red {
  background: #ff7676 !important;
  color: #fff;
}

.bg-red:hover {
  color: #fff;
}

.bg-blue {
  background: #85b4f2 !important;
  color: #fff;
}

.bg-blue:hover {
  color: #fff;
}

.bg-yellow {
  background: #eef157 !important;
  color: #fff;
}

.bg-yellow:hover {
  color: #fff;
}

.bg-green {
  background: #54e69d !important;
  color: #fff;
}

.bg-green:hover {
  color: #fff;
}

.bg-orange {
  background: #ffc36d !important;
  color: #fff;
}

.bg-orange:hover {
  color: #fff;
}

.bg-violet {
  background: #796aee !important;
  color: #fff;
}

.bg-violet:hover {
  color: #fff;
}

.bg-gray {
  background: #ced4da !important;
}

.bg-white {
  background: #fff !important;
}

.text-red {
  color: #ff7676;
}

.text-red:hover {
  color: #ff7676;
}

.text-yellow {
  color: #eef157;
}

.text-yellow:hover {
  color: #eef157;
}

.text-green {
  color: #54e69d;
}

.text-green:hover {
  color: #54e69d;
}

.text-orange {
  color: #ffc36d;
}

.text-orange:hover {
  color: #ffc36d;
}

.text-violet {
  color: #796aee;
}

.text-violet:hover {
  color: #796aee;
}

.text-blue {
  color: #85b4f2;
}

.text-blue:hover {
  color: #85b4f2;
}

.text-gray {
  color: #ced4da;
}

.text-gray:hover {
  color: #ced4da;
}

.text-uppercase {
  letter-spacing: 0.2em;
}

.lh-2 {
  line-height: 2;
}

.page {
  background: #eef5f9;
}

.page .text-white {
  color: #fff;
}

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

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

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

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

.no-margin-bottom {
  margin-bottom: 0 !important;
}

.no-margin-top {
  margin-top: 0 !important;
}

.page {
  overflow-x: hidden;
}

.has-shadow {
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1),
    -1px 0 2px rgba(0, 0, 0, 0.05);
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1), -1px 0 2px rgba(0, 0, 0, 0.05);
}

.badge {
  font-weight: 400;
}

.badge-rounded {
  border-radius: 50px;
}

.list-group-item {
  border-right: 0;
  border-left: 0;
}

.list-group-item:first-child,
.list-group-item:last-child {
  border-radius: 0;
}

.overflow-hidden {
  overflow: hidden;
}

.tile-link {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 30;
}

.list-link {
  color: #000;
}

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}
.well blockquote {
  border-color: #ddd;
  border-color: rgba(0, 0, 0, 0.15);
}
.well-lg {
  padding: 24px;
  border-radius: 6px;
}
.well-sm {
  padding: 9px;
  border-radius: 3px;
}
.close {
  float: right;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=20);
}
.close:focus,
.close:hover {
  color: #000;
  text-decoration: none;
  cursor: pointer;
  filter: alpha(opacity=50);
}

.hidden {
  display: none;
}

thead.pos_head {
  background: #fff;
}

tr.pos {
  font-size: 11px;
  text-align: left;
  background: #fff;
  border: 0px;
}

td.pos_td {
  margin: 0px;
  padding: 0px;
  background: #fff;
}

td.pos_td input,
select {
  width: 100%;
  font-size: 11px;
  background: #fff;
}

td.pos_td .quickinput {
  width: 100%;
  font-size: 10px;
  background: #fff;
  height: 30px;
  border-radius: 0px;
}

td.pos_td .quickdisplay {
  font-size: 10px;
  font-weight: bold;
  text-align: right;
  border: 0px;
  background: #fff;
}

div.clear {
  padding-left: 10px;
}

div.clear .clearbox {
  font-size: 12px;
  font-weight: bold;
  border: 0px;
  background: #fff;
}

input.money {
  text-align: right;
}

.btn-primary {
  background: var(--btn);
  border: #347aca;
}

.btn-primary:hover {
  background: var(--btn);
  border: #2b4497;
}

.response {
  height: 60px;
}

.form-row {
  padding-bottom: 10px;
}
/*////////////////


/* Scrollable Table with Fixed Head */
.table-con {
  overflow: auto;
  max-width: 100%;
  min-height: 200px;
  max-height: 400px;
  position: relative;
  padding: 0px;
  margin: 0px;
  border: 1px solid #c1c1c1;
}

table.data-table {
  border-collapse: collapse;
  width: 100% !important;
}

.data-table thead th:first-child {
  width: 20px;
  padding: 0;
  border: 1px solid #000;
}

.data-table th {
  text-align: center;
  /*transition:transform .5s ease;*/
}

.data-table thead {
  background: white;
}

.data-table tbody tr td {
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  word-wrap: break-word;
  max-width: 100px;
  vertical-align: middle;
  text-align: left;
}
.data-table tbody td {
  border: 0px solid #aaa;
}
.data-table tbody tr:nth-child(even) td:not(:first-child) {
  background: #f3fcee;
}
.data-table tbody td:first-child {
  background: none;
  border: none;
  padding: 0;
}
.data-table th,
.data-table td {
  /* padding: 5px 5px; */
  word-wrap: break-word;
}

.data-table thead th {
  background: #6c757d !important;
  color: #fff;
  position: -webkit-sticky;
  position: sticky;
  border: 1px solid #6c757d;
  top: 0;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  word-wrap: break-word;
  vertical-align: middle;
  text-align: left;
  text-transform: capitalize;
}

.data-table td.money,
.table-bordered td.money,
.table-preview td.money,
.table-striped td.money {
  text-align: right;
}

.data-table td.leftme,
.table-bordered td.leftme,
.table-preview td.leftme {
  text-align: left;
}

.table-bordered td.rightme {
  text-align: right;
}

.pos tbody tr td {
  padding: 0px;
}

.pos tbody tr:nth-child(even) td:not(:first-child) {
  padding: 0px;
}

.module-body {
  padding: 15px;
}
.module-body.table {
  padding: 15px 0;
}
.module-body.table .table th,
.module-body.table .table td {
  padding-left: 15px;
  padding-right: 15px;
}
.module-foot {
  background: #f9f9f9;
  border-top: 1px solid #ddd;
  -webkit-border-radius: 0 0 2px 2px;
  -moz-border-radius: 0 0 2px 2px;
  border-radius: 0 0 2px 2px;
  padding: 15px;
}

.modal-header {
  background-color: var(--btn) !important;
  color: #fff;
}

.pagelink {
  color: #0069d9;
}

.nav-tabs .nav-link.active {
  background-color: #0069d9;
  border: 1px solid #b5b1b1;
  color: #fff;
}

.middle-header-bg {
  background: #f5f8f9;
}

.select_row tr:hover {
  background: #bcdaf7;
  outline: none;
  cursor: pointer;
}

.horizontal-menu .submenu-sub {
  left: 165px !important;
  top: 0 !important;
  min-width: 170px;
  border-top: none !important;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1) !important;
}

.horizontal-menu .submenu-sub li {
  display: block !important;
  width: 100% !important;
}

/* Dashboard */
.flex-container {
  display: grid;
  grid-template-columns: auto auto auto auto auto;
  grid-column-gap: 25px;
}
.welcome {
  width: 129px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
}
.company-name {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  color: #000000;
}
.welcomp {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
}
.dashdate {
  text-align: right;
  margin-right: 50px;
  margin-bottom: 5px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
}
.productsList {
  margin: 10px;
  padding-top: 50px;
  padding-bottom: 75px;
  font-size: 20px;
  box-sizing: border-box;
  background: #ffffff;
  color: var(--bg);
  border: 3px solid var(--bg);
  border-radius: 5px;
  height: 150px;
  width: 150px;
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 12px;
  line-height: 15px;
  /* identical to box height */
  text-align: center;
}
.ic-container {
  display: flex;
  flex-direction: column;
  column-gap: 2px !important;
}
.productsList i {
  padding-bottom: 15px;
  font-size: 28px;
  line-height: 32px;
}
div.productsList:hover {
  background: var(--bg);
  color: #ffffff;
}
p.productsText:hover {
  color: #ffffff;
}

.grid-container {
  display: grid;
  gap: 20px;
}
.subscription-status {
  width: 282px;
  height: 161px;
  background: #ffffff;
  border: 1px solid #d1d1d1;
  border-radius: 5px;
}
.subscrptbn {
  background-color: #0068ff !important;
}
.subscrptbn:hover {
  color: #ffffff;
}
.bulk-sms {
  width: 282px;
  height: 165px;
  background: #ffffff;
  border: 1px solid #d1d1d1;
  border-radius: 5px;
}
.online-payment {
  width: 284px;
  height: 240px;
  background: #ffffff;
  border: 1px solid #d1d1d1;
  border-radius: 5px;
}

.online-payment ul {
  margin-left: 20px;
}
.online-payment .circle {
  position: absolute;
  top: -10px;
  left: -21px;
  width: 30px;
  height: 30px;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  background: #d10c0c;
}
.new {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 11px;
  text-align: center;
  color: #ffffff;
}
.status-title {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  color: #333;
  text-transform: capitalize;
  margin-bottom: 17px;
}

.account-container {
  display: flex;
  gap: 20px;
  justify-content: center !important;
}
.accountList {
  padding: 20px;
  gap: 10px;
  width: 200px;
  height: 113px;
  background: #f5f5f5;
}

.accountList2 {
  padding: 20px;
  gap: 10px;
  width: 235px;
  height: 113px;
  background: #f5f5f5;
}

.account-title {
  width: 95px;
  height: 22px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 28px;
  line-height: 21px;
}

.account-title-2 {
  width: 95px;
  height: 22px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 28px;
  line-height: 21px;
}

.account-lines {
  width: 180px;
  height: 9px;
}

/* bulk sms page */
.heading-sms {
  height: 44px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 32px;
  letter-spacing: 0.02em;
  color: #0d6efd;
  padding: 2px 7px;
}

/* affiliate */
/* copy ref code */
.color__primary,
.color__secondary {
  display: flex;
  justify-content: space-between;
  top: 0px;
  left: 0px;
  width: 240px;
  padding: 10px 10px;
  font-size: 18px;
  border-radius: 8px;
  color: #fff;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
}

.color-1 {
  background-color: #0d6efd;
}

.copy {
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  opacity: 0.6;
  transition: all 0.1s ease;
}
.copy:hover {
  transform: translateY(-4px);
  opacity: 1;
}
.tooltip {
  position: absolute;
  top: 30px;
  left: -30px;
  background: #373737;
  padding: 10px 15px;
  display: flex;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  border-radius: 4px;
  letter-spacing: 1px;
  opacity: 0;
}
.tooltip.appear {
  animation: appear 1s ease;
}
.refcode {
  color: #fff;
  font-size: 18px;
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  20% {
    transform: translateY(10px);
    opacity: 1;
  }
  80% {
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* Responsive design */
/* Extra small devices (phones, 640px and down) */
@media only screen and (max-width: 529px) {
  .flex-container {
    display: grid;
    grid-column-gap: 0px;
    grid-template-columns: auto auto auto;
    justify-content: center;
  }
  .productsList {
    padding-top: 5px;
    height: 80px;
    width: 95px;
    text-align: center;
  }
  .ic-name {
    font-size: 10px;
    font-weight: 1000;
  }
  .grid-container {
    display: grid;
    place-content: center;
  }
  .account-container {
    display: grid !important;
    grid-template-columns: auto auto;
    height: auto;
    width: 100%;
    margin: 0 auto;
    padding-top: 10px;
  }
  .accountList {
    padding: 20px;
    gap: 10px;
    width: 160px;
    height: 110px;
  }

  .accountList2 {
    padding: 20px;
    gap: 10px;
    width: 260px;
    height: 110px;
  }

  .account-title {
    width: 100%;
    height: 22px;
    font-weight: 700;
    font-size: 25px;
  }
  .account-lines {
    width: 120px;
    height: 9px;
  }
  .dashdate {
    display: none;
  }
}
@media only screen and (min-width: 530px) and (max-width: 710px) {
  .flex-container {
    display: grid;
    grid-column-gap: 5px;
    grid-template-columns: auto auto auto auto;
    justify-content: center;
  }
  .productsList {
    padding-top: 5px;
    height: 90px;
    width: 105px;
    text-align: center;
  }
  .ic-name {
    font-size: 10px;
    font-weight: 1000;
  }
  .grid-container {
    display: grid;
    place-content: center;
  }
  .account-container {
    display: grid !important;
    grid-template-columns: auto auto auto auto;
    height: auto;
    width: 100%;
    margin: 0 auto;
    padding-top: 10px;
  }
  .accountList {
    width: 110px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .accountList2 {
    width: 200px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .account-title {
    width: 100%;
    height: 22px;
    font-weight: 700;
    font-size: 25px;
  }
  .account-lines {
    width: 70px;
    height: 9px;
  }
  .dashdate {
    display: none;
  }
  .grid-container {
    display: grid;
    gap: 5px;
    grid-template-columns: auto auto;
  }
}

@media only screen and (min-width: 711px) and (max-width: 776px) {
  .flex-container {
    display: grid;
    grid-column-gap: 5px;
    grid-template-columns: auto auto auto auto;
    justify-content: center;
  }
  .productsList {
    padding-top: 5px;
    height: 115px;
    width: 130px;
    text-align: center;
  }
  .account-container {
    display: grid !important;
    grid-template-columns: auto auto auto auto;
    height: auto;
    width: 100%;
    padding-top: 10px;
  }
  .accountList {
    width: 140px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .accountList2 {
    width: 200px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .account-title {
    width: 100%;
    height: 22px;
  }
  .account-lines {
    width: 100px;
    height: 9px;
  }
  .ic-name {
    font-size: 10px;
    font-weight: 1000;
  }
  .ic-container {
    padding-top: 25px;
  }
  .grid-container {
    display: grid;
    grid-template-columns: auto auto;
    place-content: center;
  }
  .dashdate {
    display: none;
  }
}
@media only screen and (min-width: 777px) and (max-width: 990px) {
  .flex-container {
    display: grid;
    grid-template-columns: auto auto auto auto;
  }
  .productsList {
    text-align: center;
  }
  .ic-container {
    padding-top: 5px;
  }
  .grid-container {
    display: grid;
    grid-template-columns: auto auto;
    place-content: center;
  }
  .account-container {
    display: grid !important;
    grid-template-columns: auto auto auto auto;
    height: auto;
    width: 100%;
    padding-top: 10px;
  }
  .accountList {
    width: 170px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .accountList2 {
    width: 270px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .account-title {
    width: 100%;
    height: 22px;
  }
  .account-lines {
    width: 130px;
    height: 9px;
  }
  .ic-name {
    font-size: 10px;
    font-weight: 1000;
  }
  .dashdate {
    display: none;
  }
}

@media only screen and (min-width: 991px) and (max-width: 1200px) {
  .flex-container {
    display: grid;
    grid-template-columns: auto auto auto auto;
  }
  .productsList {
    height: 120px;
    width: 120px;
    text-align: center;
  }
  .grid-container {
    display: grid;
    grid-template-columns: auto;
    place-content: center;
  }
  .account-container {
    display: grid !important;
    grid-template-columns: auto auto auto auto;
    height: auto;
    width: 100%;
    padding-top: 10px;
  }
  .accountList {
    width: 140px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .accountList2 {
    width: 200px;
    height: 110px;
    text-align: center;
    font-weight: 1000;
  }

  .account-title {
    width: 100%;
    height: 22px;
  }
  .account-lines {
    width: 102px;
    height: 9px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1310px) {
  .flex-container {
    gap: 5px;
  }
  .account-container {
    display: grid !important;
    grid-template-columns: auto auto auto auto;
    height: auto;
    width: 100%;
    padding-top: 10px;
  }
  .accountList {
    padding-top: 20px;
    width: 200px;
    height: 113px;
    text-align: center;
    font-weight: 1000;
  }

  .accountList2 {
    padding-top: 20px;
    width: 300px;
    height: 113px;
    text-align: center;
    font-weight: 1000;
  }

  .account-title {
    width: 100%;
    height: 22px;
  }
  .account-lines {
    width: 160px;
    height: 9px;
  }
}

/* Project Task */
.periodhead {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  color: #0d6efd;
}
.periodBtnBg li {
  display: inline;
  padding: 10px;
  margin: 5px;
  padding: 10px 30px;
  background: #f3f8fb;
  border-radius: 20px;
  text-align: center;
}
.periodBtn {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  color: #0068ff;
}

.reportTaskDate {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: #000000;
}
.reportTaskInput {
  width: 150px;
  height: 30px;
  background: #ffffff;
  border: 1px solid #c0c0c0;
  border-radius: 15px;
}
.reportTaskBtn {
  background: #0068ff;
  padding: 10px 30px;
  border-radius: 0px;
}

#workflow_attachment_label {
  cursor: pointer;
}

#workflow_attachment {
  opacity: 0;
  position: absolute;
  z-index: -1;
}

.image-with-notify {
  position: relative;
  padding-top: 20px;
  display: inline-block;
}
.notify-badge {
  position: absolute;
  right: -0px;
  top: 10px;
  background: var(--btn);
  text-align: center;
  border-radius: 20px 20px 20px 20px;
  color: white;
  padding: 0px 5px;
  font-size: 10px;
}

.notify-badge-danger {
  position: absolute;
  right: -0px;
  top: 10px;
  background: red;
  text-align: center;
  border-radius: 20px 20px 20px 20px;
  color: white;
  padding: 0px 5px;
  font-size: 10px;
}

#x {
  position: absolute;
  color: red;
  top: 10px;
  right: -5px;
  border: solid red 1px;
  border-radius: red solid 20px 20px 20px 20px;
}

#myarrow-right {
  position: absolute;
  color: #282626;
  top: 100px;
  right: -5px;
  border-radius: 20px 20px 20px 20px;
}

.tableboradered {
  border: 1px solid black;
}

.tableboradered thead th {
  border-top: 1px solid #000 !important;
  border-bottom: 1px solid #000 !important;
  border-left: 1px solid #000 !important;
  border-right: 1px solid #000 !important;
}

.tableboradered tr td {
  border-left: 1px solid #000 !important;
  border-right: 1px solid #000 !important;
  border-top: 1px solid #000 !important;
  border-bottom: 1px solid #000 !important;
}

.bold {
  font-weight: bold;
}

.inbox_people {
  background: #f8f8f8 none repeat scroll 0 0;
  float: left;
  overflow: hidden;
  width: 25%;
  border-right: 1px solid #c4c4c4;
}
.inbox_msg {
  border: 1px solid #c4c4c4;
  clear: both;
  overflow: hidden;
}
.top_spac {
  margin: 20px 0 0;
}

.srch_bar {
  display: inline-block;
  text-align: right;
  width: 100%;
}
.headind_srch {
  padding: 10px 9px 10px 10px;
  overflow: hidden;
  border-bottom: 1px solid #c4c4c4;
}

.recent_heading h4 {
  color: #05728f;
  font-size: 21px;
  margin: auto;
}
.srch_bar input {
  border: 1px solid #cdcdcd;
  border-width: 0 0 1px 0;
  width: 80%;
  padding: 2px 0 4px 6px;
  background: none;
}
.srch_bar .input-group-addon button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  padding: 0;
  color: #707070;
  font-size: 18px;
}
.srch_bar .input-group-addon {
  margin: 0 0 0 -27px;
}

.chat_ib h5 {
  font-size: 15px;
  color: #464646;
  margin: 0 0 2px 0;
}
.chat_ib h5 span {
  font-size: 13px;
  float: right;
}
.chat_ib p {
  font-size: 14px;
  color: #989898;
  margin: auto;
}
.chat_img {
  float: left;
  width: 11%;
}
.chat_ib {
  float: left;
  padding: 0 0 0 15px;
  width: 88%;
}

.chat_people {
  overflow: hidden;
  clear: both;
}
.chat_list {
  border-bottom: 1px solid #c4c4c4;
  margin: 0;
  padding: 5px 10px 5px;
}
.inbox_chat {
  max-height: 550px;
  height: auto;
  overflow-y: scroll;
}

.active_chat {
  background: #ebebeb;
}

.incoming_msg_img {
  display: inline-block;
  width: 6%;
}
.received_msg {
  display: inline-block;
  padding: 0 0 0 10px;
  vertical-align: top;
  width: 92%;
}
.received_withd_msg p {
  background: #ebebeb none repeat scroll 0 0;
  border-radius: 3px;
  color: #646464;
  font-size: 14px;
  margin: 0;
  padding: 5px 10px 5px 12px;
  width: 100%;
}
.time_date {
  color: #747474;
  display: block;
  font-size: 12px;
  margin: 8px 0 0;
}
.received_withd_msg {
  width: 100%;
}
.mesgs {
  float: left;
  padding: 5px 5px 0 15px;
  width: 75%;
}

.mesgs2 {
  float: left;
  padding: 30px 15px 0 25px;
  width: 100%;
}

.sent_msg p {
  background: #05728f none repeat scroll 0 0;
  border-radius: 3px;
  font-size: 14px;
  margin: 0;
  color: #fff;
  padding: 5px 10px 5px 12px;
  width: 100%;
}
.outgoing_msg {
  overflow: hidden;
  margin: 26px 0 26px;
}
.sent_msg {
  float: right;
  width: 86%;
}
.input_msg_write input {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: medium none;
  color: #4c4c4c;
  font-size: 14px;
  min-height: 48px;
  width: 100%;
}

.type_msg {
  border-top: 1px solid #c4c4c4;
  position: relative;
}
.msg_send_btn {
  background: #05728f none repeat scroll 0 0;
  border: medium none;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  font-size: 17px;
  height: 33px;
  position: absolute;
  right: 0;
  top: 11px;
  width: 33px;
}
.messaging {
  padding: 0 0 50px 0;
}
.msg_history {
  height: auto;
  max-height: 516px;
  overflow-y: auto;
}

#Quotations {
  border: 2px solid #f36621 !important;
  transition: all 300ms linear;
}
#Quotations:hover {
  cursor: pointer;
  border-radius: 0%;
  border: 2px solid white;
  transform: scale(1.1);
}
#Quotations > h5 {
  color: #0068ff;
}
#opportunities {
  border: 2px solid rgb(115, 207, 115) !important;
  transition: all 300ms linear;
}
#opportunities:hover {
  cursor: pointer;
  border-radius: 0%;
  border: 2px solid white;
  transform: scale(1.1);
}
#opportunities > h5 {
  color: #0068ff;
}
#Current_month {
  border: 2px solid red !important;
  transition: all 300ms linear;
}
#Current_month:hover {
  cursor: pointer;
  border-radius: 0%;
  border: 2px solid white;
  transform: scale(1.1);
}
#Current_month > h5 {
  color: #02021b;
}

.dash_card {
  border: 2px solid #3a3afb !important;
  transition: all 300ms linear;
}

.dash_card:hover {
  cursor: pointer;
  border-radius: 0%;
  border: 2px solid white;
  transform: scale(1.1);
}
.dash_card:hover > p {
  color: white;
}
.dash_card > h5 {
  color: #0068ff;
}

.red {
  color: red;
}

.bg-transparent {
  background: transparent !important;
}

.ui-autocomplete {
  z-index: 1000 !important; /* or higher, depending on your layout */
}

/* Multi file uplaod with drag and drop */
.drop-zone {
  width: 100%;
  border: 2px dashed var(--bg);
  border-radius: 5px;
  padding: 20px;
  text-align: center;
  margin-bottom: 20px;
  cursor: pointer;
}
.drop-zone.hover {
  border-color: #cedff4;
}
.file-preview {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  padding: 5px;
  border-radius: 5px;
  position: relative;
}
.file-preview img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  margin-right: 10px;
}
.remove-file {
  cursor: pointer;
  color: red;
  position: absolute;
  top: 5px;
  right: 5px;
}
.file-list {
  display: flex;
  flex-wrap: wrap;
}
.file-item {
  flex: 1 0 18%; /* Adjusts the width to fit 5 columns per row */
  margin: 5px;
}
/* End of Product Multi file uplaod */

/* Single Image upload starts here */
#thumbnail-drop-zone {
  max-width: 250px;
  border: 2px dashed var(--bg);
  border-radius: 5px;
  padding: 20px;
  text-align: center;
  margin-bottom: 20px;
  cursor: pointer;
}

#thumbnail-preview {
  max-width: 100px; /* Limit the width of the preview */
  max-height: 100px; /* Limit the height of the preview */
  display: none; /* Initially hide the preview */
}

#thumbnail-drop-zone.hover {
  border-color: #cedff4; /* Change border color on hover */
}
/* End of Single Image upload  */

/* //////////////////// printing long record with proper breaking */
.printableArea table {
  border-collapse: collapse; /* optional but helps */
  width: 100%;
}

.printableArea tr {
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}

/* /////////////////////// widzard */
.step-wizard {
  display: flex;
  justify-content: center;
}
.step-wizard-list {
  display: flex;
  position: relative;
  width: 85%;
  justify-content: space-between;
}
.step-wizard-item {
  text-align: center;
  position: relative;
  flex: 1;
  cursor: pointer;
}
.step-wizard-item::after {
  content: "";
  position: absolute;
  top: 20px;
  right: -50%;
  height: 2px;
  width: 100%;
  background: #ccc;
  z-index: 0;
}
.step-wizard-item:last-child::after {
  display: none;
}
.step-wizard-item .progress-count {
  height: 40px;
  width: 40px;
  background: #ccc;
  border-radius: 50%;
  display: inline-block;
  line-height: 40px;
  color: white;
  font-weight: bold;
  z-index: 1;
  position: relative;
}
.step-wizard-item.active .progress-count {
  background: #007bff;
}
.step-wizard-item.completed .progress-count {
  background: #28a745;
}
.step-wizard-item .progress-label {
  margin-top: 10px;
  display: block;
  font-size: 14px;
}
/* /////////////////////// End of widzard */

/* Full  Screen Model*/
/* Custom full screen modal style for Bootstrap 4 */
.modal-fullscreen {
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  margin: 0;
  padding: 0;
}

.modal-fullscreen .modal-content {
  height: 100vh;
  border: none;
  border-radius: 0;
  overflow: hidden; /* Prevent weird shadow fading */
  display: flex;
  flex-direction: column;
}

.modal-fullscreen .modal-body {
  overflow-y: auto;
  flex: 1 1 auto;
}
/* Full  Screen Model*/

/* Payment Selection Options */
.payment-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    width: 100%;
    /* background:#E0E0E0; */
    /* padding: 10px; */
}

.pay-box {
    background: #ffffff;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #dcdcdc;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    min-height: 100px;
    margin-bottom: 15px;
}

.pay-box h4 {
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 8px;
    color: #444;
}

.pay-box input,
.pay-box select {
    height: 25px !important;
    font-size: 13px;
}

.pay-btn {
    width: 100%;
    padding: 7px;
    font-size: 12px;
    border: none;
    border-radius: 6px;
    margin-bottom: 8px;
    font-weight: bold;
    color: #fff;
}

.pay-btn.cash     { background:#28a745; }
.pay-btn.pos      { background:#17a2b8; }
.pay-btn.transfer { background:#6f42c1; }
.pay-btn.wallet   { background:#ffc107; color:#000; }

.total-box input {
    height: 40px !important;
    font-size: 20px;
    font-weight: bold;
    border: 2px solid red !important;
    color: red;
    background: #fff1f1;
}

/* Container for checkbox + label */
.check-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    margin-top: 5px;
}

/* Hide default checkbox */
.check-row input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px !important;
    border: 2px solid #888;
    border-radius: 4px;
    position: relative;
    cursor: pointer;
    transition: all 0.2s ease;
}

/* Checkbox checked style */
.check-row input[type="checkbox"]:checked {
    background: #007bff;
    border-color: #007bff;
}

/* Checkbox checkmark */
.check-row input[type="checkbox"]:checked::after {
    content: "✔";
    font-size: 14px;
    color: #fff;
    position: absolute;
    top: -2px;
    left: 3px;
}

/* Label beside checkbox */
.check-row label {
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    margin: 0;
}

/* Spacing fix for inputs in pay-box */
.pay-box input.form-control {
    margin-top: 5px;
}
/* End of Payment Selection Options */