:root{

	--hoverColour: #bdc3c7;
	--linkColour: #7f8c8d;
	
	--textcolorPrimary: #000; /* Body Text */
	--textcolorSecondary: #000; /* Header Text */
	--textcolorTertiary: #000;

	--textFontWeight: 400;

	--buttonPadding: 10px 30px;

	--fontsizePrimary: 16px; /* Body */
	--fontsizeLarge: 80px; /* H1 */
	--fontsizeMedium: 72px; /* H2 */
	--fontsizeSmall: 66px; /* H3 */
	--fontsizeExSmall: 16px; /* H4 */

	--backgroundMain: #FED11A;
	--backgroundSecond: #000;

}

/* XXL > 1400 */

/* XL */
@media (max-width: 1400px) {
	:root{
		--fontsizeLarge: 72px; /* H1 */
		--fontsizeMedium: 64px; /* H2 */
		--fontsizeSmall: 58px; /* H3 */
		--fontsizeExSmall: 16px; /* H4 */
	}
}

/* L */
@media (max-width: 1200px) {
	:root{
		--fontsizeLarge: 64px; /* H1 */
		--fontsizeMedium: 56px; /* H2 */
		--fontsizeSmall: 50px; /* H3 */
		--fontsizeExSmall: 16px; /* H4 */
	}
}

/* M */
@media (max-width: 992px) {
	:root{
		--fontsizeLarge: 56px; /* H1 */
		--fontsizeMedium: 48px; /* H2 */
		--fontsizeSmall: 42px; /* H3 */
		--fontsizeExSmall: 16px; /* H4 */
	}
}

/* S */
@media (max-width: 768px) {
	:root{
		--fontsizeLarge: 48px; /* H1 */
		--fontsizeMedium: 40px; /* H2 */
		--fontsizeSmall: 36px; /* H3 */
		--fontsizeExSmall: 16px; /* H4 */
	}
}

/* XS */
@media (max-width: 576px) {

}