#tools-menu { left: 0; width: 48px; list-style-type: none; top: 48px; bottom: 0; padding: 0; margin: 0; background-color: $basecolor; box-sizing: border-box; position: fixed; z-index: 1120; } #tools-menu li { position: relative; } #tools-menu li button:first-child { text-align: center; border: none; background: none; width: 100%; padding: 0; cursor: pointer; height: 48px; z-index:0; } #tools-menu li button path { fill: $baseicon; } #tools-menu li:hover button:first-child path { fill: $basehovericon; } #tools-menu li.selected { background: $baseselected !important; } #tools-menu li.selected button:first-child path { fill: $baseselectedicon; } .tools-menu-sub-button { text-align: center; border: none; background: none; cursor: pointer; width: 22px !important; height:24px !important; display: inline-block; line-height: 0; overflow: hidden; position: relative; path { fill: $baseselectedicon !important; } &:hover { background: $baseselectedhover !important; path { fill: $baseselectediconhover !important; } } } #tools-menu .size-buttons { position:absolute; display: none; height:48px; left:8px; z-index:-1; background-color: $basecolor !important; } #tools-menu .size-buttons button { text-align: center; border: none; padding: 0; position: relative; height:24px; background-color: $baseselected !important; cursor: pointer; display:inline-block; line-height: 0; overflow: hidden; width:22px; } #tools-menu .size-buttons button:hover { background:$baseselected !important; } #tools-menu .size-buttons button:active { background:$basehovericon !important; } #tools-menu li.selected .size-buttons { display:inline-block; } #tools-menu li:hover { background: $basehover; }