* {
	font-family: 'Raleway', sans-serif;
	box-sizing: border-box;
}

body {
	background-color: #F5F5F5;
	color:  #424242;
}

a {
	color:  #424242;
}

main {
	padding:  2em;
	position: relative;
	text-align: center;
}

header {

	max-width: 1050px;
	position: relative;
	margin-left: auto;
	margin-right: auto;

}

header img {
    width: 100%;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

#hero {
	width: ;
	padding: 0;

	
}



#info {
	text-align: left;
	padding: 3rem;
	padding-top: 0;
}

#announcements {
	display: flex;
	flex-wrap:  wrap;
	justify-content: center;
	max-width:  2000px;
	text-align: left;
	position: relative;
	 margin-left: auto;
  margin-right: auto;
}

article {
	width: 22%;
	min-width: 300px;
	max-width:  500px;
	margin: 1rem;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
article .outer  {
	height: 0;
	overflow: hidden;
	padding-top: 140%;
	position: relative;
	background-repeat: no-repeat;
	background-size: cover;
	background-color:   #A9A9A9;
}
article .inner {
	position: absolute;
	top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(255,255,255,.85);
    opacity: 0;
    transition:  300ms;
    
}

article .inner:hover {
	opacity: 1;
}

article .inner section {
	position: absolute;
	bottom:  0;
	padding:  1rem;
	padding-bottom:  15%;
	text-shadow: 0px 0px 2px #ffffff;
}

article p {
	font-size: .85rem;
}




/* Footer
  --------------------------------------------- */  

footer {
	background-color: #e62b8a;
	width: 100vw;
	font-size: 1em;
	color: #fff;
	text-align: center;
	padding: 2em 0;
	
	bottom: 0;
}

footer a {
	color: #fff;
	text-decoration: none;
	transition: 300ms;
}

.links {
	font-weight: bold;
}

footer a:hover,
footer a:active,
footer a:focus {
	color: #ffffff;
	-webkit-filter: invert(100%);
 	-moz-filter: invert(100%);
  	-o-filter: invert(100%);
  	-ms-filter: invert(100%);
  	filter: invert(100%);
}

.copyright {
	font-size: .5em;
	color: #fff;
	text-align: center;
	margin-bottom: 1em;
}
 
 footer img {
 	width: 100%;
 }
footer .container {
	display: flex;
	justify-content:  center;
	margin-bottom:  1em;
	max-width: 1500px;
	margin-left: auto;
	margin-right: auto;
}

footer .container div {
	width:  30%;
}