@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,700);


body {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: white;
	background-color: #bdbdbd;
	font-weight: 400;
}

.container {
	max-width: 960px;
	margin: 0 auto; 
}

header {
	background-color: #ffffff;
	/* we need to determine the height of the header first if we then want to set the line-height to center txt and images */
	/* the technique of header height, line height and vertical align only really works for one line like the header not when you have multiple lines like in the third section of this project */
	height: 75px;
	/* takes out the natural flow of the page and it causes it to stick to one place */
	position: fixed;
	/* use top like a co-ordinate system opx from the top of the page */
	top: 0;
	width: 100%; 
	/* the last number on the rgba refers to transparency */
	box-shadow: 0 0 10px rgba(0,0,0,0.4);
	

}

h1 {
	/* an image, by default, sits at the bottom of the line height and while text sits in the middle */
	/* line height matches the height of a tag it is inside of */
	float: left;
	line-height: 75px;
}

h1 img {
	/* vertical-align only works if the line-height has been set before */
	vertical-align: middle;
	width: 150px;
	height: 70px;
}

nav {
	float: right;
	line-height: 75px;
}

nav a {
	color: #777777;
	text-decoration: none; 
	padding: 0 15px 0 15px;

	/* inline-block takes some aspects of block and some of inline - most useful for ensuring things respect line-height */
	display: inline-block;
}

nav a img {
	line-height: 75px;
	color: red;
	text-decoration: none; 

	/* inline-block takes some aspects of block and some of inline - most useful for ensuring things respect line-height */
	display: inline-block;
	vertical-align: middle;
}

/* when using :hover ensure that there are no spaces before or after the colon */
nav a:hover {
	background-color: #bdbdbd;
	color: white;
}

.intro {
	height: 570px;
	overflow: hidden;
	margin: 75px 0 0 0;
	text-align: center;

}

.intro img {
	width: 250px;
	border-radius: 35px;
	margin: 20px 10px;
	text-align: center;
}

.description {
	height: 630px;
	padding: 75px 0;
}

h2 {
	font-size: 36px;
	font-weight: 700;
	margin: 0 0 30px 0;
	color: #b20000;
}

p {
	margin: 30px 0 30px 0;	
	text-align: justify;
	font-size: 20px;
}	

.parceiros{
	height: 650px;
	padding: 75px 0;
}
.parceiros img {
	width: 180px;
	/*border-radius: 35px;*/
	margin: 20px;
	padding: 30px 0;
	text-align: center;
	vertical-align: middle;
}

.logoparceiros {
	vertical-align: middle;
	text-align: center;
}

.contact {
	background: url(../Images/mapjordao.png) center no-repeat; 
	background-size: cover;
}

.endereco {
	height: 600px;
	padding: 75px 0;

}

.endereco h3 {
	font-size: 30px;
}
.endereco p {
	margin: 0;	
	text-align: justify;
	font-size: 20px;
}	

.rua {
	float: left;
	color: #505050;
	font-weight: 600;
}

.outros {
	float: right;
	color: #505050;
	font-weight: 600;

}


footer {
	background-color: #ffffff;
	height: 75px;
	top: 0;
	width: 100%;
	box-shadow: 0 0 10px rgba(0,0,0,0.4);
	text-align: center;
}

footer img {
	padding: 15px;
}

/*Equipe css*/

.equipemenu {
	background-color: #ffffff;
	height: 75px;
	top: 0;
	width: 100%; 
	margin: 75px 0 0 0;
	position: fixed;


}

.equipemenu a {
	color: #777777;
	text-decoration: none; 
	padding: 0 15px 0 15px;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	/*float: center;*/
	line-height: 75px;
}

.equipemenu a:hover{
	background-color: #bdbdbd;
	color: white;

}

.equipe {
	height: 300px;
	margin: 175px auto;
	text-align: center;
	max-width: 960px;
	/*margin: 0 auto; */
}
.equipe .funcionario a img {
	width: 90px;
	height: 90px;
	border-radius: 45px;
	/*margin: 20px 10px;*/
	text-align: center;
}

.funcionario {
	width: 10%;
	/* float lets items sit right next to each other */
	float: left;
	/* the margin to right and left here would count from the item next to it */
	/*margin: 70px 0;*/
	/*text-align: center;*/

}

.equipe h2 {
	font-size: 30px;
	font-weight: 700;
	/*margin: 0 0 30px 0;*/
	color: #b20000;
	text-align: left;
	padding: 10px 0 100px 0;
}

.equipe .funcionario a h3 {
	color: #b20000;
	text-decoration: none; 
	padding: 15px;

	/* inline-block takes some aspects of block and some of inline - most useful for ensuring things respect line-height */
	display: inline-block;
}

.equipe .funcionario a h3:hover {
	background-color: #b20000;
	color: white;
}