.top {padding: 5px 10px; height: 50px;}
.top > div {height: 100%;}
.top .logo,
.top .logo img {height: 100%;}

body {width: 100%; overflow: hidden;}

#wrapper {height: calc(100vh - 95px);}

.wrap {width: 100%; padding: 70px 20px 20px;}

.menu {width: 100%; position: absolute; right: -100%; top: 50px; height: calc(100vh - 95px);}
.menu.opened {right: 0;}
.menu .toggle-menu {display: block; width: 50px; height: 50px; position: fixed; top: 50px; right: 0; border-left: 1px var(--primary) solid; border-bottom: 1px var(--primary) solid; z-index: 9; background: #fff;}
.menu .toggle-menu b,
.menu .toggle-menu b:before,
.menu .toggle-menu b:after {width: 30px; height: 4px; background: var(--primary); position: absolute; display: block; border-radius: 3px; top: calc(50% - 2px); left: calc(50% - 15px);}
.menu .toggle-menu b:before {top: -8px; left: 0; content: '';}
.menu .toggle-menu b:after {top: 8px; left: 0; content: '';}
.menu .toggle-menu.opened b {transform: rotate(180deg);}
.menu .toggle-menu.opened b:before {transform: translateX(38px) translateY(4px) rotate(45deg); top: -8px; left: -21px; width: 50%;}
.menu .toggle-menu.opened b:after {transform: translateX(38px) translateY(-4px) rotate(-45deg); top: 8px; left: -21px; width: 50%;}

.botoes {}
.botoes .btn {margin: 0 0 7px 7px;}

.grid .nav {height: auto;}
.grid .nav .left {font-size: 10px; flex-wrap: wrap; line-height: normal;}
.grid .tabela {overflow: auto;}
.grid .tabela .dataTables_wrapper {min-width: 1200px;}

#tabs .sidebar {padding: 0;}
#tabs .sidebar ul li {width: 50%; border-left: 1px var(--gray) solid; line-height: 20px;}
#tabs .sidebar ul li:nth-child(2) {border-radius: 0 3px 0 0;}
#tabs .sidebar ul li:last-child {border-radius: 0;}
#tabs .sidebar ul li:nth-child(2n) {border-left: 0;}

#tabs .content {margin: 0 0 20px;}

#tabs .sidebar + .content .formulario {border-radius: 0 0 3px 3px;}

.header h1 {font-size: 14px;}

.indent .formulario .r {flex-direction: column;}
.indent .formulario .r input,
.indent .formulario .r select,
.indent .formulario .r textarea {width: 100%;}

.indent .formulario .copiacliente .r {flex-direction: row;}

.painel {}
.painel .left,
.painel .right {width: 100%; margin: 0 0 10px;}
.indent .bloco {width: 100%; padding: 0; margin: 0 0 20px;}
.indent .bloco + .bloco {width: 100%; margin: 0 0 20px;}

.categorias {flex-direction: column;}
.categorias .sidebar_categorias {height: auto; width: 100%;}
.categorias .content_categorias {width: 100%; margin: 20px 0 0; padding: 0;}

.categorias #tree-categorias li span {cursor: move; font-size: 20px; display: flex; justify-content: center; align-items: center; line-height: 24px; padding: 0 0 3px;}

.menu,
.menu .toggle-menu,
.menu .toggle-menu b,
.menu .toggle-menu b:after,
.menu .toggle-menu b:before
{-webkit-transition-duration: 0.3s; transition-duration: 0.3s;}