.footer {
  z-index: 2; }

.wrap-map {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1; }
  .wrap-map:before {
    content: '';
    background: -webkit-gradient(linear, left top, left bottom, color-stop(5%, #f8fafc), color-stop(rgba(248, 250, 252, 0.7)), to(rgba(248, 250, 252, 0)));
    background: -webkit-linear-gradient(top, #f8fafc 5%, rgba(248, 250, 252, 0.7), rgba(248, 250, 252, 0));
    background: -o-linear-gradient(top, #f8fafc 5%, rgba(248, 250, 252, 0.7), rgba(248, 250, 252, 0));
    background: linear-gradient(to bottom, #f8fafc 5%, rgba(248, 250, 252, 0.7), rgba(248, 250, 252, 0));
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 180px;
    z-index: 2; }
    @media only screen and (max-width: 576px) {
      .wrap-map:before {
        background: transparent;
        bottom: 0;
        height: unset;
        -webkit-transition: -webkit-box-shadow .3s;
        transition: -webkit-box-shadow .3s;
        -o-transition: box-shadow .3s;
        transition: box-shadow .3s;
        transition: box-shadow .3s, -webkit-box-shadow .3s;
        -webkit-box-shadow: inset -100vw 0 0 0 #f8fafc;
        box-shadow: inset -100vw 0 0 0 #f8fafc; } }
  @media only screen and (max-width: 576px) {
    .wrap-map {
      position: fixed;
      -webkit-transition: opacity .6s, -webkit-transform .5s;
      transition: opacity .6s, -webkit-transform .5s;
      -o-transition: transform .5s, opacity .6s;
      transition: transform .5s, opacity .6s;
      transition: transform .5s, opacity .6s, -webkit-transform .5s;
      -webkit-transform: translate(100vw);
      -ms-transform: translate(100vw);
      transform: translate(100vw);
      z-index: 100;
      opacity: 0; }
      .wrap-map--visible-map {
        -webkit-transform: translate(0vw);
        -ms-transform: translate(0vw);
        transform: translate(0vw);
        opacity: 1; } }

.contact-map {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #c2c9cf;
  z-index: 1; }
  @media only screen and (max-width: 576px) {
    .contact-map {
      z-index: 100; } }

@media only screen and (max-width: 576px) {
  .button-close-map {
    display: block;
    width: 65px;
    height: 65px;
    position: absolute;
    z-index: 101;
    top: -65px;
    right: 0; }
    .button-close-map:hover .button-close-map__semicircle {
      background-color: #3e3e7d; }
    .button-close-map__semicircle {
      width: 130px;
      height: 130px;
      -webkit-border-radius: 50%;
      border-radius: 50%;
      -webkit-transition: background-color .4s;
      -o-transition: background-color .4s;
      transition: background-color .4s;
      cursor: pointer;
      background-color: #50519b; }
    .button-close-map__icon {
      width: 13px;
      height: 13px;
      background: url(/local/static/build/img/svg/contacts-close-white.svg) no-repeat center/contain;
      position: absolute;
      bottom: -33px;
      left: 33px; } }