.contact-section {
    display: flex;
    flex-direction: column;
}

.contact-section h1 {
    font-family: Rubik;
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    padding: 1rem 20px;
    align-self: flex-start;
}

.contact-section a {
    text-decoration: none;
}

.contact-section .content {
    display: flex;
    flex-direction: row;
    gap: 24px;
    width: 100%;
}

.contact-section .content .content-left, 
.contact-section .content .content-right {
	position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
	overflow: visible;
}

.contact-section .content .content-right {
    align-items: flex-start;
    flex-direction: row;
    justify-content: center;
    gap: unset;
}

.contact-section .content .content-right .basic-methods-box {
    display: flex;
    gap: 24px;
    width: 100%;
}

.content-box-wrapp {
	display: flex;
    align-items: center;
    flex-direction: row;
}

.address-box,
.map-box,
.email-box,
.call-box {
    width: 100%;
    padding: 12px;
}

.address-box,
.map-box,
.email-box,
.call-box {
    display: flex;
    align-items: flex-start;
    justify-content: center;
	flex-direction: column;
}

.address-box img,
.email-box img,
.call-box img
 {
    width: 2.6rem;
    height: auto;
    object-fit: contain;
    padding: 8px;
}

.address-box h5,
.email-box h5,
.call-box h5 {
    font-family: Rubik;
    font-size: 20px;
    font-weight: 500;
	margin: 0 8px;
    letter-spacing: 1px;
    color: var(--styx-text-color-2);
}

.address-box p,
.email-box a,
.call-box a {
    font-family: Inter;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: 1px;
    margin: 0;
    color: rgba(32, 30, 29, 1);
}

.map-box {
    flex: 1 0 100%;   
}

iframe{ width:100%; display:block; }

/* ============== MEDIA QUERIES ============== */
/* Mobile Approach */
@media (hover: none) and (pointer: coarse) {
.contact-section .content .content-left,
.contact-section .content .content-right {
    width: 100%;
}

.contact-section .content .content-right {
    order: 2;
}

.contact-section .content .content-left {
    order: 1;
    flex-direction: column;
}

.call-box {
    order: 1;
}

.email-box {
    order: 2;
}

.address-box {
    order: 3; 
}

.contact-section .content {
    flex-direction: column;
    align-items: center;
}

.basic-methods-box {
    flex-direction: column;
}
}
/* Tablet Approach */
@media (min-width: 641px) and (hover: none) and (pointer: coarse) {

}
/* Desktop Approach */
@media (min-width: 1024px) and (pointer: fine) {

}