/*------------------------------------*\
    #MAIN ELEMENT
\*------------------------------------*/

/**
 * Main element
 */
[role=main] {
	display: block;
	flex: 1 0 auto;
	padding: 1rem;
}

/*------------------------------------*\
    #MAIN ELEMENT
\*------------------------------------*/

/**
 * Main element
 */
[role=main] {
	display: block;
	flex: 1 0 auto;
	padding: 1rem;

    @media all and (min-width: $bp-xl) {
        padding-top: 3rem;
    }
}

Add top padding on large screens
Add top padding on large screens
