:root {

	--colour-theme-grey: #949494; /* HSL: 247, 7, 42 / RGB: 100, 99, 107 */
	--svg-filter-theme-grey: brightness(0) saturate(100%) invert(59%) sepia(0%) saturate(0%) hue-rotate(175deg) brightness(100%) contrast(87%);

}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: 80px;
	height:100%;
	overflow-x: hidden;
}

body {
	font-family: 'Raleway', sans-serif;           
	color: var(--text-light);
	line-height: 1;
	display: flex;
	flex-direction: column;
	height:100%;
}

.font-gabarito{
	font-family: 'Gabarito', sans-serif;  
}

a{display: inline-block;}

main{
	flex: 1;
	
	align-items: center;
	width: 100%;
	background-image: url('../img/backgrounds/Campaign-background.jpg');
	background-size: cover;
	background-position: bottom center;    
	color: white; text-align:center;
	font-weight: 700;  
	font-size:2rem;
}

.content{
	display: flex; flex-direction: column; gap:2.5rem;
}

footer{
	flex: 0; height: 60px; padding: .5rem;
	background: white;
	color: var(--colour-theme-grey);
	font-size: 1.2rem;
	font-family: 'Gabarito', sans-serif; 
}

.container {
	width: 90%; height:100%;
	/*max-width: 1100px;*/
	margin: 0 auto;
	padding: 60px 0;
}

footer .container{
	padding:0;
	display: flex; gap: 1rem; justify-content: space-between;
	align-items: center;
}

.footer-column{
	display:flex; align-items:center;
}

footer p{margin:0;}

.color-grey{color: var(--colour-theme-grey);}

h1, h2, h3 {
	line-height: 1;
	font-weight: 900;
	font-family: 'Raleway', sans-serif; 
	margin:0; padding:0;
}

h1 {
	font-size: 2.2rem;
}

h2 {
	font-size: 4rem;
	text-align: center;            
}

h3 {
		font-size: 1.25rem;
}

p {
	margin: 0; padding:0;
}

.social-icons{display: flex; gap: .5rem; align-items: center;}

.social-icon {
	display: inline-block;		
	width: 24px; height: 24px;	
	background-size: auto;
	background-position:center center;
	background-repeat: no-repeat;
	fill: var(--colour-theme-grey);
	filter: var(--svg-filter-theme-grey);
}

.social-icon-instagram{
	background-image:url('../svg/social/instagram.svg');
}

.social-icon-facebook{
	background-image:url('../svg/social/facebook.svg');
}    

.logo img{height:120px;max-width: 100%;}

.address br{display:none;}

/* --- RESPONSIVE STYLES --- */
@media (max-width: 800px) {
	html, body{height:100vh;background: black;}
	.logo img{height:70px;}
	h2{font-size:3rem;line-height: 1.2;}
	footer p{font-size: 1rem;font-weight:700;}
	footer {height:unset;}
	footer .container{flex-direction: column;padding:1rem 0;}
	.address{order:1;text-align:center;}
	.address br{display:block}
	.social{order:2;}
	.contact{display:flex;flex-direction:column;gap:1rem;}
	.contact span{display:none;}            
}        

a{
	color:inherit;
	text-decoration:none;
}