.navbar {
    background-color: #fff;
    padding-bottom: .5rem;
    -webkit-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
            box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  }

  .navbar .navbar-brand {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .navbar .navbar-nav {
    border-bottom-color: transparent !important;
  }


/* article Head */
.article-head {
    background-color: #00999D;
    position: relative;
    overflow: hidden;
    height: 250px;
  }

  .article-head .texture {
    position: absolute;
    z-index: 0;
    width: 35%;
    mix-blend-mode: darken;
  }

  .article-head .texture.top-left {
    top: 0;
    left: 0;
  }

  .article-head .texture.bottom-right {
    bottom: 0;
    right: 0;
  }

  @media (max-width: 576px) {
    .article-head .texture {
      width: 60%;
    }
    .article-head h1 {
      font-size: 2.5rem;
    }
  }

  /*  */

/* Main */
main {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    width: 100%;
    /* article */
  }

  /* main .articles .article-content p:not(.article-link) {
    text-align: justify;
  } */

  main .articles .article-content a {
    color: #00999D;
    direction: ltr;
    display: inline-block;
  }

  main .articles .article-content .writer-name {
    color: #00999D;
  }

  main .article .article-table-link {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    color: #fff !important;
  }

  .tooltip {
    font-family: cairo;
  }

  main .articles .article-image {
    max-width: 350px;
    max-height: 200px;
    line-height: 100px;
    border-radius: 12px;
    border: 2px solid #00999D;
    overflow: hidden;
  }

  main .articles .article-image figure {
    position: relative;
    z-index: 10;
    overflow: hidden;
    margin-bottom: 0;
  }

  main .articles .article-image figure::after {
    background: #fff;
    content: "";
    height: 300px;
    right: -100px;
    opacity: .5;
    position: absolute;
    top: -70px;
    -webkit-transform: rotate(-35deg);
            transform: rotate(-35deg);
    -webkit-transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 2s cubic-bezier(0.19, 1, 0.22, 1);
    width: 30px;
  }

  main .articles .article-image:hover figure::after {
    right: 150%;
  }

  @media (max-width: 768px) {
    main .articles .col-md-4 {
      -webkit-box-ordinal-group: 0;
          -ms-flex-order: -1;
              order: -1;
    }
  }

  main .articles .action-buttons-list .action-button {
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      padding: 0;
      border: 0;
      text-align: center;
      outline: none;
  }

  main .articles .action-buttons-list .like-button.active {
    background-color: #fff;
    color: #00999D;
    border: 2px solid #00999D;
  }

  main .modal {
    color: var(--text-color);
  }

  main .modal .modal-content {
    overflow: hidden;
    background-color: #fff;
  }

  main .modal .modal-content .modal-header {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    background-color: #00999D;
    border-bottom-color: #dee2e6;
  }

  main .modal .modal-content .modal-header .close {
    margin: -1rem auto -1rem -1rem;
    outline: none;
  }

  main .modal .modal-content .modal-header .modal-title {
    color: #fff;
  }

  main .modal .modal-content .modal-body > span {
    white-space: normal;
  }

  main .modal .modal-content .modal-body > span .name {
    color: #00999D;
  }

  main .modal .modal-content .modal-body .form-group {
    margin-bottom: .5rem;
  }

  main .modal .modal-content .modal-body .form-group .col-form-label-sm {
    font-size: 1.1rem;
    padding-left: 0;
  }

  main .modal .modal-content .modal-body .form-group .form-control, main .modal .modal-content .modal-body .form-group .custom-select, main .modal .modal-content .modal-body .form-group .custom-file-label {
    background-color: #f5f5f5;
    border-color: #dee2e6;
    background-position: .75rem;
    padding-right: .75rem;
    -webkit-box-shadow: 0 1px 0px 0px rgba(170, 170, 170, 0.5);
            box-shadow: 0 1px 0px 0px rgba(170, 170, 170, 0.5);
  }

  main .modal .modal-content .modal-body .form-group .form-control option:hover, main .modal .modal-content .modal-body .form-group .custom-select option:hover, main .modal .modal-content .modal-body .form-group .custom-file-label option:hover {
    background-color: #000 !important;
  }

  main .modal .modal-content .modal-body .form-group .form-control {
    position: relative;
  }

  main .modal .modal-content .modal-body .form-group .form-control.description {
    min-height: 100px;
  }

  .modal .modal-body .social-list {
      padding: 8px 10px;
      position: static;
      background: none;
  }

  .modal .modal-body .social-list .social-link {
      color: transparent;
      -webkit-transition: -webkit-filter .15s linear;
      transition: -webkit-filter .15s linear;
      transition: filter .15s linear;
      transition: filter .15s linear, -webkit-filter .15s linear;
      margin: 0 2px;
  }

  .modal .modal-body .social-list .social-link:hover {
      -webkit-filter: brightness(0.6);
      filter: brightness(0.6);
  }

  .modal .modal-body .social-list .social-link img {
      width: 25px;
      height: 25px;
  }

  @media (min-width: 576px) {
      #shareModal .modal-content {
          max-width: 400px;
          margin: 0 auto;
      }
  }

  #shareModal .close {
      top: 15px;
      left: 20px;
      color: #222;
  }

  #shareModal .copy-link {
      box-shadow: none;
      color: #00999D;
  }

  /*  */