/* breakpoints */
.grid-position {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  float: left; }

html:lang(ar) .grid-position {
  float: right; }

.map {
  position: relative; }
  .map .bg-img-cover {
    background-color: #000000;
    height: 840px;
    max-height: 840px; }
    @media all and (min-width: 1024px) and (max-width: 1439px) {
      .map .bg-img-cover {
        height: 780px;
        max-height: 780px; } }
    @media (max-width: 1199.98px) {
      .map .bg-img-cover {
        height: 650px;
        max-height: 650px; } }
    @media all and (-webkit-min-device-pixel-ratio: 1) and (max-device-width: 1366px) and (min-device-width: 1024px) and (orientation: portrait) {
      .map .bg-img-cover {
        height: 820px;
        max-height: 820px; } }
    @media all and (min-width: 600px) and (max-width: 1023px) {
      .map .bg-img-cover {
        height: 400px;
        max-height: 400px; } }
    @media all and (max-width: 599px) {
      .map .bg-img-cover {
        height: 320px;
        max-height: 100%; } }
  .map .description {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-end;
    -moz-justify-content: flex-end;
    -ms-justify-content: flex-end;
    justify-content: flex-end;
    -ms-flex-pack: flex-end;
    z-index: 1; }
    @media all and (max-width: 1023px) {
      .map .description {
        position: relative; } }
    .map .description > div {
      background-color: #ff6a00;
      padding: 2vw 3vw;
      color: #ffffff; }
      @media all and (max-width: 1023px) {
        .map .description > div {
          width: 100%;
          padding: 30px; } }
    .map .description .name,
    .map .description .address {
      padding-bottom: 20px; }
    @media all and (max-width: 1023px) {
      .map .description .address {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
        .map .description .address p:after {
          content: ",";
          color: #ffffff;
          display: none; }
        .map .description .address p:last-child:after {
          display: none; } }
    .map .description .contacts a {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-align-items: center;
      -moz-align-items: center;
      -ms-align-items: center;
      align-items: center;
      padding-bottom: 10px; }
      .map .description .contacts a:hover {
        text-decoration: underline !important; }
      .map .description .contacts a:before {
        content: "";
        width: 36px;
        height: 36px;
        margin-right: 10px; }
        @media (max-width: 1199.98px) {
          .map .description .contacts a:before {
            width: 30px;
            height: 30px; } }
      .map .description .contacts a.phone:before {
        background: url("../images/phone.svg") no-repeat; }
      .map .description .contacts a.email:before {
        height: 21px;
        background: url("../images/email.svg") no-repeat; }
        @media (max-width: 1199.98px) {
          .map .description .contacts a.email:before {
            height: 17px; } }
    .map .description .social-media-icons {
      position: relative;
      z-index: 2; }
      .map .description .social-media-icons ul li a {
        content: "";
        width: 50px;
        height: 50px;
        background-repeat: no-repeat;
        display: block;
        background-position: 0 0; }
        .map .description .social-media-icons ul li a:hover {
          background-position: 0 0; }
        @media all and (max-width: 1023px) {
          .map .description .social-media-icons ul li a {
            background-position: 0 0; } }
      .map .description .social-media-icons ul li.youtube {
        order: 4; }
        .map .description .social-media-icons ul li.youtube a {
          background-image: url("../images/social-media/yt-sprite.png"); }
      .map .description .social-media-icons ul li.facebook {
        order: 1; }
        .map .description .social-media-icons ul li.facebook a {
          background-image: url("../images/social-media/fb-sprite.png"); }
      .map .description .social-media-icons ul li.instagram {
        order: 3; }
        .map .description .social-media-icons ul li.instagram a {
          background-image: url("../images/social-media/ig-sprite.png"); }
      .map .description .social-media-icons ul li.twitter {
        order: 2; }
        .map .description .social-media-icons ul li.twitter a {
          background-image: url("../images/social-media/tw-sprite.png"); }
  .map .map-indicator {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1; }
    @media all and (max-width: 1023px) {
      .map .map-indicator {
        height: 320px;
        max-height: 100%;
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse; } }
    .map .map-indicator .title {
      text-transform: uppercase;
      padding: 0 15px; }
      @media all and (max-width: 1023px) {
        .map .map-indicator .title {
          padding-top: 15px; } }
    .map .map-indicator .indicator {
      background: url("../images/map/map-indicator.svg") no-repeat;
      width: 37px;
      height: 53px; }
      @media (max-width: 1199.98px) {
        .map .map-indicator .indicator {
          width: 27px;
          height: 43px; } }
      @media all and (max-width: 1023px) {
        .map .map-indicator .indicator {
          width: 25px;
          height: 36px; } }

html:lang(ar) .map .description {
  left: auto;
  right: 0; }
  html:lang(ar) .map .description .contacts a:before {
    margin: 0;
    margin-left: 10px; }
