ActesCitoyens/assets/app/frontend/scss/header.scss

#menu {
  .menu-content {
    background-color: #FFF;
    display: none;
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 100;
    top: 0;
    left: 0;

    .row-menu {
      height: 100%;

      .row-toggle {
        height: 16%;
      }

      .row-list {
        height: 84%;

        nav {
          ul {
            height: 100%;
            margin: 0;

            li {
              width: 100%;
              padding-left: 20%;
              padding-right: 15%;
              margin-bottom: 8%;
              display: inline-block;

              a {
                color: $green;
                font-size: 50px;
                font-family: dinbold;
                font-weight: bold;
                line-height: 50px;
              }

              &.contact {
                margin-bottom: 5%;

                a {
                  border: 2px solid $yellow;
                  padding: 10px 45px;
                  font-size: 25px;
                }
              }

              .yellow-trait {
                width: 20%;
                height: 10px;
                position: absolute;
                top: 0;
                right: 0;
                background-color: $yellow;
              }
            }
          }
        }

        .col-logo {
          .logo {
            position: absolute;
            top: 50%;
            transform: translate(-50%, -50%);
            left: 50%;
          }
        }
      }
    }
  }

  .menu-fixed {
    background-color: #FFF;
    height: 150px;
    z-index: 2;

    .navbar-brand {
      width: 50%;
    }

    .participate {
      font-size: 30px;
      color: #568b6f;
      font-family: dinbold;
      border: 2px solid #568b6f;
      padding: 8px 10px;
      font-weight: bold;
    }

    .space-collab {
      color: $yellow;
      font-size: 20px;
      font-family: dinbold;
    }
  }
}