#contacts-container{
    display: grid;
    grid-template-areas: "contacts map" "address map";
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
    grid-column-gap: var(--primary-spacing);
    grid-row-gap: calc(var(--primary-spacing) * 2);
}

#contacts-container > div {
    display: flex;
    flex-direction: column;
}

#contacts-container > #contacts{
    grid-area: contacts;
}
#contacts-container > #map{
    grid-area: map;
}
#contacts-container > #address{
    grid-area: address;
}

/* List of icon and contact */
#contacts-container > #contacts > div{
    display: inline-flex;
    align-items: center;
    margin-bottom: var(--primary-spacing);
}
#contacts-container > #contacts > div:last-child{
    margin-bottom: 0px;
}
#contacts-container > #contacts > div > p{
    margin-bottom: 0px;
    margin-left: var(--secondary-spacing);
}

#contacts-container > #map > iframe{
    width: 100%;
    height: 100%;
    max-height: 250px;
    margin: var(--primary-spacing 0px);
    border: 0px;
}

@media(max-width: 768px){
    #contacts-container{
        grid-template-areas: "contacts" "address" "map";
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
    }
}