.ContainerNavbar { box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); } .Navbar { margin: 0 auto; width: rem(1540px); height: 100px; display: flex; flex-direction: row; align-items: center; gap: 20px; .Nav { margin-left: auto; .Menu { display: flex; flex-direction: row; align-items: center; gap: rem(24px); } .Parent { display: block; position: relative; float: left; line-height: 40px; //background-color: #ffc72c; //border-right: #CCC 1px solid; } .Parent a { //margin: 10px 24px; //color: #5d3200; text-decoration: none; } .Parent:hover > ul { display: block; position: absolute; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5); } .Child { display: none; } .Child li { background-color: #FFFFFF; line-height: 40px; padding: 0 10px; width: 100%; } .Child li a { color: $color-text; } ul { list-style: none; margin: 0; padding: 0px; min-width: 12em; font-family: $font-montseratt; font-weight: $font-medium; font-size: rem(16px); line-height: 100%; color: $color-text; } ul ul ul { left: 100%; top: 0; margin-left: 1px; } li:hover { color: $color-link-hover; } .Parent li:hover { background-color: $color-link-hover; //#F0F0F0 color: $color-white; & > a { color: $color-white; } & > .Expand { color: $color-white; } } .Expand { font-size: 16px; float: right; margin-left: 8px; color: $color-text } } .Invite { } }