.alert {
  
        position: fixed;
        top: 85px;
        right: 10px;
        padding: 10px 20px;
        max-width: 90%;
        background: #f7f7f7;
        box-shadow: 2px 4px 15px rgba(0, 0, 0, .1);
        border-radius: 10px;
        transition: opacity .3s;
        opacity: 0;
        pointer-events: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        z-index: 400;
        font-size: 16px;
        line-height: 135%;
        background-color: #fff;
      }
  
      .alert--show {
        top: 10px;
        opacity: 1;
        z-index: 1000;
        pointer-events: auto
      }
  
      .alert__img {
        max-height: 50px;
        padding: 0;
        display: inline-block;
        margin-left: 5px;
      }
  
      .header-wrap {
      display: flex;
      max-width: 500px;
      margin: 50px auto 25px;
  }
  .avatar {
      border-radius: 50%;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      -ms-border-radius: 50%;
      -o-border-radius: 50%;
      max-width: 100px;
      max-height: 100px;
      width: 100px;
      margin-left: 15px;
  }
  .subscribers, .title-name {
      margin-left: 50px;
      display: flex;
  }
  .title-name h1 {
    margin-bottom: 0;
  }
  .h1, h1 {
      font-size: 36px;
      font-weight: 700;
  }
  .subscribers {
      margin-top: 20px;
      justify-content: space-between;
  }
  .all-traf {
      margin-left: 20px;
  }
  .subs-nums {
      font-weight: bold;
  }
  .subs-words {
      color: #878787;
      font-size: 14px;
  }
  
  .header-below {
      max-width: 500px;
      margin: 0 auto 50px;
      line-height: 1.5;
  }
  
  .article .container {
    max-width: 1000px;
    padding: 0 15px;
    margin: auto;
  }
  
  .main-text h1 {
    color: red;
    text-align: center;
  }
  
  .main-text p {
    margin-bottom: 20px;
  }
  
  h2 {
    color: #783F04;
    text-align: center;
    margin-bottom: 20px;
  }
  
  .post-img {
    display: block;
    margin: 0 auto 20px;
    max-width: 700px;
  }
  
  .custom-block {
    font-weight: bold;
    margin-bottom: 20px;
    border: 3px solid red;
    background: #D9D9D9;
    padding: 20px;
  }
  
  .custom-block p:last-child {
    margin-bottom:0;
  }
  
  .custom-block * {
    font-size: 18px;
  }
  
  .post-img-sub {
    margin-bottom: 5px;
  }
  
  .img-sub {
    display: block;
    font-weight: bold;
    text-align: center;
  margin: 0 auto;
  }
  
  .custom-block.question p:last-child {
    margin-bottom: 0;
  }
  
  .custom-block.question p {
    font-weight: bold;
  
  }
  
  .custom-block.question p:nth-child(even) {
    color: #FF9900;
  }
  
  .custom-block.question p:nth-child(odd) {
    color: #E06666;
  }
  
  .flex-img {
        display: flex;
      align-items: flex-start;
  
      justify-content: center;
      margin-bottom: 20px;
  }
  
  .flex-img img {
    max-height: 400px;
  }
  table {
    margin-bottom: 20px;
  }
  thead tr td {
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
  }
  
  tr td {
    width: 50%;
    font-size: 17px;
    font-weight: 400;
  }
  
  .count-title {
    font-size: 20px;
    text-align: center;
  }
  .count-title span {
    color: red;
  }
  
  .post-prod {
    width: 500px;
  }
  .custom-block.last {
    background: transparent;
  }
  .custom-block.last *{
    
    font-size: 22px;
  }
  
  .custom-block.last p {
    text-align: center;
  }
  
  .prod-block {
      display: inline-block;
      position: relative;
  }
  .prod-block img {
    width: 500px;
  }
  .prod-circle {
      position: absolute;
      width: 100px;
      height: 100px;
      font-size: 22px;
      color: #fff;
      text-align: center;
      background: rgb(190, 143, 213);
      background: radial-gradient(circle, rgba(190, 143, 213, 1) 0%, rgba(153, 85, 187, 1) 54%);
      border-radius: 100%;
      -webkit-border-radius: 100%;
      -moz-border-radius: 100%;
      -ms-border-radius: 100%;
      -o-border-radius: 100%;
      font-weight: 600;
      padding-top: 20px;
      box-sizing: border-box;
      top: 1%;
      right: 2%;
  }
  .price-block {
      font-size: 24px;
      text-align: center;
      margin-bottom: 20px;
      font-family: Arial, Helvetica, sans-serif;
  }
  s {
      text-decoration: line-through;
  }
  .price-block b {
      padding-left: 8px;
      color: #9955bb;
  }
  .order_form {
      max-width: 350px;
      margin: 0 auto;
  }
  .inp {
      -moz-appearance: none;
      appearance: none;
      width: 100%;
      margin-bottom: 10px;
      border: 1px #9955bb solid;
      padding: 0 10px;
      height: 46px;
      font-size: 19px;
      box-sizing: border-box;
  }
  .btn {
      width: 100%;
      color: #fff;
      height: 46px;
      cursor: pointer;
      background: linear-gradient(93.06deg, #3277b9 8.35%, #6968ce 34.63%, #b500ff 83.13%);
      border: 0;
      font-weight: 700;
      font-size: 24px;
  }
  
  .comments__title {
  font-size: 26px;
  margin-bottom:30px;
  }
  .comments {
    margin-top: 50px;
  }
  .comments__container {
      padding-bottom: 1rem;
  
      padding-top: 0.15rem;
  }
  .comments__kma {
      overflow: hidden;
  }
  .comments__kma>div {
      transition: all .3s ease;
  }
  .comments__item {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 20px;
  }
  
  .comments__item.answer {
    margin-right: 50px;
  }
  
  .comments__avatar img {
      width: 100%;
      width: 50px;
      height: 50px;
  }
  .comments__body {
      flex-basis: calc(100% - 0.75rem);
  }

  .comments__body p {
    margin: 10px 0;
  }
  .comments__avatar {
      flex-basis: 0.6rem;
      /* height: 0.6rem; */
      margin-left: 10px;
      flex: 0 0 50px;
  }
  
  .comments__info {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: .05rem;
  }
  
  .comments__author {
  
  
      font-weight: 700;
      margin-right: .1rem
  }
  
  .comments__date {
  
  font-weight: 400;
  
  color: #8d8d8d;
  
  font-size: 12px;
  }
  
  .comments__imgs {
      margin-bottom: .1rem
  }
  
  .comments__actions {
      display: flex;
      justify-content: flex-start;
      align-items: center;
      font-size: 14px;
  }
  
  .comments__reply {
      text-decoration: none;
      color: #8d8d8d;
      margin-left: 10px;
      text-transform: uppercase;
      font-weight: 900
  }
  
  .comments__likes {
      display: inline-flex;
      justify-content: flex-start;
      align-items: center;
  
      font-weight: 400;
      color: #424242;
      text-decoration: none
  }
  
  .comments__likes::before {
      content: "";
      display: inline-block;
      width: 14px;
      height: 14px;
      background: url(../images/heart.svg) center center/contain no-repeat;
      margin-left: 5px;
  }
  
  .comments__group {
      margin-bottom: .3rem
  }
  
  .comments__group:last-of-type {
      margin-bottom: 0
  }
  
  .comments__group .comments__item {
      margin-left: .75rem
  }
  
  .comments__group .comments__item:first-of-type {
      margin-left: 0
  }
  
  .comments .comments__button {
      margin-top: .5rem;
      margin-bottom: 0
  }
  
  .comments__kma>div{transition:all .3s ease}.comment-add{margin:15px 0;border-bottom:1px solid #ccc;padding-bottom:8px}.comment-hide{transform:translateX(calc(-100% - 15px));height:0;margin:0!important}.comment-write{transition:all .3s ease;max-height:100px;overflow:hidden;display:flex;align-items:center;height:auto;margin-bottom:.3rem}.comment-write img{margin-right:20px}.comments__kma{overflow:hidden}.loading{font-style:italic}.loading img{display:inline;width:60px!important}.loading:after{content:'.';animation:loading 1s ease alternate infinite}@keyframes loading {
      60% {
          text-shadow: 0.35em 0 0 currentColor;
      }
  
      100% {
          text-shadow: 0.35em 0 0 currentColor, 0.75em 0 0 currentColor;
      }
  }@keyframes race {
      0% {
          transform: skew(0, -3deg);
      }
      25% {
          transform: skew(0, 3deg);
      }
      50% {
          transform: skew(0, -3deg);
      }
      75% {
          transform: skew(0, 3deg);
      }
      100%{
          transform: skew(0, );
      }
  }

  @media (max-width:700px) {
    .post-img {
      max-width: 100%;
    }
    .flex-img {
      display: block
    }
    .socials {
          display: flex;
    justify-content: center;
    }
  }