#map {width:100%; max-width:1024px; border-radius:12px 12px 0 0; height:calc(60% - 80px); margin:80px auto 0; overflow:hidden; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.08); background:#F2F7F7 url(/parts/loader.svg) center no-repeat; background-size:100px auto;}

div.kontakts {display:flex; flex-direction: column; align-items: center;   justify-content: center;  width:100%; max-width:1024px; height:calc(40% - 20px); margin:0 auto; position:relative; margin:0px auto 20px; background:#fff;  box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.08); border-radius:0 0 12px 12px; }



div.num-wrap {width:330px;  height:60px; background:#F2F7F7; border:1px solid #C2CCCC; border-radius:6px; margin:0px auto 10px;}

    div.kontakts a.num {position:relative; font-size:28px; font-weight:700; color:#141515; padding:13px 0px 13px 20px; display:block; float:left;}
    div.kontakts a.num::after {content:''; position:absolute; right:-30px; width:1px; height:80%; bottom:0; top:0; margin:auto; background:#C2CCCC;}

    div.kontakts a.messend {display:block; float:right; width:36px; height:36px; padding:10px 20px;}
    div.kontakts a.messend img{width:100%; }



p.adres {text-align:center; margin-bottom:20px;}

a.photo {display:none; width:330px; margin:0 auto; text-align:center; padding:10px 0; 
    /*Запрет выделения мышкой*/
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;}
a.photo span {background:url(/parts/photo.svg)left center no-repeat; background-size:auto 18px; padding-left:28px;}

a.back-map {width:330px; margin:0 auto; text-align:center; padding:10px 0;
    /*Запрет выделения мышкой*/
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;}
a.back-map span {background:url(/parts/geo.svg)left center no-repeat; background-size:auto 18px; padding-left:28px;}



div.map-wrap {width:100%; height:100%;}
div.fasad {width:100%; height:100%; background:url(/img/fasad.jpg)center no-repeat; background-size:cover; }

/*-----mobile------*/

@media screen and (max-height: 630px){ 
    #map {border-radius:0; height:calc(60% - 60px); margin:60px auto 0;  box-shadow: none;}
    div.kontakts {height:40%; border-radius:0; box-shadow: none;}   
}
@media screen and (max-width: 670px){ 
    #map {border-radius:0; height:calc(60% - 60px); margin:60px auto 0;  box-shadow: none;}
    div.kontakts {height:40%; border-radius:0; box-shadow: none;}
    div.num-wrap {width:280px;}
    div.kontakts a.num {position:relative; font-size:22px; font-weight:700; padding:16px 0px 16px 20px; }
    div.kontakts a.messend {width:32px; height:32px; padding:12px 20px;}
}