footer {
	background-color: black;
	padding: 5px;
}

.footercontentContainer {
	background-color: #191a1a;
	height: 100%;
	max-width: 960px;
	margin: auto;
}

.logofooterWrapper {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-areas: ". logofooterStuff ."
}


.footerlogoContainer {
	display: grid;
	grid-column: 1fr 1fr 1fr;
	margin: auto;
	grid-template-areas:
	". logofooter ."
	". footertitle ."
	". footertitledetails ."

}

.footerImage {
	grid-area: logofooter;
	margin: auto;
	padding: 0px;
}

.footerTitle {
	grid-area: footertitle;
	margin: auto; 
	font-size: 30px;
    font-weight: normal;
    font-family: Century Gothic, Serif;
    color: white;
}

.footerTitleDetails {
	grid-area: footertitledetails;
	margin: auto;
	font-size: 14px;
    font-weight: normal;
    font-family: Century Gothic, Serif;
    color: white;
}

.footerLogoTitle {
	text-decoration: none;
	grid-area: logofooterStuff;
}

.footercontentWrapper {
	display: grid;
	grid-column: 1fr 1fr 1fr 1fr;
	margin: auto;
	grid-template-areas:
	"contactInfo Hours Social .";
}

.Hours {
	grid-area: Hours;
	color: white;
}

.Hours h3 {
	font-weight: lighter;
	font-family: Century Gothic, Serif;
	font-size: 28px;
}

.Hours p {
	font-weight: lighter;
	font-family: Century Gothic, Serif;
	font-size: 14px;
}


.Social {
	grid-area: Social;
    color: white;
    font-family: Century Gothic, Serif;
}


.Social h3 {
	font-weight: lighter;
	font-family: Century Gothic, Serif;
	font-size: 28px;
}

.contactInfo {
	grid-area: contactInfo;
    color: white;
    font-family: Century Gothic, Serif;
    padding-left:20px;
}


.contactInfo h3 {
	font-weight: lighter;
	font-family: Century Gothic, Serif;
	font-size: 28px;
}


@media only screen and (max-width: 450px) {

.logofooterWrapper {
	display: grid;
	grid-template-columns: 1fr;
	grid-template-areas: "logofooterStuff";
}


.footerlogoContainer {
	display: grid;
	grid-column: 1fr;
	margin: auto;
	grid-template-areas:
	"logofooter"
	"footertitle"
	"footertitledetails";

}

.footercontentWrapper {
	display: grid;
	grid-column: 1fr;
	grid-template-areas:
	"contactInfo"
	"Hours"
	"Social";
}

.Hours {
	grid-area: Hours;
	color: white;
	text-align: center;
}


.Social {
	grid-area: Social;
	color: white;
	text-align: center;
}

.contactInfo {
	padding-left: 0px;
	grid-area: contactInfo;
	color: white;
	text-align: center;
}

}