/* X-Small (less than 576px) */
@media (max-width: 1199.98px) {
    /* Footer Sections */
    footer{
        & .pre-footer{
            color: var(--tdl-white);
            text-align: var(--text-align-center);
            padding: var(--margin-padding-large) 0;
            background-image: url('../../images/USA.png');
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
            & h2{
                font-size: calc(var(--base-font-size) * 1.75);
                position: relative;
                text-align: var(--text-align-left);
                &::after{
                    content: '';
                    width: calc(var(--base-font-size) * 1.625);
                    height: calc(var(--base-font-size) * 1.625);
                    background-image: url('../../images/arrow-yellow-circle.png');
                    background-size: contain;
                    background-position: center;
                    position: absolute;
                    top: 50%;
                    transform: translate(40%, -50%);
                }
            }
            & .vertical-list {
                height: 0px;
                overflow: hidden;
                &.six-columns{
                    grid-template-columns: repeat(2, 1fr); 
                }
            }
        }
        & .footer{
            padding: var(--margin-padding-large) 0;
            & .row.col4{
                justify-content: space-between;
                align-items: stretch;
                & h4 {
                    text-transform: uppercase;
                    font-weight: var(--font-weight-400);
                    position: relative;
                    & hr{
                        margin-top: var(--margin-padding-small);
                    }
                    &.has-dropdown::after{
                        content: '';
                        width: calc(var(--base-font-size) * 1.625);
                        height: calc(var(--base-font-size) * 1.625);
                        background-image: url('../../images/arrow-down-circle-black.png');
                        background-size: contain;
                        background-position: center;
                        position: absolute;
                        background-repeat: no-repeat;
                        bottom: 0%;
                        right: 0;
                        transform: translate(0%, -40%);
                    }
                }
                & .col{
                    padding: var(--margin-padding-small);
                    &:nth-of-type(1){ order: 2; }
                    &:nth-of-type(2){ order: 3; }
                    &:nth-of-type(3){ order: 4; }
                    &:nth-of-type(4){ order: 1; }
                    &.social-box{
                        & .social-menu{
                            & a{
                                width: calc(var(--base-font-size) * 2.5625);
                                height: calc(var(--base-font-size) * 2.5625);
                                border-radius: var(--base-width);
                                border: var(--base-border);
                                display: flex;
                                justify-content: center;
                                align-items: center;
                            }
                            & img.footer-logo{
                                max-width: var(--base-width);
                            }
                        }
                    }
                    & .two-columns{
                        gap: var(--margin-padding-small) var(--margin-padding-medium);
                        margin-top: var(--margin-padding-small);
                        & li{
                            & a{
                                line-height: var(--base-font-size);
                            }
                        }
                    }
                }
            }
        }
        & .post-footer{
            padding: var(--margin-padding-large) 0;
            background-color: var(--tdl-black);
            text-align: var(--text-align-center);
            & .row.col{
                justify-content: center;
                & h4{ color: var(--tdl-white); }
                & ul.post-footer-menu{
                    width: var(--base-width);
                    justify-content: center;
                    gap: 0 calc(var(--margin-padding-small) * 2);
                    & a{
                        text-decoration: underline;
                        color: var(--tdl-white-transparent-90)
                    }
                }
                & p{
                    color: var(--tdl-white-transparent-90);
                    & a{ text-decoration: underline; }
                }
            }
        }
    }
}
/* Rare xSmall (≥320px) */
@media (min-width: 320px) and (max-width: 424.98px){
    footer {
        & .pre-footer {
            & h2{
                padding-top: var(--margin-padding-small);
            }
            & .vertical-list {
                &.six-columns {
                    padding-top: var(--margin-padding-small);
                }
            }
        }
    }
}
/* Small (≥576px) */
@media (min-width: 576px) and (max-width: 767.98px) {
    footer {
        & .pre-footer {
            & .vertical-list {
                &.six-columns {
                    grid-template-columns: repeat(3, 1fr);
                }
            }
        }
    }
}
/* Medium (≥768px) */
@media (min-width: 768px) and (max-width: 991.98px) {
    footer {
        & .pre-footer {
            & h2{ 
                text-align: var(--text-align-center);
                margin: var(--margin-padding-small) 0;
            }
            & .vertical-list {
                &.six-columns {
                    grid-template-columns: repeat(3, 1fr);
                    justify-items: center;
                }
            }
        }
    }
}
/* Extra Extra Large (≥1200px) - Actual Desktop Styles */
@media only screen and (min-width: 1200px){
    /* Footer Sections */
    footer{
        & .pre-footer{
            color: var(--tdl-white);
            text-align: var(--text-align-center);
            padding: var(--margin-padding-large) 0;
            background-image: url('../../images/USA.png');
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
        }
        & .footer{
            padding: var(--margin-padding-large) 0;
            & .row.col4{
                justify-content: space-between;
                align-items: stretch;
                & h4 { text-transform: uppercase; font-weight: var(--font-weight-400); font-size: calc(var(--base-font-size) * 1.125) ; }
                & .col{
                    padding-right: var(--margin-padding-large);
                    &:nth-child(3),
                    &:nth-child(4){
                        padding: 0;
                    }
                    &.social-box{
                        padding-left: var(--margin-padding-large);/*New Change Xlarge to large*/
                        & .social-menu{
                            padding-left: var(--margin-padding-medium);
                            & a{
                                width: calc(var(--base-font-size) * 2.5625);
                                height: calc(var(--base-font-size) * 2.5625);
                                border-radius: var(--base-width);
                                border: var(--base-border);
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                transition: all .3s ease-in-out;
                                &:hover{
                                    background: var(--tdl-yellow);
                                }
                            }
                            & img.footer-logo{
                                max-width: var(--base-width);
                            }
                        }
                    }
                    & .two-columns{/*Gap for ul in footer*/
                        gap: 0 var(--margin-padding-medium);
                    }
                }
            }
        }
        & .post-footer{
            padding: var(--margin-padding-large) 0;
            background-color: var(--tdl-black);
            text-align: var(--text-align-center);
            & .row.col{
                justify-content: center;
                & h4{ color: var(--tdl-white); }
                & ul.post-footer-menu{
                    width: var(--base-width);
                    justify-content: center;
                    & a{
                        text-decoration: underline;
                        color: var(--tdl-white-transparent-90)
                    }
                }
                & p{
                    color: var(--tdl-white-transparent-90);
                    & a{ text-decoration: underline; }
                }
            }
        }
    }
}