.grid{
	display:grid;
	grid-template-columns:1fr 1fr 1fr;

}

.details{
	grid-column:1/4;
	margin-top:80px;
	width:70%;
	margin-left:15%;
	text-align:center;
	font-size:20px
}

.contact{
	grid-column: 1/4;
}

.contact-form{
	width:40%;
	margin-top: 50px;
margin-bottom: 100px

}

.contact-form input, textarea{
	font-size: 20px;
	font-family: 'Calibri';
	width:100%;
	border:none;
	outline:none;
	border-bottom: 1px solid #4A4C67;
	height:60px;
	padding-top: 10px;
	padding-bottom: 10px;
	color:#4A4C67
}

.contact-form .placeholder {
	color: white;
	background-color: #4A4C67
}

#robotTxt{
	font-size: 20px;
	font-family: 'Calibri';
}

#robot{
	position: inline
}

form .submit{
	font-family: 'Calibri';
	background-color: #0682CD;
	color: white;
	border-bottom: none;
	margin-top: 30px

}

form .submit:hover{
	background-color: #52ADE4;
	cursor: pointer
}







.contactLogos{
	grid-column:1/4;
	margin-top:80px;
	margin-bottom:80px
}


.logos{position:absolute;
	margin-top:500px;
	width:100%
}

.gallery {

  width: 630px;
  margin: 0 auto;
  padding: px;
  background: white;
  box-shadow: 0 1px 2px rgba(0,0,0,.3);
}

.gallery > div {

  position: relative;
  float: left;
  padding: 25px;
}

.gallery > div > img {

  display: block;
  width: 300px;
height:250px;
  transition: .1s transform;
  transform: translateZ(0); /* hack */
}




#slide{
	width:75px;
	height:75px
}

@media screen and (max-width:1000px){
	.contact-form{width:50%}
}

@media screen and (max-width:880px){
	.details{
		margin-top:70px}
	.logos{margin-top:350px}

}

@media screen and (max-width:750px){
	.details{width:90%; margin-left:5%}
	.gallery{width:430px}
	.gallery > div {
			padding: 5px;
	}
}

@media screen and (max-width:700px){
	.contact-form{width:80%}
}

@media screen and (max-width:540px){
	.details{font-size:16px}
	.gallery{width:305px}
	#slide{
		width:50px;
		height:50px
	}
}

@media screen and (max-width:380px){
	.logos{margin-top:400px}
	.gallery{width:200px}
	#slide{
		width:30px;
		height:30px
	}
}