/* -------------------------------------------------------------|
|-| FOOTER ELEMENTS.
|---------------------------------------------------------------| */
    
footer {
    text-align: center;
    border-top: 1px solid black;
    margin: 0rem 0rem 0rem 0rem;
}

footer p {
    font-size: 0.9rem;
    padding: 1rem 0rem 1rem 0rem;
}

@media (min-width: 1024px) {
    footer p {
        font-size: 1.2rem;
        padding: 1rem 2rem 1rem 2rem;
    }
}

/* -------------------------------------------------------------|
|-| SOCIAL MEDIA ELEMENTS.
|---------------------------------------------------------------| */

@media (min-width: 768px) {
    .media-text {
        font-size: 1.2rem;
        margin: 1rem 0rem 1rem 0rem;
    }
}

.media-info {
    display: grid;
    grid-template-columns: repeat(3, 80px);
    grid-template-rows: repeat(1, 50px);
    column-gap: 20px;
    row-gap: 0px;  
    justify-content: center;
   
    margin: 1rem 0rem 2rem 0rem;
    padding: 0rem 0rem 0rem 0rem;     
}

@media (min-width: 1024px) {
    .media-info {
        column-gap: 40px;
    }
} 

.media-info img {
    text-align: center;
    width: 50px;
    height: auto;
    align-items: center;    
}

/* -------------------------------------------------------------|
|-| CONTACT INFO ELEMENTS.
|---------------------------------------------------------------| */

.contact-info {
    margin: 0rem 0rem 0rem 0rem;
}

@media (min-width: 768px) {
    .contact-text {
        font-size: 1.2rem;
        margin: 1rem 0rem 1rem 0rem;
    }
}

@media (min-width: 1024px) {
    .contact-text {
        font-size: 1.1rem;
        margin: 1rem 0rem 1rem 0rem;
    }
}

@media (min-width: 768px) {
    .contact-info {
        display: grid;
        grid-template-columns: repeat(3, 220px);
        grid-template-rows: 60px 150px;
        column-gap: 20px;
        row-gap: 0px;  
        justify-content: center;
    
        margin: 0rem 0rem 1rem 0rem;
        padding: 0rem 0rem 0rem 0rem;
    }
}

@media (min-width: 1024px) {
    .contact-info {
        grid-template-columns: repeat(3, 300px);
        column-gap: 40px;
    }
} 

.contact1,
.contact2,
.contact3 {
    margin: 0rem 0rem 1rem 0rem;
    padding: 0rem 0rem 0rem 0rem;
}

.contact1 img,
.contact2 img,
.contact3 img {
    display: inline-grid;
    text-align: center;
    width: 60px;
    height: auto;
    align-items: center;
}

.copyright p {
    font-size: 0.75rem;
    border-top: 1px solid black;
    margin: 0rem 0rem 0rem 0rem;
}

@media (min-width: 768px) {
    .copyright p {
        font-size: 0.9rem;
    }
}