main{position:relative;display:flex}main nav{width:140px;background-color:var(--app-background-color)}main nav ul li{display:flex;align-items:center;padding:15px}main nav ul li:hover{background-color:var(--button-bgcolor)}main nav ul li svg{width:25px;height:25px;margin-right:10px}main nav ul li svg path{fill:var(--highlight-color)}main div.body{width:calc(100% - 140px);height:calc(100vh - 90px);padding-left:60px;overflow-y:scroll;scroll-behavior:smooth}main div.body::-webkit-scrollbar{display:none}main div.tools-item{display:inline-flex;align-items:center;width:230px;height:70px;border:1px solid var(--border-color);border-radius:10px;padding:0 10px;transition:all .3s linear;transform:scale(.98);margin-bottom:10px;background-color:var(--app-background-color)}main div.tools-item:hover{box-shadow:0 20px 20px -16px var(--highlight-color);transform:translateY(-5px) scale(1)}main div.tools-item img{width:50px;height:50px;border-radius:10px}main div.tools-item div{margin-left:10px}main div.tools-item div.info{width:calc(100% - 50px)}main div.tools-item p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:#ccc;font-size:12px;width:calc(100% - 45px)}main div h3{margin-bottom:10px}main>div{margin-bottom:20px}main div.body>p{text-align:center;margin:10px 0}div.tools-item h4{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;margin-bottom:5px}@media (max-width:550px){nav{display:none}main div.body{width:100%;padding-left:0}div.tools-item{width:48%!important}}@media (max-width:392px){div.tools-item{width:100%!important}}