.all-contacts{
    display: none;
    position: fixed;
    width: 78%;
    top:0;
    right: 0;
    height: 100vh;
    color: #FFFFFF;
    background-color: #303030;
    /*display: flex;*/
    flex-direction: column;
}

.all-contacts.active{
    display: flex;
}
.all-contacts__info{
    width: 100%;
    padding: 43px 50px;
    position: relative;
    box-sizing: border-box;
}
.button__close-all-contacts{
    display: block;
    width: 32.5px;
    height: 32.5px;
    position: absolute;
    cursor: pointer;
    top: 43px;
    right: 50px;
    border: none;
    outline: none;
    background: none;
    background-image: url(/img/contacts-close.png);
    background-repeat: no-repeat;
    background-size: 32.5px;
}

.contacts__map-container{
    position: relative;
	height: 100%;
	width: 100%;
}


.contacts__map-container #map{
    position: absolute;
    /*height: calc(100% - 45vh);*/
    height: 100%;
    width: 100%;
    margin-bottom: 45vh;
}
.all-contacts__header{
    font-size: 35px;
    line-height: 48px;
    margin-bottom: 25px;
}

.contacts__item{
    font-size: 15px;
    background-repeat: no-repeat;
    background-position: 0 center;
    padding-left: 24px;
    background-image: url(/img/nav-addr.png);
    background-size: 12px 18px;
}

.contacts__item:not(:first-child){
    margin-top: 6px;
}

.contacts__item.item-phone{
    background-image: url("/img/nav-phone.png");
    background-size: 16px 16px;
}
.contacts__item.item-address{
    background-image: url(/img/nav-addr.png);
    background-size: 12px 18px;
    background-position: 2px center;
}
.contacts__item.item-mail{
    background-image: url(/img/nav-mail.png);
    background-size: 16px 11px;
}
.contacts__item.item-time{
    background-image: url(/img/nav-time.png);
    background-size: 12px 12px;
    background-position: 2px center;
}

.all-contacts__more-info{
    margin-left: 40px;
}
.all-contacts__more-info p {
    font-size: 14px;
    line-height: 21px;
    color: #c4c4c4;
}

.contact-information{
    display: flex;
}


@media screen and (max-width: 768px){
    .all-contacts{
        width: 100%;
    }
    .all-contacts__info{
        padding: 23px 30px;
    }
    .button__close-all-contacts{
        top: 23px;
        right: 30px;
    }
}
@media screen and (max-width: 600px){
    .contact-information{
        flex-direction: column;
    }
    .all-contacts__more-info{
        margin-left: 0;
        margin-top: 20px;
    }
    
}