html,
body {
  height: 100%;
  width: 100%;
}

body {
  font-family: Lato;
  font-weight: 300;
}

 h1, h4 {
	font-family: Lato;
	font-weight: 300;
}

hr {
	width: 70%;
}
.showcase {
  height: 100%;
  width: 100%;
  margin: auto;
  background: url(images/background.jpg) no-repeat 50% 50%;
  display: table;
  top
  background-size: cover;
}

.showcase img {
	width: 80%;
}

/*CARDS*/

.card {
  margin: 0 20px 20px 20px;
  border-radius: 0;
  border: none;
  box-shadow: 0 2px 2px 0.75px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0);
}

.card:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-transition: all 0.3s ease-in-out 0s;
}

/*CONTACT PAGE*/

.map {
	align-self: center;
}

.contact {
	border: none;
	margin-top: 17%;
	background: rgba(255, 255, 255, 0.8);
	height: 100%;
	box-shadow: 0 4px 6px 2px rgba(0, 0, 0, 0.2), 0 0px 4px 0 rgba(0, 0, 0, 0);
}

.contact:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-transition: all 0.3s ease-in-out 0s;
}

label {
	font-weight: 200;
}

textarea {
	width: 300px;
	height: 100px;
	font-weight: 200;
	outline: none;
}
.form-control input {
	font-weight: 200;
	background: transparent;
	border: 0px;
	border-bottom: 1px solid grey;
	outline: none;
}

input[type=text] {
	width: 300px;
}

.align-left {
	display: inline-block;
	text-align: left;
}

a{
	color: #6f6e73;
}

a:hover {
	color: black;
}