@import '../../../style/colors';
@import '../../../style/fonts';


.TopLinks {

  display: flex;
  font-family: $primary_font;
  font-weight: $primary_font_weight;
  color: $primary_black;

  .Logo {
    float: left;
    font-size: 2rem;
    color: $primary_black;
    text-decoration: none;

  }

  .Links {
    padding-left: 5%;
    max-width: 30vw;
    display: flex;
    flex-direction: row;



    .Link  {
      text-align: center;
      margin-left: 3%;
      min-width: fit-content;

      a {
        font-size: 0.8vw;
        color: $primary_black;

      }
    }



    a:hover{
      color: $primary_pink;
    }
  }

}

@media (max-width: 1200px) {
  .TopLinks {
    justify-content: center;

    .Logo {
      font-size: 5vw;
    }

    .Links {
      display: none;
    }

  }
}