:root {
  --white: #fff0f7;
  --black: #141414;
  --magi-green: #839C4C;
  --magi-green-dark: #546D1F;
  --magi-blue: #4F98CB;
  --magi-blue-dark: #296690;
  --magi-yellow: #EFBB26;
  --magi-yellow-dark: #B08710;
  --magi-lime: #FFFBF0;
}

/* TEXT STYLES */

.intro-text{
	padding: 0 80px 64px 80px;
	gap: 24px;
}

.sub-heading{
	margin-bottom: 20px;
	font-style: italic;
	color: var(--magi-green);
}  

/* Fonts CSS */
@font-face {
  font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-Bold.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-Regular.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-Italic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

/* End Fonts css */

h1.display-big{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 90px;
	line-height: 78px;
	text-transform: uppercase;
	margin-top: 0px;
	margin-bottom: 0px;
	overflow: hidden;
}

h1.display{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 64px;
	line-height: 56px;
	text-transform: uppercase;
	margin-top: 42px;
	margin-bottom: 32px;
	overflow: hidden;
}

h1.heading{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 54px;
	line-height: 58px;
	text-transform: uppercase;
	overflow: hidden;
}


h1 span.reveal-animation {
  display: block;
  animation: reveal 1.5s cubic-bezier(0.77, 0, 0.175, 1) 0.5s;
}


h2.heading{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 44px;
	line-height: 40px;
	margin-bottom: 24px;
	text-transform: uppercase;
}

h3.heading{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 32px;
	line-height: 38px;
	margin-bottom: 10px;
	text-transform: uppercase;
}

h4.heading{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 28px;
	line-height: 26px;
	margin-bottom: 10px;
	text-transform: uppercase;
}

h5.heading{
	font-family: 'Radio Canada Big';
  src: url('fonts/RadioCanadaBig-BoldItalic.woff2') format('woff2'),
    url('fonts/RadioCanadaBig-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-display: swap;
	font-size: 24px;
	line-height: 23px;
	margin-bottom: 10px;
	text-transform: uppercase;
}

p.big{
	font-size: 24px;
	line-height: 28px;
}

p{
	font-size: 18px;
	line-height: 22px;
	margin-bottom: 0 !important;
}

p.small{
	font-size: 16px;
	line-height: 22px;
	margin-bottom: 0 !important;
}

a.link-button{
	text-decoration: none;
}

.text-lead{
	font-weight: 700 !important;
}

@media screen and (max-width: 991px) {
	.intro-text{
		padding: 0;
		gap: 24px;
	}
	h1.display-big{
		font-size: 40px;
		font-weight: 600;
		line-height: 36px;
		text-transform: uppercase;
	}

	h1.display{
		width: 100%;
		font-size: 40px;
		font-weight: 600;
		line-height: 32px;
		text-transform: uppercase;
	}

	h2.heading{
		width: 100%;
		font-size: 30px;
		font-weight: 600;
		line-height: 28px;
	}

	h3.heading{
		width: 100%;
		font-size: 24px;
		font-weight: 600;
		line-height: 22px;
	}

	h4.heading{
		width: 100%;
		font-size: 22px;
		font-weight: 600;
		line-height: 20px;
	}

	p{
		font-size: 16px;
		line-height: 22px;
		margin-bottom: 0 !important;
	}

	p.small{
		font-size: 14px;
		line-height: 18px;
		margin-bottom: 0 !important;
	}
}

@keyframes reveal {
  0% {
    transform: translate(0,100%);
  }
  100% {
    transform: translate(0,0);
  }
}
