@media screen and (max-width:1439px) {

	.header .profile { padding: 10px; }

	.header .close-buttom { padding: 10px; }

	.header .notifications { padding: 10px; }

}

@media screen and (max-width:1260px) {

	:root { 
		--layout-sidebar-width: 230px; 
		--layout-sidebar-offset: 230px;
	}

	

}

@media screen and (max-width:1030px) {

}

@media screen and (max-width:960px) {

	html {position:relative; width:100%; min-width:315px;}

	body {position:relative; width:100%;}

	* {-webkit-overflow-scrolling:touch;}

	.wrapper {width:calc(100% - 20px)!important; padding-left: 8px; padding-right: 8px;}

	.all-content { width: 100%; }

	#body-conten .content-page { width: calc(100% - 20px ); margin: 0 auto; }

	:root { 
		--layout-sidebar-offset: 0px; 
		--layout-sidebar-width: 230px;
		--layout-header-height: 64px;
	}

	.header { 
		height: var(--layout-header-height);
		padding: 0 8px;
		flex-wrap: nowrap;
		gap: 8px;
		overflow-x: hidden;
	}

	.all-content { padding-top: var(--layout-header-height); margin-left: 0; }

	.header .topbar-logo { 
		display: none !important;
		order: 0;
		width: var(--layout-sidebar-width);
		min-width: var(--layout-sidebar-width);
		height: 100%;
		padding: 0;
		margin-right: 0;
		border-right: 1px solid rgba(0, 0, 0, 0.08);
		background: #FF6A39;
	}

	.header .topbar-logo svg {
		height: 32px;
	}

	.header .topbar-logo svg path,
	.header .topbar-logo svg rect {
		fill: #fff;
	}

	.header .topbar-logo .st0 {
		fill: #fff !important;
	}

	.header .topbar-logo .st1 {
		stroke: #fff !important;
	}

	.header .open-menu { display: block; order: 1; margin-right: 6px; margin-left: 0; }

	.header .notifications { order: 3; padding: 4px 0; }

	.header .screen { order: 4; width: auto; margin-right: 0; font-size: 14px; }

	.header .header-search { order: 5; width: auto; max-width: 160px; }

	.header .profile { order: 6; width: auto; border: none; padding: 0; }

	.header .close-buttom { order: 7; width: auto; justify-content: flex-start; padding: 0; }

	.menu-main { position: fixed; z-index: 3; height: calc(100vh - var(--layout-header-height)); opacity: 0; left: -100%; top: var(--layout-header-height); transition: all 0.6s ease; max-width: var(--layout-sidebar-width); padding-top: 20px; }
	.menu-main { padding-top: 0; }

	.menu-main .menu-logo {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 64px;
		padding: 8px 12px;
		background: #FF6A39;
	}

	.menu-main .menu-logo svg {
		height: 28px;
		width: auto;
	}

	.menu-main .menu-logo svg path,
	.menu-main .menu-logo svg rect {
		fill: #fff;
	}

	.menu-main .menu-logo .st0 {
		fill: #fff !important;
	}

	.menu-main .menu-logo .st1 {
		stroke: #fff !important;
	}

	.header .topbar-content {
		width: 100%;
		justify-content: flex-start;
		gap: 8px;
	}

	.header .open-menu {
		order: 1;
	}

	.menu-main.active { opacity: 1; left: 0; }

	.header .open-menu { display: block; position: relative; width: 35px; height: 35px; }

	.header .open-menu .icon { display: block; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); width: 100%; transition: all 0.5s ease; }

	.header .open-menu .icon svg { display: block; width: 100%; }

	.header .open-menu .icon svg path { fill: #6B6B6D; }

	.header .open-menu .icon.close { opacity: 0; }

	.header .open-menu.active .icon.close { opacity: 1; }

	.header .open-menu.active .icon.bar { opacity: 0; }

	.header .close-buttom { margin-left: 0;  justify-content: flex-start; }

	

}

@media screen and (max-width:820px) {

	.header .profile { width: 100%; }

}

@media screen and (max-width:620px) {

	:root { --layout-header-height: 220px; }

	.btn-system-default{max-width: 100%;}
	.button-listing-include{max-width: 100% !important; margin-top: 10px;}

}

@media screen and (max-width:575px) {

	.w-sm-100{width: 100% !important;}

}

@media screen and (max-width:375px) {

	.header .close-buttom { padding: 6px 0; } 

	.header .profile { padding: 6px 0; }

	.menu-main { overflow-y: scroll; }

}