@font-face {
	font-family: gilroy-light;
	src: url(../fonts/Gilroy/Gilroy-Light.ttf);
}
@font-face {
	font-family: gilroy-bold;
	src: url(../fonts/Gilroy/Gilroy-Bold.ttf);
}

*{
	box-sizing: border-box;
    margin:0;
	padding:0;
	font-family: gilroy-light;
}
html, body{
    background-color: #F1F2F2;
    height: 100%;
}

h1{
	font-size: 18pt;
	padding: 10px;
}
h2{
	font-size: 16pt;
	padding: 10px;
}
h3{
	font-size: 14pt;
}
p{
	font-size: 12pt;
}
.bold{
	font-family: gilroy-bold;
}

#logo{
	width: 100%;
	height: 40%;
	display: flex;
}
#logo a{
    margin: auto;
}
#logo a img{
	max-width: 100%;
}

#mensagem{
	width: 100%;
	height: 20%;
	display: flex;
}
#mensagem .text{
	margin: auto;
	text-align: center;
}

#container{
	display: table;
	width: 100%;
	height: 40%;
	padding: 5%;
}

#container .contactos{
	width: 50%;
	height: 100%;
	float: left;
}

.telefone-header, .morada-header{
	text-align: center;
}




@media only screen and (max-width: 800px) {
	#logo a {
		max-width: 60%;
	}
	#logo a img{
		max-width: 100%;
	}
}
@media only screen and (max-width: 768px) {
	#container .contactos {
	    width: 100%;
	    height: auto;
	}
	.telefone-header, .morada-header{
		margin-top: 5%;
	}
}
@media only screen and (max-width: 450px) {
	h1{
		font-size: 14pt;
	}
	h2{
		font-size: 12pt;
	}
	h3{
		font-size: 12pt;
	}
	p{
		font-size: 12pt;
	}
	#logo a {
		max-width: 100%;
		padding: 5%;
	}
	
}