.contacts-main {
  position: relative;
  display: block;
  margin: 0 0 20px 0; }
  .contacts-main__wrapper {
    position: relative; }
  .contacts-main__title {
    position: relative;
    display: block;
    margin: 0 0 20px 0;
    font: 400 24px/110% "Arial", sans-serif;
    max-width: 600px; }
    @media only screen and (max-width: 768px) {
      .contacts-main__title {
        font: 400 18px/130% "Arial", sans-serif;
        margin: 0 0 10px; } }
  .contacts-main__grid {
    position: relative;
    display: table;
    width: 100%;
    border: 1px solid #d7d4cc;
    background: #f3f2ec; }
  .contacts-main__item {
    position: relative;
    display: table-cell;
    padding: 10px;
    vertical-align: middle; }
    .contacts-main__item:first-child {
      width: 200px; }
      @media only screen and (max-width: 768px) {
        .contacts-main__item:first-child {
          display: none;
          width: 0; } }
  .contacts-main__block {
    position: relative;
    display: block;
    margin: 0 0 10px 0;
    max-width: 600px; }
  .contacts-main__cell {
    display: inline-block;
    position: relative;
    vertical-align: top; }
    .contacts-main__cell:first-child {
      font-weight: bold; }

.social-contacts {
  position: relative;
  display: table;
  width: auto;
  height: 100%; }
  @media only screen and (max-width: 768px) {
    .social-contacts {
      margin: 10px 0; } }
  .social-contacts__item {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    padding: 0 5px;
    transition: all 0.3s ease; }
    .social-contacts__item:hover {
      opacity: 0.7; }
    .social-contacts__item img {
      width: 22px;
      height: 17px;
      display: block; }

.contacts {
  position: relative;
  margin: 0 0 20px 0; }
  .contacts__map {
    width: 100%;
    height: 400px;
    background-color: #cccccc; }
    @media only screen and (max-width: 768px) {
      .contacts__map {
        height: 250px; } }
  .contacts__wrapper {
    position: relative;
    margin: 0 -10px; }
  .contacts__grid {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .contacts__item {
    position: relative;
    display: block;
    padding: 0 10px;
    margin: 0 0 30px 0;
    width: 33.333333%; }
    @media only screen and (max-width: 768px) {
      .contacts__item {
        width: 50%; } }
    @media only screen and (max-width: 550px) {
      .contacts__item {
        width: 100%;
        margin: 0 0 20px 0; } }
  .contacts__post {
    position: relative;
    display: block;
    font-weight: bold;
    margin: 0 0 10px 0; }
    @media only screen and (max-width: 550px) {
      .contacts__post {
        margin: 0 0 5px; } }
  .contacts__block {
    position: relative;
    display: block;
    margin: 0 0 10px 0; }
    @media only screen and (max-width: 550px) {
      .contacts__block {
        margin: 0 0 5px; } }
  .contacts__cell {
    display: inline-block;
    position: relative; }

.contacts-info {
  position: relative;
  display: block;
  margin: 0 0 20px 0; }
  .contacts-info__wrapper {
    position: relative;
    margin: 0 -10px; }
  .contacts-info__grid {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%; }
  .contacts-info__item {
    position: relative;
    display: block;
    width: 50%;
    padding: 0 10px; }
    @media only screen and (max-width: 768px) {
      .contacts-info__item {
        width: 100%; } }