@media (min-width: 840px) {
		  #main {
    width: 100%;
    left: 2%;		
}
		
		.stuck {

  right: unset!important;
  
}
		
		.header, .header-wrapper {

  width: 230px!important;
 
}
		.header  {
position: fixed !important;
left: 0!important; 
z-index: 9; 
transition: 0.5s;     
width: 230px !important;
}
		
		   .header-bg-color{
    background:#150f0f !important;
    height:120vh;
		   filter: drop-shadow(-1px 3px 20px rgba(0, 0, 0, 0.25));
   }
		
		.header-wrapper ul li {
list-style-type: none !important;
}
		
		.nav > .menu-item > a {
cursor: pointer ;
color: #fff ;
border-radius: 7px;
font-size: 13px ;
display: flex;
gap: 10px;
height: 50px;
	margin-bottom: 10px;
padding: 0 8px;
width:200px;
}
		
		.header-bottom-nav.nav > li a:hover {
background: linear-gradient(to top, #f40000, #dd5f11);
}
	
		
		.header-bottom-nav.nav > li.active > a {
background: linear-gradient(to top, #f4a000, #dd5f11);

;
}
	.header-wrapper .menu-item.nav-dropdown-bold {
position: relative !important;
}
	
	.header-wrapper .ux-menu-icon {
height: 24px;
width: 24px;
}
		
		.sub-menu {
position: absolute;
border: 2px solid #efefef;
border-radius: 5px;
top: 	0px;
list-style-type: none;
margin-left: 110%;
padding: 8px;
background: #31a3ff;
min-width: 150px;
opacity: 0;
visibility: hidden;
transition: 0.3s;
color:#fff !important;
}

.header-wrapper .menu-item.nav-dropdown-bold:hover > .sub-menu {
opacity: 1;
visibility: visible;
}

.header-wrapper .sub-menu>.menu-item {
margin: 0;
}

.header-wrapper .sub-menu>.menu-item>a {
cursor: pointer;
color: #f1f1f1;
font-size: 14px;
display: block;
padding: 4px 10px;
white-space: nowrap;
}

.nav .sub-menu>.menu-item>a:hover {
color: #fff;
}
.sidebar-switch {
  z-index:99;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: absolute;
    color: #fff;
    top: 50%;
    transform: translateY(-50%);
    right: -15px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(to top, #f40000, #dd5f11);
}
.sidebar-switch svg {
width: 30px;
height: 30px;
}
.header .hide {
width: 75px !important;
}

.header .hide .logo {
    margin-left: 0;
    margin-right: 0px;
}

.header-wrapper.hide ul li a {
text-indent: -9999px !important;
width: 50px !important;
gap: 0;
justify-content: center;
          margin-left: -10px;
}
.header-wrapper.hide .sidebar-switch {
    transform: rotate(180deg);
}
.has-dropdown .icon-angle-down{
    display:none !important;
  }
.nav{
  flex-flow: column !important;
  left:0px !important;
  align-items: flex-start !important;
}
  .header .hide .sub-menu{
    display:none;
  }
  .nav li:first-child {
    margin-left: 6px !important;
}
		
		
		
		
		
		
}

#bt1{
	background:red;
	border-radius:5px;
	color:white;
	font-size: 14px;
	padding:10px 20px 10px 20px;

}
#bt2{
	background:#33c85d;
	border-radius:5px;
	color:white;
	font-size:14px;
	padding:10px 20px 10px 20px;
}
#bt1:hover{
	background:#33c85d;
	color:white;
	border-radius:5px;
	font-size: 14px;
	padding:10px 20px 10px 20px;
}
#bt2:hover{
	background:red;
	border-radius:5px;
	color:white;
	font-size: 14px;
	padding:10px 20px 10px 20px;
}

.nav > .html > a {
	margin-bottom: 10px;}