_header.scss 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. #page-wrapper{
  2. .mobile-menu{
  3. display: none;
  4. }
  5. & > header{
  6. z-index: 999;
  7. padding-top: 1.4rem;
  8. .logo{
  9. z-index: 999;
  10. width: 20rem;
  11. position: fixed;
  12. right: 0px;
  13. top: 0;
  14. transform: translate(-25%, 19rem) rotate(90deg);
  15. transform-origin: bottom right;
  16. }
  17. .desktop-menu{
  18. & > nav.dropmenu{
  19. & > ul{
  20. @include flexbox;
  21. & > li{
  22. margin-right: 1.2rem;
  23. & > ul{
  24. position: absolute;
  25. top: -100px;
  26. background: white;
  27. a{
  28. transition: 0.3s color ease;
  29. color: white;
  30. }
  31. }
  32. &:hover{
  33. & > ul{
  34. position: absolute;
  35. top: auto;
  36. a{
  37. &.active{
  38. color: black;
  39. }
  40. transition: 0.3s color ease;
  41. color: $grey;
  42. }
  43. & > li{
  44. &:hover{
  45. a{
  46. color: black;
  47. }
  48. }
  49. }
  50. }
  51. }
  52. }
  53. }
  54. }
  55. }
  56. }
  57. #start{
  58. header.sous_nav{
  59. padding-top: 6rem;
  60. ul{
  61. @include flexbox;
  62. li{
  63. margin-right: 1rem;
  64. a{
  65. color: $grey;
  66. &.active{
  67. color: black;
  68. }
  69. }
  70. }
  71. }
  72. }
  73. }
  74. }