.btn {
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
}

.btn:hover {
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
  transition: .3s;
}

.btn:focus {
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
  transition: .3s;
  outline: 0 !important;
}

.btn:active {
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
  transition: .05s;
  border-color: transparent;
  outline: 0 !important;
}

.btn:disabled {
  box-shadow: none !important;
}

.btn-outline-primary {
  background-color: rgba(3, 142, 220, .1);
}


.btn-outline-secondary {
  background-color: rgba(116, 120, 141, .1);
}

.btn-outline-success {
  background-color: rgba(81, 210, 140, .1);
}

.btn-outline-info {
  background-color: rgba(95, 208, 243, .1);
}

.btn-outline-warning {
  background-color: rgba(247, 204, 83, .1);
}

.btn-outline-danger {
  background-color: rgba(243, 78, 78, .1);
}


.vertical-menu {
  background: transparent;
  background-image: url(../images/bg-themes/2.png) !important;
  background-size: 100% 100% !important;
  background-attachment: fixed !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.authentication-bg {
  background-image: url(../images/bg-themes/9.png) !important;
}

.auth-img {
  background-image: url(../images/bg-themes/10.png);
}

.navbar-brand-box {
  background: transparent;
}

#sidebar-menu ul li.mm-active>a {
  color: rgb(255 255 255 / 85%) !important;
  background: rgb(255 255 255 / 18%) !important;
}

#sidebar-menu ul li.mm-active .mm-show .mm-active>a {
  color: rgb(255 255 255 / 85%) !important;
  background: rgb(255 255 255 / 18%) !important;
}

#sidebar-menu ul li a {
  margin: 0;
}

/* .main-content {
  background: transparent;
  background-image: url(../images/bg-themes/9.png) !important;
  background-size: 100% 100% !important;
  background-attachment: fixed !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
} */

#sidebar-menu ul li a:active,
#sidebar-menu ul li a:focus,
#sidebar-menu ul li a:hover {
  color: rgb(255 255 255 / 85%) !important;
}


#sidebar-menu ul li a {
  color: hsla(0, 0%, 100%, .5);
}

.menu_icon_position {
  margin-left: 5px;
  margin-right: 5px;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  color: #74788d;
  background-color: transparent;
  border-bottom: 2px solid #eff0f2;
  border-color: #74788d;
}

.logo-text {
  font-size: 22px;
  margin-left: 10px;
  margin-bottom: 0;
  letter-spacing: 1px;
  color: #ffffff;
}

.navbar-brand-box {
  display: flex;
  padding-top: 15px;
  align-items: center;
  color: #FFFFFF;
  padding-bottom: 10px;
}

.logo-text {
  margin-left: 5px;
  font-size: 22px;
}

/***********************************************************/
.shadow {
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2) !important;
  border: 1px solid #AFAFAF;
}

.top2 {
  margin-top: 2px;
}

.top10 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.top20 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.width60 {
  width: 60px;
}

.width100 {
  width: 100px;
}

.width135 {
  width: 170px;
}

.width160 {
  width: 160px;
}

.width300 {
  width: 300px;
}

.text-right {
  text-align: right !important;
}

.template_object {
  margin-bottom: 10px;
  margin-top: 10px;
  margin-left: 20px;
}

.icon_operation {
  position: absolute;
  top: 0;
  right: 0;
  padding: 0.95rem 1.25rem;
}

.inner-card {
  width: 95%;
  margin: 20px auto;
}

.border-secondary {
  border-color: #9F9F9F !important;
}

.max100 {
  max-width: 100%;
  max-height: 100%;
}

.image_action {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 50%;
  /* background: rgba(0, 0, 0, .7); */
  background: rgba(81,210,140,.1);
  border-color: #51d28c!important;
  color: #51d28c !important;
  position: absolute;
  box-shadow: 0 0 4px rgb(0 0 0 / 50%);
  right: 2.2rem;
  font-size: 1.1rem;
  bottom: 0.5rem;
  color: #FFFFFF;
}

.image_action:hover {
  color: #fff !important;
  background-color: #51d28c!important;
  border-color: #51d28c;
}

.switchery{
  border-radius: 3px !important;
}

.switchery>small {
  border-radius: 3px !important;
}

.right50{
  margin-right: 50px !important;
}

.top25{
  margin-top: 25px !important;
}

.text-center{
  text-align: center;
}

.width90{
  width: 135px !important;
}

.btn_toggle {
  right: 15px;
  bottom: -17px;
}

.label_count{
  width: 30px;
  text-align: center;
}

.width30{
  width: 35px;
}

.btn-full{
  width: 100%;
}

.btn-width30{
  width: 30% !important;
}

.btn-width67{
  width: 67% !important;
}

.btn-width97{
  width: 97% !important;
}

.margin_count{
  margin-left: 10px;
  margin-right: 10px;
}

.backgroud-header-gray{
  /* background-color: #74788d !important; */
  background-color: #DCDCDC !important;
  /* color: white !important; */
}

.info_cell{
  width: 25%;
}

.backgroud-header-gray2{
  background-color: #DCDCDC !important;
}

.max200{
  max-width: 200px !important;
  max-height: 200px !important;
}

.font-12{
  font-size: 12px;
} 

.width-100{
  width: 100%;
}

.right20{
  margin-right: 20px;
}

.modal-preview {
  max-width: 1300px;
  height: 860px;
}

.font-40{
  font-size: 40px;
}

.font-red{
  color: #f34e4e;
}

body[data-sidebar-size=sm] #page-topbar {
  left: 10px;
}

body[data-sidebar-size=sm] .main-content {
  margin-left: 10px;
}

.page-content {
  padding: calc(20px) calc(20px / 2) 60px calc(20px / 2);
}

#page-topbar{
  position: inherit;
}

.main-content {
  margin-left: 0px;
}