#body
{
  h1
  {
    position: relative;
    text-align: center;
    color:$main-color;
    font-size: 24px;
    font-weight: 400;
    line-height: 36px;
    letter-spacing: 2.4px;
    margin-bottom:50px;
    color:$main-color;
    margin-bottom:40px;
    &::after
    {
      content:' ';
      width: 21px;
      height:15px;
      background-color: #9CCCD3;
      border-radius: 100%;
      position: absolute;
      top:-14px;
      left:calc(50% - 10px);
    }
  }
  .description
  {
    text-align: center;
    margin-bottom:40px;
    color:$main-color;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%; /* 24px */
    letter-spacing: 1.6px;
  }

  .contact-list
  {
    display: flex;
    flex-wrap:wrap;
    text-align: center;
    margin-bottom:40px;
    li
    {
      
      box-shadow: 0px 4px 9px 0px rgba(91, 63, 41, 0.30);
      background-color: #F7F3E7;
      padding:16px;
      display: flex;
      border-radius: 30px;
      a
      {
        width: 100%;
        border:1px dashed $main-color;
        border-radius: 30px;
        color:$main-color;
        padding:45px 10px;
        display: flex;
        flex-direction:column;
        i
        {
          font-size:50px;
          margin-bottom:10px;
        }
        span
        {
          word-break: break-all;
          &.t
          {
            font-size: 20px;
            font-weight: 400;
            line-height: 150%; /* 30px */
            letter-spacing: 2px;
            color:$main-color;
            margin-bottom:10px;
          }
          &.d
          {
            color:#C4BCAC;
            font-size: 16px;
            font-weight: 400;
            line-height: 150%; /* 24px */
            letter-spacing: 1.6px;
          }
        }
      }
      @media(min-width:768px)
      {
        width:calc((100% - 60px) / 4);
        margin:0 10px;
        &:nth-child(4n)
        {
          margin-right:0;
        }
        &:nth-child(4n + 1)
        {
          margin-left: 0;
        }
      }
      @media(max-width:767px)
      {
        width:calc(50% - 10px);
        margin:0 10px 20px 10px;
        &:nth-child(2n)
        {
          margin-right:0;
        }
        &:nth-child(2n + 1)
        {
          margin-left: 0;
        }
      }
    }
  }

  #contact-form
  {
    margin-bottom:100px;
    box-shadow: 0px 4px 9px 0px rgba(91, 63, 41, 0.30);
    background-color: #F7F3E7;
    padding:16px;
    display: flex;
    border-radius: 30px;
    form
    {
      width: 100%;
      border-radius: 30px;
      border:1px dashed $main-color;
      padding:10%;
      .form-group
      {
        margin-bottom:20px;
        label
        {
          display: block;
          color:$main-color;
          font-size: 20px;
          font-weight: 400;
          line-height: 150%; /* 30px */
          letter-spacing: 2px;
          color:$main-color;
        }
        input,textarea
        {
          width: 100%;
          display: block;
          border-radius: 30px;
          border:1px solid #C4BCAC;
          padding:10px 20px;
          font-size: 20px;
          font-weight: 400;
          line-height: 150%; /* 30px */
          letter-spacing: 2px;
          color:$main-color;
          background-color: $bg-color;
          &:focus
          {
            border-color:$main-color;
          }
          
        }
        textarea
        {
          height:300px;
        }
        &.has-error
        {
          label
          {
            color:#a00;
          }
          input,textarea
          {
            border-color:#a00;
          }
        }
      }
      .form-btn
      {
        display: flex;
        justify-content:center;
        button
        {
          background-color: $main-color;
          border-radius: 30px;
          font-size: 20px;
          font-weight: 400;
          line-height: 150%; /* 30px */
          letter-spacing: 2px;
          padding:11px 45px;
          color:$bg-color;
          cursor: pointer;
        }
      }
      @media(min-width:768px)
      {
        .form-group
        {
          display: flex;
          label
          {
            width: 200px;
          }
          input,textarea
          {
            flex:1;
          }

        }
      }
    }
  }
}