@import 'Fonts';

.issuer {
  padding-top: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;

  .letterBoxing {
    width: 960px;
    display: grid;
    grid-template-columns: 3fr 9fr;

    .profile {
      display: flex;
      flex-direction: column;

      >img {
        width: 180px;
        height: 180px;
      }

      >h1 {
        margin: 20px 0 10px 0;
        font-family: $roboto-slab;
        color: #2c2e3b;
        font-size: 25px;
        font-weight: 400;
      }

      >h2 {
        display: block;
        margin: 0 0 10px;
        font-size: 14px;
        line-height: 20px;
        font-weight: normal;
      }

      >span {
        font-size: 14px;
        display: flex;
        align-items: center;

        &:before {
          display: inline-block;
          content: url('/close-envelope.svg');
          width: 18px;
          height: 18px;
          margin-right: 8px;
          opacity: 0.7;
        }
      }

      >a {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 24px auto 0 0;
        padding: 5px 10px;
        border-radius: 6px;
        background-color: #36b074;
        color: #fff;
        font-size: 16px;
        font-weight: 600;
        text-align: center;

        >img {
          width: 26px;
          height: 26px;
          margin-right: 7px;
        }
      }
    }

    .works {
      list-style: none;

      >li {
        padding-top: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #d4d4d4;

        >h1 {
          display: block;
          margin-top: 0px;
          margin-bottom: 5px;
          font-family: $roboto-slab;
          color: #36b074;
          font-size: 18px;
          text-decoration: underline;
          line-height: 30px;
        }

        >h2 {
          display: inline-block;
          color: #2a2a2a;
          font-weight: 600;
          font-size: 14px;
          margin: 0;
        }

        >h3 {
          display: inline-block;
          margin: 0 0 0 10px;
          font-weight: 400;
          font-size: 14px;
        }
      }
    }
  }
}