index.scss

@import '../../../assets/scss/mixins.scss';

.comedian-header {
  text-align: center;
  padding-top: 50px;
  @include desktop() {
    padding-top: 20px;
  }

  .thumbnail {
    border: 1px solid var(--white-secondory);
    border-radius: 120px;
    overflow: hidden;
    width: 240px;
  }

  .title {
    @include desktop() {
      font-size: var(--h1-md);
    }
    @include tablet() {
      font-size: var(--h1-sm);
    }
    @include mobile() {
      font-size: var(--h1-xs);
    }
    font-weight: 300;
    color: var(--h2-color);
  }

  .navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 24px;
  }
}

@include touch() {
  .comedian-header {
    padding-top: 30px;
  }
}