ul.tabs { margin: 0; padding: 1em 0 0 0; list-style-type: inside; } .controls ul.tabs { margin-top: -3.6em; height: 2.6em; overflow: hidden; } .impact ul.tabs { border-bottom-color: white; } ul.tabs li { display: inline-block; } ul.tabs li a { text-decoration: none; display: block; padding: 0 1em; line-height: 2.6em; white-space: nowrap; color: #ddd; outline: 0; margin-right: 0.5em; } ul.tabs li.active a, ul.tabs li.dropdown:hover, ul.tabs li.dropdown.hover { background-color: white; color: #333; } .impact ul.tabs li.active a, .impact ul.tabs li.dropdown:hover { background: white; } ul.tabs li a:hover { text-decoration: underline; } ul.dropdown-menu { margin: 0; padding: 0; background-color: #555; position: absolute; overflow: hidden; z-index: 1000; border: 1px solid #555; border-top: none; margin-left: -1px; } /* Dropdown tabs after the fourth title should be right-aligned */ ul.tabs li:nth-child(n+5) ul.dropdown-menu { width: 13em; margin-left: -9em; } ul.dropdown-menu { -moz-box-shadow: 0.2em 0.2em 0.3em -0.2em #555; -webkit-box-shadow: 0.2em 0.2em 0.3em -0.2em #555; box-shadow: 0.2em 0.2em 0.3em -0.2em #555; } ul.dropdown-menu li { background-color: white; } ul.dropdown-menu li { display: block; } ul.tabs ul.dropdown-menu { display: none; } ul.tabs ul.dropdown-menu li a { color: #555; margin: 0; } ul.tabs ul.dropdown-menu li a:hover { background-color: #ccc; color: #333; } ul.tabs li.dropdown:hover a { text-decoration: none; color: #555; } li.dropdown:hover ul.dropdown-menu, li.dropdown.hover ul.dropdown-menu { display: block; } ul.tabs img.icon { margin-right: 4px; margin-top: -4px; }