body {
  /*padding: 0;*/
  background: #ccc; }

.contacts-wrap {
  width: 100%;
  min-height: -webkit-calc(100vh - 100px);
  min-height: calc(100vh - 100px);
  height: 100%;
  padding: 0; }

#map {
  width: 100%;
  height: -webkit-calc(100vh - 100px);
  height: calc(100vh - 100px); }

.hide-contacts {
  width: 50px;
  height: 50px;
  background: #fff;
  -webkit-box-shadow: 5px 8px 20px rgba(0, 0, 0, 0.2);
          box-shadow: 5px 8px 20px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 50%;
          border-radius: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: -webkit-calc(50% - 25px);
  top: calc(50% - 25px);
  left: -webkit-calc(450px - 25px);
  left: calc(450px - 25px);
  z-index: 1;
  cursor: pointer;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  -o-transition: transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s; }
  .hide-contacts i {
    font-size: 20px;
    color: #7a7a7a; }
  .hide-contacts.hidden {
    -webkit-transform: translate(-425px);
        -ms-transform: translate(-425px);
            transform: translate(-425px); }

.contacts-block {
  position: absolute;
  top: 100px;
  height: 100%;
  max-height: -webkit-calc(100vh - 100px - 100px);
  max-height: calc(100vh - 100px - 100px);
  width: 100%;
  max-width: 450px;
  background: #ffffff;
  -webkit-box-shadow: 5px 0 20px rgba(0, 0, 0, 0.2);
          box-shadow: 5px 0 20px rgba(0, 0, 0, 0.2);
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  -o-transition: transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  overflow: hidden; }
  .contacts-block.hidden {
    -webkit-transform: translate(-425px);
        -ms-transform: translate(-425px);
            transform: translate(-425px); }
  .contacts-block ul {
    margin: 0;
    padding: 0;
    list-style-type: none; }
    .contacts-block ul li.active {
      background: #fee618; }
    .contacts-block ul li:not(.active):hover {
      background: #e2e4e7; }
    .contacts-block ul li {
      padding: 20px 25px 13px 20px;
      -webkit-transition: background 0.2s;
      -o-transition: background 0.2s;
      transition: background 0.2s; }
      .contacts-block ul li h2 {
        font-size: 14px;
        font-weight: bold;
        color: #202020;
        margin-bottom: 8px; }
      .contacts-block ul li p {
        font-size: 14px;
        font-weight: normal;
        color: rgba(32, 32, 32, 0.6);
        margin-bottom: 5px; }
      .contacts-block ul li .contacts-info {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap; }
        .contacts-block ul li .contacts-info div {
          -webkit-box-flex: 0;
          -webkit-flex: 0 0 50%;
              -ms-flex: 0 0 50%;
                  flex: 0 0 50%; }
          .contacts-block ul li .contacts-info div a {
            font-size: 14px;
            font-weight: normal;
            color: #202020; }
            .contacts-block ul li .contacts-info div a img {
              max-width: 14px;
              margin-right: 10px; }
  .contacts-block .simplebar-content {
    overflow-x: hidden; }
