:root{
	--color1: #2860a9;
	--color2: #28a745;
	--color3: #212121;
}
body{
	--bs-body-font-family: 'Roboto', sans-serif;
}
img{
	max-width: 100%;
}
.bg-blue{
	background-color: var(--color1);
}
.btn-primary {
  --bs-btn-bg: var(--color1);
  --bs-btn-border-color: var(--color1);
  --bs-btn-hover-bg: var(--color1);
  --bs-btn-hover-border-color: var(--color1);
  --bs-btn-active-bg: var(--color1);
  --bs-btn-active-border-color: var(--color1);
  --bs-btn-disabled-bg: var(--color1);
  --bs-btn-disabled-border-color: var(--color1);
}


.login-form-outer .login-form{
  max-width: 400px;
  width: 100%;
}


.sidebar {
  padding-top: 100px;
  width: 300px;
  transition: all .2s linear;
}
.sidebar .menu-item, .sidebar .menu-item a{
	color: var(--color3);
}
.sidebar .menu-item.active, .sidebar .menu-item.active a{
	color: var(--color1);
}


.app-content{  
  width: calc(100% - 300px);
  padding-top: 67px;
  background: #f5f7fa;
}
.add-edit-card {
  max-width: 950px;
}
.cms-table{
  font-size: 14px;
}

@media(max-width:767px){

.header .logo-img {
  width: 200px;
}
.header .user .user-image{
  width: 30px;
  height: 30px;
}
.header .user .username{
  font-size: 14px;
}
.app-content{  
  width: 100%;
}
.sidebar:not(.active) {
  left: -100% !important;
}
.cms-table .table {
  min-width: 700px;
}

}