@media screen and (min-width: 1100px) {
footer {
width: 100vw;
transform: translateX(calc((1100px - 100vw)/2));
}
<!-- STYLE FOR FOOTER -->
<style type="text/css">/* Set up 4 column grid for footer */

        

        .gc-footer-container {

            font-family: serif;

            border-top: 8px solid #C93737;

            background-color: #2c2f33;

            display: grid;

            grid-gap: 1rem;

            grid-template-columns: 1fr 1fr 1fr 1fr;

            align-items: center;

            padding: 1rem;

            color: white;

            font-size: 1rem;

        }

        /* Add some padding for each grid column */

        

        .gc-column {

            padding: 1rem;

        }

        /* Style the List Items (remove bullets and margin and padding) */

        

        .gc-column ul {

            margin: 0 0 0 0;

            padding: 0 0 0 0;

            list-style-type: none;

        }

        /* Style Hyper Links (remove coloration and text-decoration) */

        

        .gc-column a,

        .gc-column a:hover,

        .gc-column a:visited {

            color: white;

            text-decoration: none;

        }

        /* Style for the "Quick Links" text */

        

        .gc-quick-links {

            font-size: 2rem;

            font-weight: bold;

        }
</style>
<!-- END STYLE FOR FOOTER-->